Mapbox GL AddLayer: आइकन छवियां कहां से आ रही हैं

10

बहुत सारे उदाहरण हमेशा आइकन छवि को इस तरह से लोड करते हैं (उदाहरण के लिए यहां: https://www.mapbox.com/mapbox-gl-js/example/geojson-markers/ ):

map.addLayer({
    "id": "markers",
    "type": "symbol",
    "source": "markers",
    "layout": {
        "icon-image": "{marker-symbol}-15",
        "text-field": "{title}",
        "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
        "text-offset": [0, 0.6],
        "text-anchor": "top"
    }
});

यह आइकन कहाँ संग्रहीत है और मैं स्थानीय png या svg से कैसे लिंक कर सकता हूं? या मैं अपने खुद के markersस्रोत में कैसे डाल सकता हूं ? उदाहरण बहुत अच्छी तरह से प्रलेखित नहीं है।

mapbox-gl

— tobias47n9e
स्रोत

क्या आपने एपीआई डॉक्स के 'शैली संदर्भ' अनुभाग की जांच की?

— तंगनेर

3

यह मेरी राय में बहुत अच्छी तरह से समझाया नहीं गया है। एक अच्छी तरह से समझाया गया कार्य उदाहरण देखना पसंद करेंगे।

— Tobias47n9e 16

13

यदि आप उदाहरणों का पालन करते हैं, तो आपको केवल अपने विशेष शैली के स्प्राइट शीट के साथ लोड करने वाले स्प्राइट मिलते हैं, जो किसी अन्य शैली के साथ 1 से 1 मैच के लिए आवश्यक नहीं है।

पूर्व: पन्ना-वी 8 में कोई "आइकन-छवि" नहीं है: "हार्बर -15" उदाहरण के लिए जो सड़कों-वी 8 का उपयोग करता है।

संबंधित शैलियों से उपलब्ध स्प्राइट्स की सूची देखने के लिए: https://github.com/mapbox/mapbox-gl-styles/tree/master/sprites

मैं उनके पन्ना- v8 भंडार से "बंदरगाह" आइकन चुन सकता हूं जैसे:

map.addLayer({
    "id": "pointclick",
    type: 'symbol',
    source: 'pointclick',
    "layout": {
        "icon-image": "harbor_icon",
        "icon-size":1.5
    },
    "paint": {}
});

यहां वह संसाधन है जिसने मुझे इसे एक साथ खींचने में मदद की है, और यह बताता है कि कैसे अपने स्वयं के आइकन बनाने के लिए: https://www.mapbox.com/help/custom-markers/#locate-mapbox-styles-images

संपादित करें:

मूल रूप से, अपने स्वयं के किसी आइकन को जोड़ने के लिए, मैपबॉक्स स्टूडियो में जाएं, अपनी खुद की शैली बनाएं, या उनमें से किसी एक को संपादित करें। बस अपने स्वयं के एसवीजी में से एक जोड़ें, फिर वह आइकन आपके कस्टम स्प्राइट शीट में उपलब्ध हो जाएगा।

— CCantey
स्रोत

7

आप बाहरी / जेनरेट किए गए आइकनों का उपयोग भी कर सकते हैं जैसे icon-imageकि आप उपयोग करते हैं map.loadImage()और map.addImage()पहले करते हैं।

उदाहरण:

मानचित्र में एक आइकन जोड़ें

नक्शे में एक उत्पन्न आइकन जोड़ें

— माइक डेवेलेंटस
स्रोत

0

जैसा कि स्प्राइट डॉक्स में कहा गया है : "sprite": "https://link"अपनी शैली को पास करें, जहां स्प्रिटज़रो-link क्ली के साथ जेनसेट से लिंक किया गया है । स्प्रिट्ज़ेरो-क्लि जनरेटेड पींग स्प्राइट अपने आइकन की सूची से एसवीजी प्रारूप में। आप प्रतीक परतों में आइकन का उपयोग कर सकते हैं 'icon-image'।

— microspace
स्रोत