Question

尝试使用来自mysql的数据通过php显示谷歌热图。 JSON文件输出用于在地图上显示标记。无法弄清楚如何将JSON数据放入MVCArray。

JSON输出样本 - ＆gt; markers = [{"lat":45.903999,"lng":-92.570084,"visit":"08 06 2008","name":"on grasses ","loc":"parking area road.","loc2":"West side of road. "},{"lat":45.87561,"lng":-92.553482,"visit":"08 06 2008","name":"James Road","loc":"James Road .","loc2":"."}]

所以我得到了正确的浮点数，并将数据输出为数字而不是字符串。地图出现但没有热图显示。

    var map;
    var heatmap;
    var location;
    var pointArray;
    var bfloc;

          function loadmap() {
        var map = new google.maps.Map(document.getElementById('map'), 
        {
             center: new google.maps.LatLng(45.8598, -92.6010),
        mapTypeId: google.maps.MapTypeId.TERRAIN,
              zoom: 11        
            });

    for (var i = 0; i < markers.date.length; i++) {
    latLng = new google.maps.LatLng(markers.lat[i],markers.lng[i]); 
pointArray = new google.maps.MVCArray(latLng);
}     
heatmap = new google.maps.visualization.HeatmapLayer({
    data: pointArray,
    radius: 20,
  });

  heatmap.setMap(map);

}  
    google.maps.event.addDomListener(window, 'load', loadmap);

我正在加载可视化库。我尝试过渐变而没有消散。谢谢你的帮助！

Answer 1

这应该有效：

  var pointArray=[];    
  for (var i = 0; i < markers.length; i++) {   
    pointArray.push(new google.maps.LatLng(markers[i].lat,
                                           markers[i].lng));
  }

working fiddle

代码段

＆＃13;

var map;
var heatmap;
var location;
var pointArray = [];
var bfloc;
function loadmap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    center: new google.maps.LatLng(45.8598, -92.6010),
    mapTypeId: google.maps.MapTypeId.TERRAIN,
    zoom: 11
  });

  for (var i = 0; i < markers.length; i++) {
    pointArray.push(new google.maps.LatLng(markers[i].lat,
      markers[i].lng));
  }
  heatmap = new google.maps.visualization.HeatmapLayer({
    data: pointArray,
    radius: 20,
  });

  heatmap.setMap(map);

}
google.maps.event.addDomListener(window, 'load', loadmap);
var markers = [{
  "lat": 45.903999,
  "lng": -92.570084,
  "visit": "08 06 2008",
  "name": "on grasses ",
  "loc": "parking area road.",
  "loc2": "West side of road. "
}, {
  "lat": 45.87561,
  "lng": -92.553482,
  "visit": "08 06 2008",
  "name": "James Road",
  "loc": "James Road .",
  "loc2": "."
}];

＆＃13;

html,
body,
#map {
  height: 500px;
  width: 500px;
  margin: 0px;
  padding: 0px
}

＆＃13;

<script src="https://maps.googleapis.com/maps/api/js?libraries=visualization"></script>
<div id="map" style="border: 2px solid #3872ac;"></div>

＆＃13;

谷歌地图来自JSON的MVCArray

1 个答案: