Note that there are some explanatory texts on larger screens.

plurals
  1. POJavascript: Initializing a variable from a string?
    primarykey
    data
    text
    <p>I am working in Google Maps and have three+ tile overlays to create. An example:</p> <p><strong>Tile Overlay</strong></p> <pre><code>var parkingOptions = { //Parking Overlay getTileUrl: function(coord, zoom) { return "/maps/tiles/tilesparking/" + zoom + "_" + coord.x + "_" + coord.y + ".png"; }, tileSize: new google.maps.Size(256, 256) }; var parkingMapType = new google.maps.ImageMapType(parkingOptions); </code></pre> <p>However, to avoid 404 errors by missing tiles outside of my mapping range, my code is a little more complex; thus, I intended to make a loop where a specific keyword assigned to each overlay <em>(here given as "parking")</em> would be inserted into the above code. Thus:</p> <p><strong>For Loop</strong></p> <pre><code>var tileNames = ["base", "parking", "access"]; for (var i = 0; i &lt; tileNames.length; i++) { //insert Tile Overlay code here }; </code></pre> <p>However, I have one particular issue: I can not find a way to take the string from the tileNames array and use them in initializing the two variables in the Tile Overlay code. Ideally, I would like to achieve something like this:</p> <p><strong>Attempt 1</strong></p> <pre><code>var tileNames[1] + "Options" = { //ideally: var parkingOptions = { //insert remaining code }; </code></pre> <p>However this doesn't work, nor did I really expect it to. Neither would trying to create those full strings and trying to insert it into the initialization:</p> <p><strong>Attempt 2</strong></p> <pre><code>var newOptions = tileNames[1] + "Options"; var newOptions = { //insert remaining code }; </code></pre> <p>Thus, is there a way to do place a string into initializing variables?</p> <hr> <p><strong>Note:</strong> I have included my own alternative solution to the problem as an answer. It should work, but it destroys the names of the variables and replaces it with a nondescript array variable. I preferably would like to retain a descriptive variable name as they are used often in adding and hiding the overlays in the resulting code.</p> <hr> <p><strong>Solution</strong> <em>For this question anyways...</em></p> <pre><code>var tileNames = ["beloit", "parking", "access"]; var mapType = {}; for (var i = 0; i &lt; tileNames.length; i++) { var tileOptions = { getTileUrl: function(coord, zoom) { return "/maps/tiles/tiles" + tileNames[i] + "/" + zoom + "_" + coord.x + "_" + coord.y + ".png"; }, tileSize: new google.maps.Size(256, 256) }; mapType[tileNames[i]] = new google.maps.ImageMapType(tileOptions); }; </code></pre> <p>The other part of the puzzle, the "tileNames[i]" in the getTileUrl function is undefined because the function wants it when it is executed rather than placing the name string into the function; however, that is a new question to be found here: <a href="https://stackoverflow.com/questions/11214807/javascript-using-a-string-to-define-a-function">Javascript: Making a variable static when defining a function in a loop?</a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload