स्केलिंग d3.js अनुमानों

Question

मैं d3 का उपयोग कर NYC का एक नक्शा आकर्षित करने के लिए कोशिश कर रहा हूँ। मैंने http://www.nyc.gov/html/dcp/html/bytes/dwndistricts.shtml से आकृति फाइलों का एक गुच्छा डाउनलोड किया है। मैं उन्हें GeoJSON में कनवर्ट कर लिया http://converter.mygeodata.eu/ उपयोग करते हुए, इस तरह के हैं कि वे डब्ल्यूजीएस 84 में हैं (उर्फ, मुझे लगता है, अक्षांश और देशांतर)।

मैं यकीन है कि GeoJSON मान्य है कर रहा हूँ: मैं matplotlib का उपयोग कर इसे प्लॉट कर सकते हैं और यह NYC तरह लग रहा है, और संख्या एक मान्य श्रेणी में होने लगते हैं। यहाँ मेरी जावास्क्रिप्ट है:

var path = d3.geo.path() 
d3.select("body") 
    .append("svg") 
    .attr("height", 1000) 
    .attr("width", 1000) 
    .append("g") 
    .selectAll("path") 
    .data(data.features) 
    .enter() 
    .append("path") 
    .attr("d", path) 
    .style("stroke","black") 
    .style("stroke-width","1px") 

यह भूखंडों, के रूप में विज्ञापित, NYC के एल्बर्स प्रक्षेपण। दिक्कत यह है कि प्रक्षेपण के पैमाने ताकि अमेरिका एक अच्छा वेब पेज पर फिट बैठता है, NYC के लिए पथ स्क्रीन के दाएँ हाथ की ओर पर एक छोटे से विद्रूप बनाने चुना जाता है, है मुझे लगता है,।

geo.path() को स्केल करने के लिए 'सही' तरीका (lemme d3onic कहने वाला पहला दावा करने का प्रयास करने का प्रयास करें) जैसे कि मेरे एसवीजी की चौड़ाई और ऊंचाई पर मेरे अक्षांश/लोन स्केल के विस्तार?

(थोड़ा अस्वीकरण: क्षमा याचना अगर मैंने कुछ स्पष्ट नहीं छूटा है, यह एक परियोजना मैं दिन के चरम सिरों पर पूरा करने के लिए कोशिश कर रहा हूँ के लिए है)

Answer 1

सबसे पहले, आप एक प्रक्षेपण बनाना चाहते हैं , और d3.geo.path को असाइन करें, ताकि आप प्रक्षेपण सेटिंग्स को कस्टमाइज़ कर सकें।

var albers = d3.geo.albers(), 
    path = d3.geo.path().projection(albers); 

डिफ़ॉल्ट प्रक्षेपण d3.geo.albersUsa, जो वास्तव में एक समग्र प्रक्षेपण (चार अलग अलग असंतत क्षेत्रों के साथ) 48 राज्यों, अलास्का, हवाई और पर्टो रीको दिखाने के लिए तैयार किया गया है। आह, ethnocentrism। ;) Git भंडार में

उपयोग albers example सही प्रक्षेपण सेटिंग्स सहभागी निर्धारित करने के लिए। सेटिंग्स आप स्थापित करने की आवश्यकता हैं:

• मूल NYC के अक्षांश और देशांतर होना चाहिए (शायद 73.98 °, 40.71 °)
• का अनुवाद अपने प्रदर्शन क्षेत्र (ताकि के केंद्र होना चाहिए, अगर आप कुछ 960 × 500 ड्राइंग, आप डिफ़ॉल्ट 480,250 का उपयोग कर सकते हैं; यह मूल का पिक्सेल स्थान होगा)
• स्केल कुछ संख्या है जो ज़ूम-इन करने के लिए कितना निर्दिष्ट करता है; चूंकि आप एक शहर के पैमाने पर नक्शा तैयार कर रहे हैं, तो संभवतः आप 10000

जैसे अधिक मूल्य चाहते हैं, अंत में, आपको कुछ समांतर चुनने होंगे। आप d3.geo.albers() द्वारा प्रदान किए गए डिफ़ॉल्ट का उपयोग कर सकते हैं, लेकिन NYC के लिए अधिक उपयुक्त हो सकते हैं। शायद यूएसजीएस के साथ जांच करें, क्योंकि वे अक्सर विभिन्न मानचित्र क्षेत्रों के लिए मानक समानांतर प्रकाशित करते हैं।