прокладочных точек с использованием d3.geo.tile

Question

Я расширение кода в этом примере:

http://bl.ocks.org/mbostock/5914438

Но я не могу понять, как расставить точки на этой карте в порядке в которых они могут быть интегрированы в масштабирование. Пути работают нормально, но кажется, что модифицированная проекция не может использоваться для проецирования координат точек, а в увеличенной функции масштаб() дополнение к преобразованию() при применении к элементу, содержащему точки, кажется масштабированным точки настолько большие, что они заполняют весь экран. Вот мои дополнительные пункты:

var sitesG = svg.append("g").attr("id","sitesG"); 
var osites = sitesG.selectAll(".sites") 
.data(sites) 
.enter() 
.append("g") 
.attr("transform", function(d) {return "translate(" + projection([d.x,d.y]) + ")scale(" + projection.scale() + ")"}) 

osites.append("circle").attr("r", 10) 

А вот функция в увеличенном():

d3.select("#sitesG") 
    .attr("transform", "translate(" + zoom.translate() + ")scale(" + zoom.scale() + ")") 

Я попытался это с отдельными элементами для сайтов, а также, но без успеха. Есть ли у кого-нибудь пример, который ставит точки на geo.tile?

Answer 1

Мне удалось выяснить это. Моя основная проблема заключалась в том, что я не масштабировал атрибут «r» окружностей, чтобы соответствовать zoom.scale(), когда я правильно проецировал точки, что заставило их иметь радиусы 13 000 пикселей +.

Вы можете посмотреть его здесь: http://bl.ocks.org/emeeks/6147081