Масштаб радиуса круга, основанный на диапазоне строк - Mapbox

Question

Я пытаюсь динамически установить радиус окружностей, построенных с помощью набора данных, который имеет три столбца: Широта/Долгота/# Сессии. Данные импортируются штрафом, и все местоположения правильно отображаются с # сеансами в качестве метки.

Вот сценарий:

Радиус должен быть основан на количестве сеансов, поэтому широта/долгота пара с 5 сеансов 1px, Шир/пара с 5000 сеансов 10px и т.д.

Есть ли способ установить это динамически в наборе данных? Я могу создать слой «полосы» самостоятельно, добавив несколько экземпляров набора данных и фильтрации до 1-10, 11-100 и т. Д., Но было бы здорово установить «минимальный» радиус и «максимальный» радиус и он автоматически масштабируется на основе имеющихся данных.

Есть ли способ сделать это в Mapbox?

Answer 1

Предполагая, что я понимаю это право - в основном у вас есть данные определенного типа, основанные на сеансе #, вы хотите нарисовать большой или меньший круг на этом лате, длинном спаривании.

Что вы можете сделать, это изначально импортировать данные, за которыми следуют # сеансы и физически создавать набор для рендеринга на карте (некоторый тип массива или что-то еще). Вы можете использовать маркеры для отображения этих значков или круга и физически назначать им размер.

До этого вы должны заранее определить функцию взять # сессий и сопоставить их физическое значение радиуса - скажут 1000 сеансов = радиус 10 и 50000 сеансов = радиус 500.

Например, в ИОС приложении я создал это мой код, используя - https://github.com/mapbox/react-native-mapbox-gl

markersArray = markersArray.concat({ 
         coordinates:[bList[i].latitude, bList[i].longitude], 
         'type': 'point', 
         title: bList[i].bname, 
         subtitle: bList[i].data, 
         id: bList[i].o_ID.toString(), 
         startTime: bList[i].startTime, 
         endTime: bList[i].endTime, 
         annotationImage: { 
         url: (bList[i].type === 'drink') ? (drinkUrl) : (foodUrl), 
         height: 30, 
         width: 30 
         }, 
         rightCalloutAccessory: { 
         url: 'image!info-icon', 
         height: 20, 
         width: 20 
         } 
        });