SVG Triangulation

2b:null 2c:["$","title",null,{"children":"svg | wolfiex | Observable"}] 31:T6e7, SVG Triangulation

fdsklf 32:T58f, SVG Triangulation

33:Ta60,{ var extractPath = require("extract-svg-path").parse; // var loadSvg = require("load-svg"); var createMesh = require("../"); var drawTriangles = require("draw-triangles-2d"); var canvas = document.createElement("svg-canvas"); var context = canvas.getContext("2d"); var size = 256; canvas.width = size; canvas.height = size; // loadSvg("demo/svg/entypo-social/twitter.svg", function (err, svg) { // if (err) throw err; var svgPath = extractPath( `` ); var mesh = createMesh(svgPath, { scale: 1, simplify: 0.01 }); render(mesh); // }); console.log(mesh, svgPath); function render(mesh) { context.clearRect(0, 0, size, size); context.save(); var scale = size / 2; context.translate(size / 2, size / 2); context.scale(scale, -scale); context.beginPath(); context.lineJoin = "round"; context.lineCap = "round"; context.lineWidth = 2 / scale; drawTriangles(context, mesh.positions, mesh.cells); context.fillStyle = "#d86c15"; context.strokeStyle = "#3b3b3b"; context.fill(); context.stroke(); context.restore(); // } canvas.appendChild(canvas); } }34:[] 2f:{"id":"df3abb50da111605","slug":null,"title":"svg","thumbnail":"49e3b8e7b5c25c76853ac31b4ed41e895e2facb91573182f4e68e995d0ccb899","access_level":"public","create_time":"$D2023-10-26T19:14:04.535Z","update_time":"$D2023-10-26T19:36:23.499Z","view_time":null,"first_public_time":"$D2023-10-26T19:14:04.535Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"5ac3a182adb31463","login":"wolfiex","name":"","avatar_url":"https://avatars-next.observableusercontent.com/920ad9da2e8dc46272a1a9d71eb3bddb5e1daea20ee8a2ee301b59af578ad9af","tier":"starter_2024"},"version":48,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"3e68e1c0f733af7c","login":"wolfiex","name":"","avatar_url":"https://avatars-next.observableusercontent.com/920ad9da2e8dc46272a1a9d71eb3bddb5e1daea20ee8a2ee301b59af578ad9af","tier":null}],"members":[{"type":"individual","id":"3e68e1c0f733af7c","login":"wolfiex","name":"","avatar_url":"https://avatars-next.observableusercontent.com/920ad9da2e8dc46272a1a9d71eb3bddb5e1daea20ee8a2ee301b59af578ad9af","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"svg","cells":[{"id":0,"value":"# svg ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"$31","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":22,"value":"width = 800","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"height = 800","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"require(\"svg-mesh-3d\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"$32","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":36,"value":"$33","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 30:"$2f:body"