D3 LineString между двумя объектами D3 центроида
У меня есть набор данных, который закодирован с помощью кода FIPS переписи для штатов и округов (т.е. Нью-Йорк - это FIPS 36, округ Кингс - это FIPS 36047). Я сопоставляю эти данные, используя проекцию d3.geo.albersUSA из файла TopoJSON, который использует коды FIPS в качестве идентификаторов для функций штата и округа. Это отлично подходит для хороплетов, где мне просто нужно присоединиться по ID.
Однако я хочу рисовать линии от центра тяжести одного объекта к другому, используя path.centroid(функция) и тип пути LineString. Вот упрощенный пример моих данных:
Start_State_FIPS, End_State_FIPS, Count_of_things
2,36,3
1,36,13
5,36,5
4,36,8
6,36,13
8,36,3
Я использую эти же данные для построения кругов на карте, используя поле count_of_things для установки радиуса. Это работает без проблем. Чтобы настроить линии, я создал карту var с кодом FIPS и центроидом объектов, затем использовал кодовую клавишу FIPS, чтобы извлечь начальные и конечные точки из моих данных.
Мой код рисует линии, но определенно не между точками центроида. Я не думал, что мне нужно что-то делать с проекцией точек, поскольку они исходят из функций, которые уже настроены для проекции карты, но, возможно, я ошибаюсь. Вот мой код:
var arclines = svg.append('g')
data_nested = d3.map(my_data)
var state_points = new Map();
var statesarc = topojson.feature(us, us.objects.states).features
statesarc.forEach(function(d) {
state_points.set(d.id, path.centroid(d))
})
arcdata = []
data_nested.values().forEach(function(d) {
arcline = {source: state_points.get(parseInt(d.Start_State_FIPS)), endpoint: state_points.get(parseInt(d.End_State_FIPS))}
arcdata.push(arcline)
})
arclines.selectAll("path")
.data(mydata)
.enter.append("path")
.attr('d', function(d) { return path({type: "LineString", coordinates: [d.source, d.endpoint]}) })