Google Maps API - 多个标记适用于localhost,而不适用于服务器?

时间:2015-05-08 22:31:25

标签: javascript google-maps google-maps-api-3

我是这个网站的新手,还有一个黑客程序员,所以我希望这个有用。我试图在我的HTML / Javascript代码中实现谷歌地图API的使用,我已经使用它一段时间没有问题显示单个地图和单个标记。但是,我正在向我的网上商店推出一种新型产品,对于那些我需要在点击产品时弹出的谷歌地图上显示多个标记的项目。 (新产品是数字地图,以前我只有印刷地图。)

现在我的问题是:当我从我的PC执行代码(即存储在我的' C:\'驱动器上)时,一切正常,但当我将其上传到我的网站服务器时,谷歌地图仅适用于具有与其关联的一个标记的商店项目,并且当具有多个标记的数字地图无法正确显示时,我不会收到任何类型的错误消息。更具体地说,地图在div中打开,div通常在被click事件召唤时隐藏,当我点击任何数字地图时,这个div只是保持隐藏状态。

我需要一个谷歌地图API"键"显示多个标记,就像我试图做的那样?我没有一个,不知道我在目前的代码中列出的密钥在哪里,我想我从谷歌开发者页面得到了它。

适用代码:

<script type="text/javascript"  src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDkmV2jHK_Be-3aG80eDF3APa5idTzbpZ4&sensor=false">

我使用google map callup的功能:

function initializeMap(lakeNumber, bigImage4Size) 
{        
var latitude = lakeArray[lakeNumber][8];
var longitude = lakeArray[lakeNumber][9];
var mapTitle = lakeArray[lakeNumber][0];
var lakeNotes = lakeArray[lakeNumber][12];
var zoomLevel = parseInt(lakeArray[lakeNumber][15]);
var myLatlng = new google.maps.LatLng(latitude, longitude);
var numOfLakes = 1;
var lakesString = "haww";
var lakesAsArray = [];
var temp = "";
var mapOptions = {          
    center: myLatlng,          
    zoom: zoomLevel,          
    mapTypeId: google.maps.MapTypeId.TERRAIN        
    };        

var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 

if(lakeArray[lakeNumber][14].search("Digital")>=0)                                  //if product clicked was digital map
{
    lakesString = lakeArray[lakeNumber][16];

    for(y = 0; y < numLakes; y++)                   //turns string with separated lakes into an array by breaking it up at commas
    {
        lakesAsArray[y] = lakesString.substring(0,lakesString.indexOf(","));            
        lakesString = lakesString.substring(lakesString.indexOf(",") + 2,lakesString.length);
        if(lakesString.length<=1)
            break;
    }
    numOfLakes = lakesAsArray.length;

    for(d = 0; d < numOfLakes; d++)
    {
        temp = lakesAsArray[d];
        lakesAsArray[d] = new Array(3);

        for (p = 0; p < numLakes; p++)
        {
            if(lakeArray[p][0].search(temp)>=0)                 //checks if correct product has been "scanned"  
            {
                    lakesAsArray[d][0] = temp;  //assigns lake title
                    lakesAsArray[d][1] = lakeArray[p][8];                   //assigns lake latitude
                    lakesAsArray[d][2] = lakeArray[p][9];                   //assigns lake longitude
                    p = numLakes - 1;
            }
        }
    }
}
else
{
    lakesAsArray[0] = new Array(3);
    lakesAsArray[0][0] = lakeArray[lakeNumber][0];   //assigns lake title
    lakesAsArray[0][1] = lakeArray[lakeNumber][8];   //assigns lake latitude
    lakesAsArray[0][2] = lakeArray[lakeNumber][9];    //assigns lake longitude
}

for(c = 0; c < numOfLakes; c++)
{
    var marker = new google.maps.Marker({
    position: new google.maps.LatLng(lakesAsArray[c][1], lakesAsArray[c][2]),
    map: map,
    title: lakesAsArray[c][0],
    });



}
document.getElementById("lake_label").innerHTML = mapTitle;
if(lakeArray[lakeNumber][14].search("Digital")>=0)
    {
    document.getElementById("lake_notes").innerHTML = "<FONT CLASS = 'three'>Includes: " + lakeArray[lakeNumber][16].substr(0,lakeArray[lakeNumber][16].length - 2)  + "</FONT>";
    }
else
    document.getElementById("lake_notes").innerHTML = lakeNotes;
}

我已尝试过此代码的各种迭代,并在Google地图API相关问题上进行了大量阅读,但无法在此处找到一个适用于我的解决方案。任何帮助将不胜感激!

0 个答案:

没有答案