mapbox.js नक्शे में स्थानीय JSON शैली का घालमेल (और छानने MapBox में 100 से अधिक बहुभुज)

वोट
1

मैं MapBox स्टूडियो में फिल्टर का उपयोग कर रहा 189 बहुभुज के साथ एक GeoJSON फ़ाइल शैली। मैं अपने डेटा को फ़िल्टर करने परतों बनाने में सक्षम था, लेकिन यह सिर्फ मेरे बहुभुज की 100 मान्यता प्राप्त है। मैं कुछ शोध किया और देखा कि वास्तव में, स्टूडियो केवल 100 की प्रक्रिया मैं इस शैली का उपयोग कर रहा एक mapbox.js मानचित्र में एकीकृत करने के (मैं ऐसा करने में सक्षम था) सकता है, लेकिन की वजह से शेष 89 बहुभुज को स्वरूपित करने में असमर्थ था फिल्टर समस्या। मैं इस नक्शे की JSON डाउनलोड किया। मैं तो बस मैन्युअल रूप से JSON में शेष परतों को जोड़ने सकते हैं? यदि हां, तो कैसे मैं अपने mapbox.js कोड में मेरी नक्शा शैली के रूप में स्थानीय JSON फ़ाइल लिंक होगा?

mapbox.js कोड (दोषपूर्ण MapBox स्टूडियो शैली के साथ):

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8' />
    <title></title>
    <script src='https://api.mapbox.com/mapbox-gl-js/v0.28.0/mapbox-gl.js'></script>
    <link href='https://api.mapbox.com/mapbox-gl-js/v0.28.0/mapbox-gl.css' rel='stylesheet' />
    <style>
        body { margin:0; padding:0; }
        .map { position:absolute; top:0; bottom:0; width:100%; }
    </style>
</head>
<body>

<div id='map' class='map'></div>

<style>

.legend {
    background-color: #d6d6d6;
    border-radius: 3px;
    bottom: 30px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.10);
    font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif;
    padding: 10px;
    position: absolute;
    right: 10px;
    z-index: 1;
}

.legend h4 {
    margin: 0 0 10px;
}

.legend div span {
    border-radius: 50%;
    display: inline-block;
    height: 10px;
    margin-right: 5px;
    width: 10px;
}

</style>

<div id='map'></div>

<div id='HVI-legend' class='legend'>
    <h4>HVI</h4>
    <div><span style='background-color: #EB6769'></span>1</div>
    <div><span style='background-color: #F3B3B4'></span>0.5</div>
    <div><span style='background-color: #FCFCFF'></span>0</div>
</div>

<script>
mapboxgl.accessToken = 'pk.eyJ1Ijoic3RhbWxlcm4iLCJhIjoiY2l3MnkwZ2tnMDEwejJ6anZtM240c2d3byJ9.ZTqhEH-1r0WelPq2n0rshQ';
var map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/stamlern/ciwa09zej000f2pmrr8lm10ju',
    center: [-73.949, 40.71],
    zoom: 10.1
});

</script>

</body>
</html>
04/12/2016 को 00:34
का स्रोत उपयोगकर्ता
अन्य भाषाओं में...                            


1 जवाब

वोट
0

ऐसा लगता है आप एक "डाटासेट" के बजाय एक "tileset" के रूप में के रूप में GeoJSON फ़ाइल अपलोड करने की कोशिश कर रहे हैं। तुम बहुत बेहतर प्रदर्शन मिलेगा (और प्रतिबंध आपके द्वारा बताई में नहीं चलेंगे) यदि आप एक tileset के रूप में अपलोड करें, और शैली पर आधारित है कि।

क्या तुम सच में GeoJSON फ़ाइल स्थानीय रूप से जोड़ने के लिए, का उपयोग करें चाहते हैं, तो map.addSource

03/01/2017 को 02:39
का स्रोत उपयोगकर्ता

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more