D3 ile bir haritada enlem-boylam koordinatlarını nasıl oluşturabilirim?

Amerika Birleşik Devletleri haritasının üstündeki keyfi enlem-boylam koordinat kümelerinin noktalarını üst üste koymaya çalışıyorum.

Şimdiye kadar D3 kartografisi örneğini buldum , ancak X'e noktalar yerleştirmeye çalıştığımda, Y piksel koordinatları tuvalden çok uzakta görünüyorlar. Ben buldunuz d3 koordinat sistemleri dahil workshot ders notlarını , ama hala haritanızda nasıl olsun enlem / boylam coords emin değilim.

Şimdiye kadar sahip olduğum şey bu (hemen hemen sadece ABD'nin bir haritası)

Bu çalışmanın nasıl yapılacağına dair tavsiyeler çok takdir edilecektir!

— Jay Taylor
kaynak

d3 svg doğru mu?

— Mapperz

Evet, d3 svg'dir.

— Jay Taylor

Svg'yi haritaya dönüştürmenin iyi bir örneği burada - github.com/kartograph/kartograph.py/wiki/… Path and Measures kullanarak

— Mapperz

Noktalarınızın enlemesini ve uzunluğunu haritaya yansıtmak için bir projeksiyon () fonksiyonuna sahip olmanız gerekir. Varsayılan olarak, bir d3 coğrafi yolu albersUsa projeksiyonunu kullanır, böylece açıkça bildirebilirsiniz:

var projection = d3.geo.albersUsa();

Bunun AlbersUsa kullanmayan örneklerde yapıldığını göreceksiniz ve projeksiyonu tanımlayarak değiştirebilirsiniz. Tanımlanması onu bir işlev olarak kullanılabilir kılar. Bu şekilde puanlarınızı svg daireler olarak yerleştirebilirsiniz:

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

Bu New York'un sert çevresine bir çember bırakmalıdır. Daha sonra "lat" ve "long" içeren verileri öznitelik olarak bağlayabilirsiniz, bu durumda şöyle görünür:

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

Yansıtma işlevi [uzun, enlem] dizisini alır ve dönüştürme, çevirme () sözdizimine iyi uyan bir [x, y] dizisi döndürür veya diziyi x ve y değerleri için bölebilirsiniz.

Aşağıdaki örnek, polileri, çizgileri ve noktaları yerleştirir ve bir csv'den noktaları alır ve bunları bir haritaya yansıtır, ancak g öğesini dönüştürdüğünü ve bu öğeye bir daire eklediğini unutmayın (ayrıca bir etiket veya başka yönler de isteyebilirsiniz tümü öngörülen g öğesine eklenecek bir siteye):

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

— İlyas
kaynak