如何根据传单中的属性更改标记的颜色？

Question

我有上面的地图，标记有属性'rastvalues'。我想根据'rastvalues'值更改标记颜色.Below是我的javascript代码

<script type="text/javascript" >
        function main_map_init (map, options) {
             var promise  = $.getJSON('{% url "datapotg" %}');
            // Download GeoJSON via Ajax
            promise.then(function(data) {
            var allbusinesses = L.geoJson(data);
            var cafes = L.geoJson(data, {
            filter: function(feature) {

                return feature.properties.rastvalues ;

                },
                pointToLayer: function(feature, latlng) {
                return new L.CircleMarker(latlng, {
                radius: 8,
                    fillColor: "Red",
                    color: "Red",
                    weight: 1,
                    opacity: 1,
                    fillOpacity: 0.4,
                    clickable: true

                }).on('mouseover', function() {
                    this.bindPopup(feature.properties.rastvalues).openPopup();
                });
            }
        });


         map.fitBounds(allbusinesses.getBounds(), {
            padding: [50, 50]
        });
        cafes.addTo(map)


        });
        }

    </script>

我有rastvalues = 3，rastvalues = 9，rastvalues = 12如何为这三个值赋予不同的颜色？

Answer 1

您可以创建一个包含您的值及其相应颜色的对象，并使用括号表示法从中检索它们。有些人建议使用函数，但我认为使用对象更容易：

pointToLayer: function (feature, latlng) {
    var colors = {
        3: 'green',
        9: 'orange',
        12: 'red'
    };
    return new L.CircleMarker(latlng, {
        radius: 8,
        fillColor: colors[feature.properties.rastvalues],
        color: colors[feature.properties.rastvalues],
        weight: 1,
        opacity: 1,
        fillOpacity: 0.4,
        clickable: true
    }
});