Что у меня есть:
d3.json(englandJsonUrl).then(function(englandTopology) // A topojson of the map of england
{
d3.json(walesJsonUrl).then(function(walesTopology) // A topojson of the map of Wales
{
d3.csv(csvUrl).then(function(csv) // A csv file with the cities I want to put a marker in
{
var welshGeojson = topojson.feature(walesTopology, walesTopology.objects.lad)
var englishGeojson = topojson.feature(englandTopology, englandTopology.objects.LocalAuthorityDistricts);
// Parsing my topojsons to geojsons
var secretaries = JSON.parse(JSON.stringify(csv));
englishDeps.selectAll("path")
.data(englishGeojson.features)
.enter()
.append("path")
.attr("d", englishPath); //How I display the map of england
welshDeps.selectAll("path")
.data(welshGeojson.features)
.enter()
.append("path")
.attr("d", welshPath); // how I display the map of wales
});
});
});
Карты отображаются нормально, к вашему сведению.
Что я хочу сделать, так это то, что я хочу пройти через secretaries
json; посмотрите, какой объект содержит тот же идентификатор, что и объекты в invgishGeo Json или welshGeo Json, и поместите маркер в правильный многоугольник.
В настоящее время код для добавления маркера на карту представляет собой следующее: (работает, но, конечно, не в правильных местах):
var marks = [{long: -70, lat: 53}];
englishDeps.selectAll(".mark")
.data(marks)
.enter()
.append("svg:image")
.attr('class','mark')
.attr('width', 20)
.attr('height', 20)
.attr("xlink:href","mapIconUrl")
.attr("transform", function(d)
{
return "translate(" + projection([d.long,d.lat]) + ")"; //do i need to change this bit ?
});