2

我在谷歌地图上工作，要创建三个以上的瓷砖叠加层。一个例子：

瓷砖叠加

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);

但是，为了避免在我的映射范围之外丢失图块而导致 404 错误，我的代码稍微复杂一些；因此，我打算创建一个循环，将分配给每个叠加层的特定关键字（此处为“停车”）插入到上述代码中。因此：

循环

var tileNames = ["base", "parking", "access"];

for (var i = 0; i < tileNames.length; i++) {
    //insert Tile Overlay code here
};

但是，我有一个特殊的问题：我找不到从 tileNames 数组中获取字符串并使用它们来初始化 Tile Overlay 代码中的两个变量的方法。理想情况下，我想实现这样的目标：

尝试 1

var tileNames[1] + "Options" = {  //ideally: var parkingOptions = {
    //insert remaining code
};

但是，这不起作用，我也没有真正期望它。也不会尝试创建那些完整的字符串并尝试将其插入到初始化中：

尝试 2

var newOptions = tileNames[1] + "Options";
var newOptions = {
    //insert remaining code
};

因此，有没有办法将字符串放入初始化变量中？

注意：我已经包含了我自己的替代解决方案作为答案。它应该可以工作，但它会破坏变量的名称并将其替换为一个不起眼的数组变量。我最好保留一个描述性变量名称，因为它们经常用于在结果代码中添加和隐藏覆盖。

解决方案 无论如何对于这个问题......

var tileNames = ["beloit", "parking", "access"];
var mapType = {};

for (var i = 0; i < 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);
};

谜题的另一部分，getTileUrl 函数中的“tileNames[i]”是未定义的，因为函数在执行时需要它，而不是将名称字符串放入函数中；但是，这是一个新问题：Javascript: Making a variable static when defined a function in a loop?

4

4 回答 4

1

现在，我不知道上述是否确实可行（我更喜欢它，正如我将在下面解释的那样），但在起草这个问题时，事先阅读的各种其他 Q/AI 开始变得更有意义。他们的一般信息：“使用数组”：

可能的解决方案 （已编辑；现在应该可以使用了。）

var tileNames = ["beloit", "parking", "access"];  //Would be used more than once.
var tileMapType = [];

for (var i = 0; i < 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)
    };
    tileMapType[i] = new google.maps.ImageMapType(tileOptions);
};

这种方法的唯一问题是，在下面的代码中，我必须将这些 MapTypes 放入地图中，并将它们切换为可见和不可见，并且使用不具描述性的 tileMapType[x] 这样做会妨碍整体可读性。 （也许这并不像我想的那么重要，但仍然如此。>。>）

于 2012-06-26T16:35:05.800 回答
1

你不能这样做：

var tileNames[1] + "Options" = {
  //insert remaining code
};

但你可以这样做：

window['a'] = 'b';
alert(a); // shows 'b'

或者如果你在一个函数中

this['a'] = 'b';

编辑：

var obj = {};
obj.a = 'a';
// obj.a == obj['a']
alert(obj['a']) // alerts a
于 2012-06-26T16:38:33.460 回答
1

假设我已经理解您的问题，您可以将您的图块封装在一个对象中，并通过您提供的名称引用该图层：

var tileNames = ["base", "parking", "access"];
var Tiles = {};

for (var i = 0; i < tileNames.length; i++) {
    Tiles[tileNames[i]] = makeOverlay(tileNames[i], coords, zoom);
};

//iterate the maps
for (var tile in Tiles)
   alert(Tiles[tile].someGoogleMapPropery)

//individually     
alert (Tiles.base.someGoogleMapPropery)
alert (Tiles.parking.someGoogleMapPropery)
//or
alert (Tiles["access"].someGoogleMapPropery)


function makeOverlay(name, coords, zoom) {
    return new google.maps.ImageMapType({
            getTileUrl: function(coord, zoom) {
                return "/maps/tiles/tiles" + name + "/" + zoom + "_" + coord.x + "_" + coord.y + ".png";
            },
            tileSize: new google.maps.Size(256, 256)
        });
}​
于 2012-06-26T17:05:04.593 回答
0

可以使用 eval() 读取类似的变量，但不能设置它们。

例子：

var a = "b"; 变量 b = "c"; 评估（一）；// 返回“c”

于 2012-06-26T16:42:40.013 回答