指定Google地图中自定义标记的大小

时间:2013-10-18 19:22:48

标签: javascript google-maps google-maps-api-3

我正在尝试将自定义标记放在谷歌地图上。我想要使​​用的图标是png文件,并根据放置在地图上的点的类型而有所不同。从SQL数据库中提取点的位置和其标记的png文件的URL。

我使用的代码如下

var mapOptions = {
    center: new google.maps.LatLng(markers[0].lat, markers[0].lon),
    zoom: 7,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    //  marker:true
};
var infoWindow = new google.maps.InfoWindow();

var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
for (i = 0; i < markers.length; i++) {
    var data = markers[i]
    var myLatlng = new google.maps.LatLng(data.lat, data.lon);
    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        title: data.venue,
        icon: data.image
    });

当这个运行时,我在地图上得到非常大的标记,每个标记都是正确的标记,但是它们非常大,看起来像混乱。

有关如何控制图标大小的任何建议吗?

1 个答案:

答案 0 :(得分:2)

您可以将google.maps.Icon指定为MarkerOptions,例如

var marker = new google.maps.Marker({
    position: myLatlng,
    map: map,
    title: data.venue,
    icon: {
        url: data.image,
        scaledSize: new google.maps.Size(32, 32)
    }
});