chart = {
const width = 900,
height = 900;
const svg = d3.create("svg")
.attr("viewBox", [0, 0, width, height]);
var projection = d3
.geoMercator()
.fitSize([width, height], newQgisBorder);
var path1 = d3.geoPath().projection(projection);
var path2 = d3.geoPath().projection(projection);
var path3 = d3.geoPath().projection(projection);
var path4 = d3.geoPath().projection(projection);
var path5 = d3.geoPath().projection(projection);
var path6 = d3.geoPath().projection(projection);
var path7 = d3.geoPath().projection(projection);
var g = svg.selectAll('g').attr("id", "paths");
var c = svg.selectAll("circle")
var p = svg.selectAll("polyline")
var t = svg.selectAll("text")
staticLines(path2, manhattanDistrictOutlines.features,"none",'1','.25',"black")
staticLines(path3, buildingFootprints.features,"none",'1','.75',"black")
staticLines(path4, roadCenterlines.features,"none",'.5','.5',"black")
staticLines(path5, manhattanOutline.features,"none",'1','.5',"black")
staticLines(path7, qgistoobservable.features,"none",'1','.5',"black")
function staticLines(path, data, sfill, sOpac, sW, stroke){
g.enter().append("path")
.data(data)
.enter()
.append("path")
.attr('class','outlines')
.attr("d", path)
.style("fill", sfill)
.style('stroke-opacity',sOpac)
.style("stroke-width", sW)
.style("stroke", stroke)
}
g.enter().append("path")
.data(buildingFootprints.features)
.enter()
.append("path")
.attr('class', 'outlines')
.attr("d", path7)
.style("fill", fillColor)
.style('stroke-opacity', '1')
.style("stroke-width", '0')
.style("stroke", 'none');
function fillColor(d, i) {
var year = 2024 - d.properties.cnstrct_yr;
year = Math.min(255, Math.max(0, Math.pow(year, 1.2)));
var scaledYear = year % 255;
var red = Math.min(50, scaledYear * 0.2);
var green = Math.min(255, scaledYear * 0.8);
var blue = Math.min(255, scaledYear * 1.2);
var color = `rgb(${red},${green},${blue})`;
console.log(color);
return color;
}
polyline(testBorder,'white','1','2','white')
polyline(legendLinesM,'none','1','.5','black')
polyline(legendTextM,'black','1','.5','black')
function polyline(data, sfill, sOpac, sW, stroke){
g.enter().append("polyline")
.data(data)
.enter()
.append('polyline')
.attr("points", function(d){return d})
.style("fill", sfill)
.style('stroke-opacity',sOpac)
.style("stroke-width", sW)
.style("stroke", stroke)
}
return svg.node();
}