我正在使用谷歌地图,并希望在infowindow中显示一个从数据库中获取的图像,而不是图像,它显示图像文件名(例如edit.png)。但是如何获得图像。
我正在获取图像的路径,但图像没有显示.Plese给我的解决方案是紧急的。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Show/Add multiple markers to Google Maps from database in asp.net website
</title>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC6v5-
2uaq_wusHDktM9ILcqIrlPtnZgEk&sensor=false">
</script>
<script type="text/ecmascript">
function initialize() {
$.ajax
({
type:'POST',
url: 'MapDetais.aspx',
data:'{}',
dataType: 'json',
async:false,
success: function(data)
{
for (var markers = 0; markers < data.length; markers++)
{
var name=data[markers].Name;
var lon=data[markers].Longitude;
var lat=data[markers].Latitude;
var desc=data[markers].Description;
var photo=data[markers].Photo;
}
var mapOptions =
{
center: new google.maps.LatLng(data[0].Latitude,data[0].Longitude),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
debugger
var infoWindow;
var map = new google.maps.Map(document.getElementById("map_canvas"),
mapOptions);
for (i = 0; i < data.length; i++) {
var data1 = data[i]
var imgMarker= new Image();
imgMarker.src=data1.Photo;
var IMG=imgMarker.src;
//imgMarker.src=data1.Photo;
//document.body.appendChild(imgMarker.src);
var myLatlng = new google.maps.LatLng(data1.Latitude, data1.Longitude);
var marker = new google.maps.Marker({
position: myLatlng,
map: map
});
var contentString='<div style="font-family:Arial, Helvetica, sans-serif;
font-weight:bold; color:#FF0000; font-size:12px">'
+data1.Name+" </div></br> <div>"+data1.Description+"</div> </br><div
align='center'>"+IMG+"</div></br>";
infoWindow = new google.maps.InfoWindow
({
content:contentString,
width:200,
height:100
});
infoWindow.open(map,marker);
google.maps.event.addListener(marker, "click", function() {
infoWindow.open(map, marker);
});
}
}
})
}
</script>
</head>
<body onload="initialize()">
<form id="form1" runat="server">
<div id="map_canvas" style="width: 500px; height: 400px"></div>
</form>
</body>
</html>