mapTexture - ╕▒▒╛.js 892 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. import THREE from 'THREE';
  2. import d3 from 'd3';
  3. var projection = d3.geo.equirectangular()
  4. .translate([1024, 512])
  5. .scale(325);
  6. export function mapTexture(geojson, color) {
  7. var texture, context, canvas;
  8. canvas = d3.select("body").append("canvas")
  9. .style("display", "none")
  10. .attr("width", "2048px")
  11. .attr("height", "1024px");
  12. context = canvas.node().getContext("2d");
  13. var path = d3.geo.path()
  14. .projection(projection)
  15. .context(context);
  16. context.strokeStyle = "#333";
  17. context.lineWidth = 1;
  18. context.fillStyle = color || "#CDB380";
  19. context.beginPath();
  20. path(geojson);
  21. if (color) {
  22. context.fill();
  23. }
  24. context.stroke();
  25. // DEBUGGING - Really expensive, disable when done.
  26. // console.log(canvas.node().toDataURL());
  27. texture = new THREE.Texture(canvas.node());
  28. texture.needsUpdate = true;
  29. canvas.remove();
  30. return texture;
  31. }