我正在使用本地json文件在google地图中显示GeoMap位置..我可以正确显示地图但不显示其中的标记位置..请帮助
这是我的代码
var json;
$(document).ready(function(){
var map; var infowindow;
var jsonData = '[{ "id" : "1" , "Lat" : "-36.847043" ,"Lng" :"174.761543"},{ "id" :
"2"
, "Lat" : "-37.791174" ,"Lng" :"175.297813"},{ "id" : "3" , "Lat" : "-38.679988"
,"Lng" :"176.077843"},{ "id" : "4" , "Lat" : "-41.297257" ,"Lng" :"174.759483"} ]';
//alert(jsonData);
json = $.parseJSON(jsonData);
});
function InitializeMap() {
var Lat="-36.847043";
var Lng="174.761543";
var latlng = new google.maps.LatLng(Lat,Lng);
var myOptions =
{
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"), myOptions);
}
function markicons() {
InitializeMap();
var ltlng = [];
alert(json);
console.log(json.Lat);
for (var i=0; i <=json.length; i++)
{
alert(LatLng);
ltlng.push(new google.maps.LatLng(json[i].Lat, json[i].Lng));
}
//ltlng.push(new google.maps.LatLng(-36.847043, 174.761543));
// ltlng.push(new google.maps.LatLng(-37.791174,175.297813));
// ltlng.push(new google.maps.LatLng(-38.679988,176.077843));
// ltlng.push(new google.maps.LatLng(-41.297257,174.759483));
map.setCenter(ltlng[0]);
for (var i = 0; i <= ltlng.length; i++) {
marker = new google.maps.Marker({
map: map,
position: ltlng[i]
});
(function (i, marker) {
google.maps.event.addListener(marker, 'click', function () {
if (!infowindow) {
infowindow = new google.maps.InfoWindow();
}
infowindow.setContent("Message" + i);
infowindow.open(map, marker);
});
})(i, marker);
}
}
window.onload = markicons;
当我安装它时,这是我的错误:
未捕获的ReferenceError:未定义LatLng
帮助 - 提前谢谢
答案 0 :(得分:0)
您已定义 latlng 而非 LatLng 尝试以下内容:
for (var i = 0; i <= json.length; i++) {
ltlng.push(new google.maps.LatLng(json[i].Lat, json[i].Lng));
alert(ltlng[i]);
}
或者如果您需要var latlng = new google.maps.LatLng(Lat,Lng);
警报中的 latlng 值,然后首先必须更改变量名称并使用全局范围声明latlng。
试试这个:
<script type="text/javascript">
function markicons() {
var map = new google.maps.Map(document.getElementById("map"), {
mapTypeId : google.maps.MapTypeId.ROADMAP,
center : new google.maps.LatLng(-36.847043, 174.761543),
zoom : 6
});
var infowindow = new google.maps.InfoWindow({
content : "holding..."
});
var jsonData = '[{ "id" : "1", "Lat" : "-36.847043", "Lng" :"174.761543"},'
+ '{ "id" : "2", "Lat" : "-37.791174", "Lng" :"175.297813"},'
+ '{ "id" : "3", "Lat" : "-38.679988", "Lng" :"176.077843"},'
+ '{ "id" : "4", "Lat" : "-41.297257", "Lng" :"174.759483"} ]';
var json = $.parseJSON(jsonData);
var ltlng = [];
for (var i = 0; i < json.length; i++) {
ltlng.push(new google.maps.LatLng(json[i].Lat, json[i].Lng));
}
map.setCenter(ltlng[0]);
for (var i = 0; i < ltlng.length; i++) {
marker = new google.maps.Marker({
map : map,
position : ltlng[i]
});
(function (i, marker) {
google.maps.event.addListener(marker, 'click', function () {
if (!infowindow) {
infowindow = new google.maps.InfoWindow();
}
infowindow.setContent("Message" + i);
infowindow.open(map, marker);
});
})(i, marker);
}
}
google.maps.event.addDomListener(window, 'load', markicons);
</script>
Html:
<div id="map" style="width:700px;height:700px;"></div>
<强> Demo 强>