Использование динамических стилей для установки отдельных цветов заливки для нескольких полигонов в одном слое - PullRequest
0 голосов
/ 02 октября 2018

Использование response-native-mapbox-gl.

Можно ли использовать динамические стили для установки отдельных цветов заливки для каждого многоугольника в пределах одного слоя или FeatureCollection?В настоящее время я передаю один объект FeatureCollection в MapboxGL.ShapeSource, и я не уверен, как получить доступ к «циклу» и установить индивидуальный стиль из свойства объекта.Я понимаю, что могу использовать ["get", "color"] из их документации, но ее реализация мне не совсем понятна.Пример ...

        <View style={GLOBAL_WRAP.WRAP}>
            <MapboxGL.MapView
                centerCoordinate={[ userLocation.longitude, userLocation.latitude ]}
                pitchEnabled={false}
                rotateEnabled={false}
                style={{ flex: 1 }}
                showUserLocation={true}
                styleURL={MapboxGL.StyleURL.Standard}
                userTrackingMode={MapboxGL.UserTrackingModes.MGLUserTrackingModeFollow}
                zoomLevel={8}
            >
                    <MapboxGL.ShapeSource
                        key='polygon'
                        id='polygon'
                        onPress={this._onPolyPress}
                        shape={{type: "FeatureCollection", features: polyFeatures}}
                        type='geojson'
                    >
                        <MapboxGL.FillLayer
                            id="smileyFaceFill"
                            style={MapboxGL.StyleSheet.create({
                                fillAntialias: true,
                                fillColor: ["get", "color"]
                            })}
                        />
                    </MapboxGL.ShapeSource>
            </MapboxGL.MapView>
            { this._renderModal()}
        </View>

Где polyFeature выглядит примерно так ...

{
type: "FeatureCollection",
features: [
    type: "Feature"
    geometry: {
        type: "MultiPolygon",
        coordinates: [ 
            [ Array(2), Array(2) ],
            [ Array(2), Array(2) ],
        ]
    }
    properties: {
        color: "#323232",
        name: "example name",
        id: 1,
    },
    type: "Feature",
    geometry: {
        type: "MultiPolygon",
        coordinates: [ 
            [ Array(2), Array(2) ],
            [ Array(2), Array(2) ],
        ]
    }
    properties: {
        color: "#323232",
        name: "example name",
        id: 1,
    },
    ....
    ...
]

}

...