радиус окружности больше с управляемым данными свойством - PullRequest
Новая
       10

радиус окружности больше с управляемым данными свойством

0 голосов
/ 22 октября 2019

Я хочу рисовать большие круги, когда свойство data - total больше. deviceGeojson - это данные, я думаю, что я должен написать некоторый код в 'circle-raduis', но я не знаю, как его получить. 

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

Я не знаю, как написать код в «paint», спасибовы

1 Ответ

1 голос
/ 22 октября 2019

Вы можете использовать выражения, чтобы получить значение свойства: 

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

Или, если бы вы указали значение свойства total, скажем, 20, вы бы сделали что-то вроде этого: 

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

Подробнее о выражениях можно прочитать здесь: https://docs.mapbox.com/mapbox-gl-js/style-spec/#expressions

...