在javascript中的谷歌地图上显示标记
问题描述:
我是一个Javascript初学者,我试图在谷歌地图上创建标记。所以首先我从我裂开来获得lattitude和longlitude值的数据库获取GPS坐标,那么我他们在C#中增加了2个独立的列表框称为lstBoxLatGPS和lstBoxLongGPS现在在javascript中的谷歌地图上显示标记
foreach (string item in GPSLatList)
{
lstBoxLatGPS.Items.Add(item);
}
foreach (string item in GPSLongList)
{
lstBoxLongGPS.Items.Add(item);
}
在Javascript我想借此在列表框的项目和创建地图上的标记我有2个功能:
function GetLatValues()
{
var arrValues= new Array();
var listBox = document.getElementById("<%=lstBoxLatGPS.ClientID%>");
for (var i = 0; i < listBox.options.length; i++)
{arrValues[i]= listbox.options[i].text }
return (arrValues);
}
function GetLongValues()
{
var arrValues= new Array();
var listBox = document.getElementById("%=lstBoxLongGPS.ClientID%>");
for (var i = 0; i < listBox.options.length; i++)
{arrValues[i]= listbox.options[i].text }
return (arrValues);
}
然后到阵列添加到所做的标记:
function initialize()
{
var mapCanvas = document.getElementById('map-canvas');
var mapOptions =
{
center: new google.maps.LatLng(-28.4792811, 24.6722268),
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(mapCanvas, mapOptions);
map.set('styles', [
{
"featureType": "landscape",
"stylers": [
{ "color": "#c9d7bb" }
]
}, {
"featureType": "administrative.province",
"elementType": "labels.text",
"stylers": [
{ "visibility": "on" },
{ "color": "#ffc23d" }
]
}, {
"featureType": "poi.attraction",
"stylers": [
{ "visibility": "on" },
{ "color": "#9be586" }
]
}, {
"featureType": "administrative.province",
"elementType": "geometry",
"stylers": [
{ "visibility": "on" },
{ "color": "#000000" },
{ "weight": 3.2 }
]
}
]);
var GPSLatArray = new Array();
var GPSLongArray = new Array();
GPSLatArray = GetLatValues();
GPSLongArray = GetLongValues();
for (var i = 0; i < GPSLatArray.length; i++)
{
var marker = new google.maps.Marker({position: GPSLatArray[i],GPSLongArray[i] });
marker.setMap(map);
}
}
google.maps.event.addDomListener(window, 'load', initialize);
当应该显示地图时,它只是空白,根本不显示地图。
答
我用Artem.Google包创建地图,现在它的工作。
答
你需要在你的aspx页面添加一个div来显示地图。
<div class="img-thumbnail" id="map-canvas" style="width: 369px; height: 289px;"></div>
是的,我已经对不起,
它显示地图,直到我试图添加标记。 – user5110647