Question

显然，Google地图只会在div中显示，如果它被称为'map_canvas'，这会让我有点问题。没有太多细节，我的应用程序基于Rails，呈现不同的页面，在一个页面上我想调用initialize_google_maps（），在另一个页面上我想调用initialize_google_maps2（）

但是如何区分两个不同的页面？有任何想法吗？例如，我使用下面的代码，并在带有map_canvas2的页面中，我认为通过嵌套map_canvas，我很聪明，如：

<div id="map_canvas2">
<div id="map_canvas"></div>
</div>

但是当我这样做时，两个函数都被调用 - initialize_google_maps（）;和initialize_google_maps2（）;我的代码是：

        if ($("#map_canvas").length)
        {

            initialize_google_maps();
        }

    if ($("#map_canvas2").length)
    {

      initialize_google_maps2();
    }

任何想法如何区分它们？感谢。

我的初始化函数就像（getElementById必须被称为'map_canvas'，从我读过的内容）：

function initialize_google_maps() {

    console.log('map canvas again'); 
    var currentlatlng = new google.maps.LatLng(map_latitude, map_longitude);
    var zoom = 10;
    var myOptions = {
        zoom: zoom,
        center: currentlatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP, // ROADMAP, SATELLITE, HYBRID
        streetViewControl: false
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    console.log("definition of map"); 

    var marker = new google.maps.Marker({map: map, position: currentlatlng, icon:{oppacity:0}});
   // map.setCenter(currentlatlng);
   // map.setZoom(zoom);
     console.log("definition of marker"); 

    var circle = new google.maps.Circle({
        map: map,
        fillOpacity: 0,
        strokeWeight: 2,
        strokeOpacity: 0.7,
        radius: 10000,
    });
    console.log("definition of circle"); 
    circle.bindTo('center', marker, 'position');
console.log("circle2");
  }

Answer 1

如果您查看下面的行（“map_canvas”），您可以将其更改为您需要的任何名称。只需确保在你的div中它与你在那行中改变的那些匹配。

 map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    console.log("definition of map");

Answer 2

应该是：

if ($("#map_canvas").length > 0)

在Google地图中寻找map_canvas问题的jquery解决方案

2 个答案: