在谷歌地图上放一些不同颜色的点答案

【问题标题】：put on google map some point with different color在谷歌地图上放一些不同颜色的点
【发布时间】：2026-01-06 10:35:01
【问题描述】：

我想用 lat long 将三个点放在 google map 中，但我希望每个点都有不同的颜色。
这是我的代码，目前此代码为所有点设置了一种颜色

    function initMap() {

        map = new google.maps.Map(document.getElementById('map'), {
            zoom: 11,
            center: {lat: 39.585938, lng: 47.909219}
        });

        heatmap = new google.maps.visualization.HeatmapLayer({
            data: getPoints(),
            map: map
        });

        var gradient = [
            'rgba(255, 0, 0, 0)',
            'rgba(255, 0, 0, 1)'
        ]
        heatmap.set('gradient', gradient);
    }

    function getPoints() {
        return [
            new google.maps.LatLng(39.585938, 47.909219,20),
            new google.maps.LatLng(39.585938, 47.909220,20),
            new google.maps.LatLng(39.585938, 47.909221,20),
            new google.maps.LatLng(39.585938, 47.909222,20),
        ];
    }

【问题讨论】：

您的代码当前正在使用热图。你想要标记吗？

标签： javascript google-maps google-maps-api-2

【解决方案1】：

您可以使用strokeColor 属性定义自定义标记：

例子：

strokeColor: "red",

参考：https://developers.google.com/maps/documentation/javascript/markers

var marker = new google.maps.Marker({
    id: "some-id",
    icon: {
        path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
        strokeColor: "red",
        scale: 3
    },
    map: map,
    title: "Any-title",
    position: myLatlng
});

参考资料： https://developers.google.com/maps/documentation/javascript/symbols

【讨论】：