Google地图未加载。 只显示空白div
这里是我的代码段
public class Model {
@SerializedName("cust_id")
@Expose
private Integer custId;
@SerializedName("cust_uri")
@Expose
private String custUri;
public Integer getCustId() {
return custId;
}
public void setCustId(Integer custId) {
this.custId = custId;
}
public String getCustUri() {
return custUri;
}
public void setCustUri(String custUri) {
this.custUri = custUri;
}
}
我认为我的逻辑是正确的。任何人都可以帮我弄清楚问题是什么。
Thnx提前。 。 。 !
答案 0 :(得分:1)
<div class="col-md-9 col-sm-12">
<div id="map-container" style="width: 100%; height:400px;"></div>
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script>
function init_map() {
var var_location = new google.maps.LatLng(35.710107,73.039610);
var var_mapoptions = { center: var_location, zoom:17 };
var var_marker = new google.maps.Marker({ position: var_location, map: var_map, title:"Test"});
var var_map = new google.maps.Map(document.getElementById("map-container"), var_mapoptions);
var_marker.setMap(var_map);
}
google.maps.event.addDomListener(window, 'load', init_map);
</script>
</div>
您需要为地图容器创建另一个div并添加宽度&amp;高度。
答案 1 :(得分:1)
首先,您需要一个您似乎没有的API密钥。
然后基本上只需按照谷歌地图api教程,就像你似乎已经做了一样。
<style>
#map {
height: 400px;
width: 400px;
}
</style>
<div id="map"></div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
(https://developers.google.com/maps/documentation/javascript/examples/map-simple)