D3 path not showing

183 views Asked by At

I am trying to make some features from a .geojson file render using D3 and D3geo and i am following this https://www.d3indepth.com/geographic/ as a guide. I don't really know what i am doing since i am not good at programing. It shows no errors on devtool console and when i inspect it in chrome it shows that the paths are created but the are not showing.

here is my code, the js part:

var width = Math.max(
  document.documentElement.clientWidth,
  window.innerWidth || 0
);
var height = Math.max(
  document.documentElement.clientHeight,
  window.innerHeight || 0
);

d3.json("2022.json").then(function (data) {
  let geojson = data;
  console.log(data);

  let projection = d3
    .geoMercator()
    //.scale(1000)
    //.center([20, 40])
    //.translate([456, 250]);

  projection.fitExtent([width, height], data);

  let geoGenerator = d3.geoPath().projection(projection);

  function update(geojson) {
  let u = d3
    .select("#content")
    .data(geojson.features)
    .enter()
    u.append('path')
    .join("path")
    .attr("d", geoGenerator);
  }

  update(geojson);

});

enter image description here

0

There are 0 answers