{
const svgBackgroundColor = "#3d405b",
svg = d3.create("svg")
.attr("viewBox", [0,0,2000,2000])
.style("background-color", svgBackgroundColor),
fontFamily = "Assistant",
circleBackground = "#3d405b",
circleOpacity = 0.9,
arcOpacity = 0.7,
fontColor = '#a5abaf'
const linkNums = linkNumsArray[0],
labelText = labelTextArray[0];
const links = [];
const parseddata = data.map(function(d){
let dataObject =
{
pu_name: d.pu_name,
bronx: d.Bronx,
brooklyn: d.Brooklyn,
statenIsland: d['Staten Island'],
newark: d['Newark Airport'],
queens: d.Queens,
jfk: d['JFK Airport'],
laguardia: d['LaGuardia Airport'],
manhattan: d.Manhattan
};
for(let prop in dataObject){
if(prop != 'pu_name'){
let link = {'source': linkNums[dataObject['pu_name']],'target': linkNums[prop], 'count': dataObject[prop]};
links.push(link);
}
}
return dataObject;
});
const nodes = data.map(function(d,i){return linkNums[d.pu_name];});
const x = d3.scalePoint()
.range([0, width])
.domain(nodes),
lineScale = d3.scaleLinear()
.domain([0,maxCount])
.range([10,700]);
svg
.selectAll('links')
.data(links)
.join('path')
.attr('d', function (d) {
const start = x(d.source)
const end = x(d.target)
return ['M', start, 500,
'A',
(start - end)/2,
',',
(start - end)/2,
0,
0,
',',
0,
end,
',',
500
]
.join(' ');
})
.style("fill", "none")
.attr("stroke", d => color[d.source])
.attr("stroke-width", d => lineScale(d.count))
.attr("opacity", arcOpacity)
.attr("transform", "translate(235,500)");
const locations = svg
.selectAll("nodes")
.data(nodes);
locations
.join("circle")
.attr("cx", d => x(d))
.attr("cy", 500)
.attr("r", 80)
.attr("fill", circleBackground)
.attr("stroke", d => color[d])
.attr("stroke-width", 10)
.attr("opacity", circleOpacity)
.attr("transform", "translate(235,500)");
locations
.join("text")
.attr("x", d => x(d))
.attr("y", 510)
.text(d =>labelText[d])
.attr("fill", d => color[d])
.attr("stroke", d => color[d])
.style("text-anchor", "middle")
.style("font-weight", "bold")
.style("font-family", fontFamily)
.style("font-size", "1.65em")
.attr("transform", "translate(235,500)")
yield svg.node();
}