回答
这很容易实现,你可能没有尝试过。以下是根据你的代码json。
的Javascript:
<script>
//debugger;
var json;
//var json = JSON.parse('[{"PosID":12087,"TagID":11,"Tag":"","AssetID":14,"Asset":"","Driver":"","FixID":0,"Fix":"No Fix","Satellites":0,"PosX":-25.363882,"PosY":131.044922,"PosZ":59.0,"Speed":0.0,"Course":237.0,"HDOP":0.0,"Ignition":0,"Engine":"STOP","Mileage":8.0,"Battery":25.5,"Fuel":0.0,"LocID":0,"Location":"8 Tuas Avenue 18","ZoneID":0,"Zone":"","Remarks":null,"Timestamp":"2015-03-17T12:51:50","RxTime":"2015-03-17T12:51:50","Temperature":0.0,"Temperature2":0.0,"RFID":null,"FuelLevel":0.0,"ActualTemp":0.0,"IsBuffer":false},{"PosID":12088,"TagID":11,"Tag":"","AssetID":14,"Asset":"","Driver":"","FixID":0,"Fix":"No Fix","Satellites":0,"PosX":-25.363882,"PosY":141.044922,"PosZ":59.0,"Speed":0.0,"Course":237.0,"HDOP":0.0,"Ignition":0,"Engine":"STOP","Mileage":8.0,"Battery":25.5,"Fuel":0.0,"LocID":0,"Location":"8 Tuas Avenue 18","ZoneID":0,"Zone":"","Remarks":null,"Timestamp":"2015-03-17T12:51:50","RxTime":"2015-03-17T12:51:50","Temperature":0.0,"Temperature2":0.0,"RFID":null,"FuelLevel":0.0,"ActualTemp":0.0,"IsBuffer":false}]');
$.ajax({
'async': false,
'global': false,
'url': "http://track.asiacom.co.th/fmswebapi/api/posinfo",
'type': "Get",
'dataType': "json",
'success': function (data) {
json = data;
}
});
var m = [];
function initialize() {
var bounds = new google.maps.LatLngBounds();
var infowindow = new google.maps.InfoWindow();
var myLatlng = new google.maps.LatLng('103.639275', '1.3208363');
var mapOptions = {
center: myLatlng,
zoom: 8
//mapTypeId: google.maps.MapTypeId.HYBRID
};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
if (json.length > 0) {
$(json).each(function (i) {
var latlng = new google.maps.LatLng(json[i].PosX, json[i].PosY);
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: json[i].Location
});
m.push(marker);
//extend the bounds to include each marker's position
bounds.extend(marker.position);
});
//now fit the map to the newly inclusive bounds
map.fitBounds(bounds);
}
}
//google.maps.event.addDomListener(window, 'load', initialize);
$(document).ready(function(){
initialize();
});
</script>
的Html
<div class="map-outer row">
<div id="map-canvas" class="map-view" style="height:700px; width:100%;">hello</div>
</div>
你必须包括以下JS也除了jQuery的库。
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
我已经运行代码woth你json纬度/长,这似乎是错误的。你应该检查它。 – 2015-04-02 13:30:36
我想实现从javascript调用WebAPI - http://track.asiacom.co.th/fmswebapi/api/posinfo?它似乎不起作用 – 2015-04-03 02:20:28
var assets = (function() {
var json = null;
$.ajax({
'async': false,
'global': false,
'url': "http://track.asiacom.co.th/fmswebapi/api/posinfo",
'type': "Get",
'dataType': "json",
'success': function (data) {
json = data;
}
});
return json;
alert("OK, data loaded");
});
- 事情是这样的代码
这与Google地图无关。您的代码仅显示对服务器的ajax调用。 – 2015-04-03 04:29:20
如何使用这个Web API - track.asiacom.co.th/fmswebapi/api/posinfo到谷歌地图? – 2015-04-04 08:20:15
你的WebAPI只会给你JSON,之后你必须在我的答案中提到的代码中使用它。 – 2015-05-01 05:00:58
- 1. 如何使用JPA数据库中的多个标记填充Google地图
- 2. 如何使用Google地图平滑地标记标记?
- 3. 使用JSON数据填充地图
- 4. 有效的geoJson未填充Google地图标记
- 5. Google地图标记
- 6. 使用GregorianCalendar填充地图
- 7. 使用jstl填充tr标识标记
- 8. Javascript:在Google地图上使用json文件添加标记
- 9. 使用JSON数组中的标记加载Google地图?
- 10. 使跨度填充标记
- 11. 基于地理位置填充Google Maps for Rails标记
- 12. 如何抵消Google地图标记?
- 13. 如何打印Google地图标记
- 14. 如何切换Google地图标记?
- 15. 如何使用JSON坐标将标记添加到OPENLAYERS地图?
- 16. 填充使用JSON
- 17. 使用来自URL的JSON数据来显示Google地图标记 - 如何?
- 18. 如何在Google地图上标注地图标记ios
- 19. Google地图中的Infowindow不会填充
- 20. 设置填充Google地图Android不移动按钮,只有标记
- 21. 如何使用json填充选择框?
- 22. 如何填充使用JSON和Ajax
- 23. 我如何使用json在postgresql中填充记录的更新?
- 24. GoogleMaps/JS:如何使用街道地址列表填充Google Map?
- 25. 如何使用andorid在Google地图上显示大量标记?
- 26. 如何使用ajax将标记添加到Google地图
- 27. 如何使用标记和折线显示Google地图?
- 28. Google地图标记群集
- 29. android + Google地图标记
- 30. Google地图API标记
您是否尝试过的东西,到目前为止,你可以与我们分享?你在显示标记时遇到了什么问题?请[编辑](http://stackoverflow.com/posts/29386957/edit)你的问题,并提供更多的细节。 – honk 2015-04-01 09:19:36
嗨!我想使用这个WebAPI - http://track.asiacom.co.th/fmswebapi/api/posinfo。并在谷歌地图中填充数据。 PosX纬度和PosY经度。谢谢 – 2015-04-02 13:02:38