Вам необходимо иметь функцию projection () для проецирования широты и долготы ваших точек на карту. По умолчанию гео-путь d3 использует проекцию albersUsa, поэтому вы можете объявить ее явно:
var projection = d3.geo.albersUsa();
Вы увидите это в примерах, которые не используют AlbersUsa, и, определив проекцию, вы можете изменить ее. Его определение делает его доступным как функцию. Таким образом, вы можете разместить свои очки в виде кружков SVG:
svg.append("circle").attr("r",5).attr("transform", function() {return "translate(" + projection([-75,43]) + ")";});
Это должно бросить круг на неровной окрестности Нью-Йорка. Затем можно связать данные, которые имеют атрибуты «lat» и «long», и в этом случае это будет выглядеть так:
svg.selectAll("circles.points")
.data(yourData)
.enter()
.append("circle")
.attr("r",5)
.attr("transform", function(d) {return "translate(" + projection([d.long,d.lat]) + ")";});
Функция проекции принимает массив [long, lat] и возвращает массив [x, y], который отлично вписывается в синтаксис transform, translate (), или вы можете разделить массив для значений x и y.
В приведенном ниже примере размещаются поля, линии и точки, а также берутся точки из csv и проецируют их на карту, но обратите внимание, что он преобразует элемент g и добавляет кружок к этому элементу (вам также может понадобиться метка или другие аспекты к сайту, все из которых будут добавлены к этому проецируемому элементу):
https://gist.github.com/4414107
http://bl.ocks.org/d/4414107/