Public
Edited
Apr 24, 2023
1 fork
1 star
layoutWASM = await require(`@antv/layout-wasm@${version}`)
await layoutWASM.initThreads(true)
canvas = {
const canvas = createCanvas();
canvas.document.documentElement.translate(200, 200);
canvas.document.documentElement.scale(0.5);
const stepTime = 0.035;
const center = [200, 200];
// const edges = [];
// sim.edges.forEach((edge) => {
// let source = edge.source;
// let target = edge.target;
// const line = new G.Line({
// style: {
// x1: source.location[0],
// y1: source.location[1],
// x2: target.location[0],
// y2: target.location[1],
// lineWidth: 1,
// stroke: "grey"
// }
// });
// edges.push(line);
// canvas.appendChild(line);
// });
// const nodes = [];
// sim.nodes.forEach((node) => {
// const circle = new G.Circle({
// style: {
// cx: node.location[0],
// cy: node.location[1],
// r: 6,
// fill: "rgb(207,226,252)",
// stroke: "rgb(118,145,241)",
// lineWidth: 2
// }
// });
// nodes.push(circle);
// canvas.appendChild(circle);
// });
// canvas.addEventListener("afterrender", () => {
// sim.nodes.forEach((node, i) => {
// const circle = nodes[i];
// circle.style.cx = node.location[0];
// circle.style.cy = node.location[1];
// });
// sim.edges.forEach((edge, i) => {
// let source = edge.source;
// let target = edge.target;
// const line = edges[i];
// line.attr({
// x1: source.location[0],
// y1: source.location[1],
// x2: target.location[0],
// y2: target.location[1]
// });
// });
// sim.update(stepTime);
// });
invalidation.then(() => {
// sim.resetNodePlacement();
canvas.destroy();
});
return canvas.getConfig().container;
}
G = require("@antv/g")
Canvas2D = require("@antv/g-canvas")
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
