আমি কীভাবে D3 সহ একটি মানচিত্রে অক্ষাংশ-দ্রাঘিমাংশ স্থানাঙ্ক রেন্ডার করতে পারি?


16

আমি মার্কিন যুক্তরাষ্ট্রের মানচিত্রের শীর্ষে দ্রাঘিমাংশ-অক্ষাংশ স্থানাঙ্কগুলির বিন্দু বিন্যাসগুলি ওভারলে করার চেষ্টা করছি।

এখনও অবধি আমি ডি 3 কার্টোগ্রাফির উদাহরণটি পেয়েছি , তবে আমি যখন এক্স-এ বিন্দু স্থাপন করার চেষ্টা করি, তখন ওয়াই পিক্সেল স্থানাঙ্কগুলি ক্যানভাস থেকে বেরিয়ে আসে। আমি ওয়ার্কশট বক্তৃতা নোটগুলি পেয়েছি যার মধ্যে ডি 3-এ স্থানাঙ্ক সিস্টেম অন্তর্ভুক্ত রয়েছে তবে আমি মানচিত্রে কীভাবে ল্যাট / দীর্ঘ স্থানাঙ্কগুলি পেতে পারি তা সম্পর্কে এখনও আমি অনিশ্চিত।

আমার এখন অবধি এটিই রয়েছে (মার্কিন যুক্তরাষ্ট্রে কেবলমাত্র একটি মানচিত্র)

এই কাজটি কীভাবে করা যায় সে সম্পর্কে পরামর্শটি প্রশংসিত হবে!


ডি 3 এসজিজি সঠিক?
ম্যাপারজ

হ্যাঁ, ডি 3 হ'ল এসজিজি।
জে টেলর

1
মানচিত্রে এসভিজি রেন্ডার করার একটি ভাল উদাহরণ এখানে - github.com/kartographic/kartographic.py/wiki/… পাথ এবং ব্যবস্থা ব্যবহার করে
ম্যাপারজ

উত্তর:


16

মানচিত্রে আপনার পয়েন্টগুলির ল্যাট এবং লম্বা প্রজেক্ট করতে আপনার একটি প্রজেকশন () ফাংশন থাকা দরকার। ডিফল্টরূপে, ডি 3 জিও পাথটি আলবারস ইউএসএ প্রজেকশনটি ব্যবহার করে, যাতে আপনি এটি স্পষ্টভাবে ঘোষণা করতে পারেন:

var projection = d3.geo.albersUsa();

আপনি এটি এমন উদাহরণগুলিতে দেখবেন যা আলবারসুসা ব্যবহার করে না এবং প্রজেকশনটি সংজ্ঞায়িত করে আপনি এটি সংশোধন করতে পারেন। এটি সংজ্ঞায়িত করা এটি একটি ফাংশন হিসাবে উপলব্ধ করে। এইভাবে আপনি আপনার পয়েন্টগুলি এসভিজি চেনাশোনা হিসাবে রাখতে পারেন:

svg.append("circle").attr("r",5).attr("transform", function() {return "translate(" + projection([-75,43]) + ")";});

এটি নিউ ইয়র্কের রুক্ষ আশেপাশে একটি বৃত্ত ফেলে দেওয়া উচিত। তারপরে আপনি "ল্যাট" এবং "লম্বা" বৈশিষ্ট্য হিসাবে ডেটা বেঁধে রাখতে পারেন, এই ক্ষেত্রে এটি দেখতে এটির মতো হবে:

 svg.selectAll("circles.points")
.data(yourData)
.enter()
.append("circle")
.attr("r",5)
.attr("transform", function(d) {return "translate(" + projection([d.long,d.lat]) + ")";});

অভিক্ষেপ ফাংশন [লম্বা, ল্যাট] অ্যারে নেয় এবং একটি [x, y] অ্যারে প্রদান করে, যা রূপান্তর, রূপান্তর () সিনট্যাক্সে সূক্ষ্ম ফিট করে বা আপনি এক্স এবং y মানগুলির জন্য অ্যারেরকে বিভক্ত করতে পারেন।

নীচের উদাহরণটি পলিসি, লাইন এবং পয়েন্টগুলি রাখে এবং সিএসভি থেকে পয়েন্টগুলি নিয়ে একটি মানচিত্রে প্রজেক্ট করে তবে লক্ষ্য করুন যে এটি জি উপাদানকে রূপান্তর করে এবং সেই উপাদানটির সাথে একটি বৃত্ত যুক্ত করে (আপনি সম্ভবত একটি লেবেল বা অন্যান্য দিকও চাইতে পারেন) কোনও সাইটে, যার সবগুলিই সেই প্রস্তাবিত জি উপাদানটিতে যুক্ত করা হবে):

https://gist.github.com/4414107 http://bl.ocks.org/d/4414107/

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