<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div id="map" style="height: 550px"></div>
</div>
</div>
</div> <script type="text/javascript" src="http://gmaps-utility-gis.googlecode.com/svn/trunk/fusiontips/src/fusiontips_compiled.js"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=geometry,places,visualization&sensor=true"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
window.onload = function() {
$('#crime').addClass('active');
get_vehcile_theft_archive();
};
var heat =[];
function get_vehcile_theft_archive(){
$.ajax({
url: '<?php echo URL;?>police_vehicletheft/get_vehcile_theft_archive',
type: 'POST',
dataType: 'json',
success: function(data) {
for (var i in data){
heat[i]=new google.maps.LatLng(data[i].latitude, data[i].longitude);
}
console.log(heat);
}
});
}
var center_guwahati = new google.maps.LatLng(26.171523,91.756096);
var map;
google.maps.event.addDomListener(window, 'load', initialize);
function initialize() {
var myOptions = {
zoom: 12,
center: center_guwahati,
mapTypeId: google.maps.MapTypeId.ROADMAP,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
};
var map = new google.maps.Map(document.getElementById('map'),myOptions);
var style = [
{
"stylers": [
{ "visibility": "simplified" },
{ "saturation": -100 },
{ "gamma": 0.77 }
]
}
];
var styledMapType = new google.maps.StyledMapType(style, {
map: map,
name: 'stylers'
});
map.mapTypes.set('map-style', styledMapType);
map.setMapTypeId('map-style');
console.log(heat);
var heatMapData = heat;
var heatmap = new google.maps.visualization.HeatmapLayer({
data: heatMapData
});
heatmap.setMap(map);
}
heatMapData 変数の何が問題になっていますか? なぜすべての値を取得しないのですか? 上記のajax関数はmysqlから値を取得し、それをグローバル変数に設定しましたが、ヒートマップでそのデータを取得していません。