অতিরিক্ত মানগুলির উপর ভিত্তি করে লিফলেট পললাইন রঙ-কোড করুন, উদাহরণস্বরূপ উচ্চতা, গতি,


13

আমি লিফলেট মানচিত্রে একটি জিপিএক্স-ট্র্যাক আঁকতে চাই। পলিલાઇનটিতে কেবল একটির রঙই থাকা উচিত নয় তবে আমি উচ্চতা, গতি, হার্ট-রেট, তাপমাত্রা, ক্যাডেন্স, opeাল রঙ-কোডেডের মতো নির্দিষ্ট মানগুলি দেখাতে চাই। অবশ্যই একবারে একটি মাত্র মান ভিজ্যুয়ালাইজ করা যায়।

মানগুলি একসাথে সংরক্ষণ করা হবে L.LatLng, যেমন কোনও meta: {ele: 298, hr: 155}বস্তুতে।

আমি লিফলেটে নতুন এবং বিশেষত এটি করার একটি দক্ষ উপায় সন্ধান করার জন্য উদ্বিগ্ন। প্রথম যেটি মনে আসল তা হ'ল প্রতিটি বিশেষ রঙ দিয়ে কয়েক হাজার বা হাজার হাজার পলিন তৈরি করা। এটি স্মৃতি এবং সিপিইউ সম্পর্কিত খুব লোভী মনে হচ্ছে।

কোন ধারনা?

আমি যা বোঝাতে চাইছি তার একটি উদাহরণ এখানে দেখা যেতে পারেমাই ট্যুরবুক স্ক্রিনশট


আপনি কি দয়া করে একটি নমুনা ফাইল সরবরাহ করতে পারেন? এইভাবে সাহায্য করা সহজ হতে পারে।
ustroetz

এখানে একটি উদাহরণ রয়েছে: track-and-find.me/gpx-viewer/data/kampenwand.gpx
hgoebl

উত্তর:


7

আপনার জিপিএক্স ট্র্যাকটি কিউজিআইএস দিয়ে জিওজেএসনে রূপান্তর করুন।

আসুন বলি যে আপনার জিওজেএসন এটির মতো দেখাচ্ছে। জিওজেসনের 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 ], ] } }
];


আপনার লিফলেট মানচিত্রে নিম্নলিখিত কোড সহ আপনার জিওজেএসনকে যুক্ত করুন। আপনার ফাইল স্টাইল করতে একটি ফাংশন ব্যবহার করুন। "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' ;
};

আমি জিওজেএসন নমুনা এবং উপরে বর্ণিত ফাংশনগুলি সহ একটি জেএসফিডাল তৈরি করেছি: http://jsfiddle.net/2VY5z/1/


1
আপনাকে ধন্যবাদ, এটি একটি সম্ভাব্য সমাধান। আমি কিছুটা jsfiddle.net/2VY5z/3 ফিট করেছিলাম এবং পর্যবেক্ষণ করেছি যে অভ্যন্তরীণভাবে প্রতিটি বৈশিষ্ট্যের জন্য একটি স্তর তৈরি করা হবে। দীর্ঘ জিপিএক্স ট্র্যাকের ক্ষেত্রে, আমি মনে করি এটি বেশ অভিভূত হতে পারে। এর জন্য আমি আরও সঠিক উত্তরের জন্য কয়েক ঘন্টা অপেক্ষা করব যতক্ষণ না আপনি "সঠিক" চিহ্নটি পান।
hgoebl

1
আমি @ hgoebl এর সাথে একমত, এক উত্স বৈশিষ্ট্যকে কয়েক হাজার ছোট অংশে আলাদা করার জন্য পারফরম্যান্সের দিক থেকে ভাল মনে হচ্ছে না। আমি মনে করি আমাদের একটি বিশেষ শ্রেণি প্রয়োজন, যা উল্লিখিত কার্যকারিতা সহ এল.পাথ থেকে প্রাপ্ত। ইতিমধ্যে কেউ এটি তৈরি করেছে? ;)
ইউনিবসিল

আমি বর্তমানে একটি স্তর প্লাগইন বিকাশ করছি যা কিছুটা দক্ষ। তবে আমি ভয় পাচ্ছি যে <path>যতক্ষণ রঙ পরিবর্তন করা যায় তত কমপক্ষে আমাকে উপাদানগুলির সংখ্যা তৈরি করতে হবে । দুর্ভাগ্যক্রমে কোনও পথে রঙ পরিবর্তন করার কোনও উপায় নেই: এর M184 398L187 395C#00FF00 L183 399জন্য প্রয়োজনীয় হবে (সি = রঙ)।
hgoebl

7

আমি লিফলেটটির জন্য একটি ছোট প্লাগইন তৈরি করেছি: লিফলেট.মল্টিঅপশনসপলাইন

এখানে ডেমো পৃষ্ঠা থেকে একটি স্ক্রিনশট রয়েছে :

ডেমো পৃষ্ঠা থেকে উদাহরণ

বর্তমানে এটিতে ডকুমেন্টেশনগুলির অভাব রয়েছে, তবে উত্স কোডের সাথে ডেমো পৃষ্ঠাটির লিঙ্ক রয়েছে যা বেশ স্ব-ব্যাখ্যামূলক হওয়া উচিত।

আপনার মতামত স্বাগত (গিটহাবের উপর একটি সমস্যা তৈরি করুন বা যদি আপনার কাছে গিটহাব অ্যাকাউন্ট না থাকে তবে এই উত্তরে মন্তব্য করুন)।


2

এটি পুরানো থ্রেড হিসাবে মনে হচ্ছে, তবে আশা করি, কেউ এটি সহায়ক বলে মনে করেন।

পলিনগুলির পাশাপাশি রঙিন গ্রেডিয়েন্টগুলি আঁকার জন্য একটি লিফলেট প্লাগইন। https://github.com/iosphere/Leaflet.hotline/ ডেমো


1
এটি সহায়ক বলে মনে হচ্ছে তবে সাধারণ নিয়ম হিসাবে একটি উত্তরে কেবলমাত্র একটি লিঙ্কের চেয়ে বেশি থাকা উচিত contain এমনকি আপনি যা কিছু করেন তার লিঙ্কের অপর প্রান্তে কী রয়েছে তার একটি সংক্ষিপ্ত বিবরণ দিলে, অন্য ব্যবহারকারীর এই সমাধানটি কী তা বুঝতে সক্ষম হওয়া উচিত এবং কেন এটি যথাযথভাবে মূল প্রশ্নটিকে সম্বোধন করে, ব্যবহারকারীকে এই পৃষ্ঠাটি ছাড়তে হবে না বলে।
জোশসি

@ জোসিসি, ধন্যবাদ, আপডেটের পরে এটি বোধগম্য বিবরণ আশা করি আপনি যদি এমন একাউন্ট
নেন
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.