圆弧半径更大，具有数据驱动的属性 [英] circle-radius bigger with a data-driven property

问题描述

当data属性(总计)较大时，我想绘制更大的圆圈.deviceGeojson是数据，我认为我应该在"circle-raduis"中编写一些代码，但我不知道如何获取它.

I want to paint bigger circles when the data property--total is bigger. deviceGeojson is the data, I think I should write some code within 'circle-raduis' but I dont know how to get it.

var deviceGeojson = [{
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [144.961027, -37.795947]
            },
            "properties": {
                "PC": 100,
                "Mobile": 200,
                "Laptop": 300,
                "total": 600
            }
        },
        {
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [144.960205, -37.797596]
            },
            "properties": {
                "PC": 100,
                "Mobile": 200,
                "Laptop": 300,
                "total": 600
            }
        }
        ];

map.addLayer({
                'id': 'test',
                'type': 'circle',
                'source' : {
                    "type": "geojson",
                    "data": {
                        "type": "FeatureCollection",
                        "features": deviceGeojson,
                    }

            },
            'paint':{
                'circle-color': '#00b7bf',
                'circle-radius': {

                },
                'circle-stroke-width': 1,
                'circle-stroke-color': '#333',
            }
        });

我不知道如何在画图"中编写代码，谢谢

I dont know how to write the code within 'paint',Thank you

推荐答案

您可以使用表达式来获取属性的值:

You can use expressions to get value of a property:

"circle-radius": ['get', 'total']

或者，如果要通过说20来填充 total 属性的值，则可以执行以下操作:

Or if you were to device the value of total property by say 20, you'd do something like this:

"circle-radius": ['/', ['get', 'total'], 20],

您可以在此处了解有关表达式的更多信息: https://docs.mapbox.com/mapbox-gl-js/style-spec/#expressions

You can read more about expressions here: https://docs.mapbox.com/mapbox-gl-js/style-spec/#expressions

这篇关于圆弧半径更大，具有数据驱动的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！