Question

我正在使用 Google地图和经典ASP 开展项目。地图有不同的位置，从数据库中拉出来，很好，工作得很好。

我想要做的是根据属性类型等分配不同的标记。

我搜索过，找不到怎么做，因为我的javascript不是很好。任何指针都会感激不尽。我确实需要使用以下代码，但需要进行调整。

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);
}

Answer 1

在不更改代码的情况下，我会更改addMarker方法以包含“icon”参数，因此请更改

function addMarker(lat, lng, info) {

到

function addMarker(icon, lat, lng, info) {

然后从新标记更改'icon'属性，更改

var marker = new google.maps.Marker({
    position: pt,
    icon: '../img/map/Bar.png',
    map: map
});

到

var marker = new google.maps.Marker({
    position: pt,
    icon: icon,
    map: map
});

最后更改addMarker调用

addMarker(" & lat & "," & lon & ", ...

到

addMarker(YourIconURLHere, " & lat & "," & lon & ", ...

您需要根据从SQL查询中获得的属性（或我假设的map_type）来更改图标网址。

在Google地图中分配不同的标记

1 个答案: