[英]Assigning Different Markers in Google Maps
I am working on a project using Google maps and Classic ASP . 我正在使用Google Maps和Classic ASP进行项目。 The map has various locations which are pulled out of the DB and that is fine and works perfectly.
该地图具有从数据库中拉出的各种位置,这很好并且可以正常工作。
What I want need to do is assign different markers depending on property type etc. 我需要做的是根据属性类型等分配不同的标记。
I have searched and cannot find how to do as my javascript is not great. 我已经搜索过,但找不到方法,因为我的JavaScript不好。 Any pointers would be gratefully received.
任何指针将不胜感激。 I do need to use the following code, but tweaked.
我确实需要使用以下代码,但对其进行了调整。
PS: I have taken the ASP delimiters out as code seemed to be trying to execute :-) PS: 由于代码似乎试图执行:-),因此我将ASP分隔符删除了
var icon = new google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/micons/blue.png",
new google.maps.Size(32, 32), new google.maps.Point(0, 0),
new google.maps.Point(16, 32));
var center = null;
var map = null;
var currentPopup;
var bounds = new google.maps.LatLngBounds();
function addMarker(lat, lng, info) {
var pt = new google.maps.LatLng(lat, lng);
bounds.extend(pt);
var marker = new google.maps.Marker({
position: pt,
icon: '../img/map/Bar.png',
map: map
});
var popup = new google.maps.InfoWindow({
content: info,
maxWidth: 500
});
google.maps.event.addListener(marker, "click", function() {
if (currentPopup != null) {
currentPopup.close();
currentPopup = null;
}
popup.open(map, marker);
currentPopup = popup;
});
google.maps.event.addListener(popup, "closeclick", function() {
map.panTo(center);
currentPopup = null;
});
}
function initMap() {
map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(0, 0),
zoom: 14,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
},
navigationControl: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.SMALL
}
});
sSQL = "select id, name, province, lat, lng, map_include, map_type from resort where (map_include = 'Playa Del Ingles' and live = 1) order by id asc"
Set ors = cn.Execute(sSql)
do while not ors.eof
//loop does stuff here which I won't bore you about
response.write "addMarker(" & lat & "," & lon & ",'<h4 style=""margin-bottom:10px"">" & name & "</h4><img class=""prop_img"" src=""../resorts/" & prop_id & "/1.jpg""><div style=""width:300;float:left""><strong>" & prop_type & "</strong><br />" & province & "<br /><a href=""../" & page_url & "/resort.asp?hid=" & prop_id & """>More Details</a></div>')" & VbCrLf & ";"
ors.movenext
loop
center = bounds.getCenter();
map.fitBounds(bounds);
}
Without changing alot of your code, I would change the addMarker method to include an 'icon' parameter, so change 无需更改大量代码,我将更改addMarker方法以包含“ icon”参数,因此请更改
function addMarker(lat, lng, info) {
to 至
function addMarker(icon, lat, lng, info) {
Then change the 'icon' property from the new marker, change 然后从新标记更改“ icon”属性,
var marker = new google.maps.Marker({
position: pt,
icon: '../img/map/Bar.png',
map: map
});
to 至
var marker = new google.maps.Marker({
position: pt,
icon: icon,
map: map
});
and lastly change the addMarker call 最后更改addMarker调用
addMarker(" & lat & "," & lon & ", ...
to 至
addMarker(YourIconURLHere, " & lat & "," & lon & ", ...
You'd need to change the icon url based on the property (or the map_type I presume) you get from your SQL query. 您需要根据从SQL查询中获得的属性(或我认为的map_type)更改图标的url。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.