अतिरिक्त मूल्यों के आधार पर कलर-कोड एक USC पॉलीलाइन, जैसे ऊंचाई, गति,


13

मैं एक जीपीएक्स-ट्रैक को एक कैटलॉग मानचित्र पर आकर्षित करना चाहता हूं। पॉलीलाइन में केवल एक रंग नहीं होना चाहिए, लेकिन मैं कुछ मूल्यों जैसे ऊंचाई, गति, हृदय गति, तापमान, ताल, ढलान रंग-कोडित दिखाना चाहता हूं। बेशक एक बार में केवल एक मूल्य की कल्पना की जा सकती है।

मानों को एक साथ संग्रहित किया जाएगा L.LatLng, जैसे किसी meta: {ele: 298, hr: 155}वस्तु में।

मैं कैटलॉग के लिए नया हूं और विशेष रूप से ऐसा करने के लिए एक कुशल तरीका खोजने के बारे में चिंतित हूं। जो पहली बार दिमाग में आया वह था एक विशेष रंग के साथ प्रत्येक के सैकड़ों या हजारों पॉलीइन्स बनाना। लेकिन यह स्मृति और सीपीयू के बारे में बहुत लालची लगता है।

कोई विचार?

एक उदाहरण जो मेरा मतलब है उसे यहाँ देखा जा सकता हैMyTourbook स्क्रीनशॉट


क्या आप कृपया एक नमूना फ़ाइल प्रदान कर सकते हैं। इस तरह से मदद करना आसान हो सकता है।
ustroetz

यहाँ एक उदाहरण है: track-and-find.me/gpx-viewer/data/kampenwand.gpx
hgoebl

जवाबों:


7

अपने GPX ट्रैक को QGIS के साथ एक GeoJSON में बदलें।

मान लें कि आपका GeoJSON ऐसा दिखता है। GeoJSON में elevationऊंचाई के मूल्य के साथ एक विशेषता है ।

        var yourGeoJSON = [ 
{ "type": "Feature", "properties": { "id": 2, "elevation": 50 }, "geometry": { "type": "LineString", "coordinates": [ [ 11.836395263671875, 47.75317468890147 ], [ 11.865234375, 47.73193447949174 ] ] } },
{ "type": "Feature", "properties": { "id": 1, "elevation": 750 }, "geometry": { "type": "LineString", "coordinates": [ [ 11.865234375,47.73193447949174 ], [ 11.881027221679688, 47.700520033704954 ] ] } },
{ "type": "Feature", "properties": { "id": 0, "elevation": 1700 }, "geometry": { "type": "LineString", "coordinates": [ [ 11.881027221679688, 47.700520033704954 ], [ 11.923599243164062, 47.706527200903395 ] ] } },
{ "type": "Feature", "properties": { "id": 0, "elevation": 3000 }, "geometry": { "type": "LineString", "coordinates": [ [ 11.923599243164062, 47.706527200903395 ], [ 11.881027221679688, 47.700520033704954 ], ] } }
];


अपने पत्रक को अपने पत्रक मानचित्र में निम्नलिखित कोड के साथ अपने GeoJSON जोड़ें। अपनी फ़ाइल को स्टाइल करने के लिए फ़ंक्शन का उपयोग करें। "color"तत्व फ़ंक्शन को कॉल करने get colorऔर जानकारी को साझा करती elevationएक पैरामीटर के रूप अपनी सुविधा के मान।

L.geoJson(yourGeoJSON, {
    style: function (feature) {
        return {
         "color": getColor(feature.properties.elevation),
         "opacity": 1,
        }}
}).addTo(map);

फ़ंक्शन getColorऊंचाई मान के आधार पर रंग लौटाता है।

function getColor(x) {
  return x < 500     ?    '#bd0026':
         x < 1000     ?   '#f03b20':
         x < 1500     ?   '#fd8d3c':
         x < 2000     ?   '#fecc5c':
                          '#ffffb2' ;
};

मैंने नमूना GeoJSON और ऊपर वर्णित कार्यों के साथ एक JSField बनाया: http://jsfiddle.net/2VY5-5/1/


1
धन्यवाद, यह एक संभव समाधान है। मैंने थोड़ा सा jsfiddle.net/2VY5z/3 को फिड किया और आंतरिक रूप से देखा कि हर सुविधा के लिए एक परत बनाई जाएगी। लंबे GPX ट्रैक्स के मामले में, मुझे लगता है कि यह काफी भारी हो सकता है। जब तक आपको "सही" निशान नहीं मिल जाता, तब तक मैं और भी बेहतर जवाब के लिए कुछ घंटे इंतजार करूँगा।
होजेबेल

1
मैं @hgoebl से सहमत हूं, एक स्रोत सुविधा को एक हजार छोटे खंडों में विभाजित करने के लिए लगता है कि प्रदर्शन में अच्छा नहीं है। मुझे लगता है कि हमें उपर्युक्त कार्यक्षमता के साथ L.Path से प्राप्त एक विशेष वर्ग की आवश्यकता है। हो सकता है कि किसी ने इसे पहले से ही बनाया हो? ;)
यूनिबसिल

मैं वर्तमान में एक लेयर प्लगइन विकसित कर रहा हूं जो थोड़ा अधिक कुशल है। लेकिन मुझे डर है कि मुझे कम से कम <path>तत्वों की संख्या पैदा करनी होगी जितनी बार रंग स्विच करता है। अफसोस की बात है कि एक मार्ग में रंग बदलने का कोई तरीका नहीं है: M184 398L187 395C#00FF00 L183 399इसके लिए आवश्यक होगा (सी = रंग)।
होजेबेल

7

मैंने एक छोटा सा प्लगइन बनाया है: USC.MultiOptionsPolyline

यहाँ डेमो पेज से एक स्क्रीनशॉट है :

डेमो-पेज से उदाहरण

वर्तमान में इसमें दस्तावेज़ीकरण की कमी है, लेकिन डेमो पेज स्रोत कोड से लिंक करता है जो कि काफी आत्म-व्याख्यात्मक होना चाहिए।

आपकी प्रतिक्रिया का स्वागत है (GitHub पर एक समस्या बनाएं या यदि आपके पास GitHub खाता नहीं है तो इस उत्तर पर टिप्पणी करें)।


2

ऐसा लगता है कि यह पुराना धागा है, लेकिन उम्मीद है, किसी को यह मददगार लगता है।

पॉलीइन्स के साथ रंगीन ग्रेडिएंट खींचने के लिए एक कैटलॉग प्लगइन। https://github.com/iosphere/Leaflet.hotline/ डेमो


1
यह सहायक प्रतीत होता है, लेकिन एक सामान्य नियम के रूप में, एक उत्तर में केवल एक लिंक से अधिक होना चाहिए। यहां तक ​​कि अगर आप सभी करते हैं, तो लिंक के दूसरी तरफ क्या है, इसका सारांश दें, एक अन्य उपयोगकर्ता को यह समझने में सक्षम होना चाहिए कि यह समाधान क्या है और यह मूल प्रश्न को पर्याप्त रूप से क्यों संबोधित करता है, बिना कहा उपयोगकर्ता को इस पृष्ठ को छोड़ने के लिए।
जोश

@JoshC, धन्यवाद, उम्मीद है कि अपडेट के बाद यह समझने योग्य विवरण है यदि आप एक खाता लेते हैं जो छवि बहुत कुछ समझाती है
Dzmitry Atkayey
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.