ElGrapho
ElGrapho copied to clipboard
Canvas Height and Width are Zero
I am trying to integrate this library with svelte and I am using rollup up to bundle everything together. Look like all the DOM nodes have been added but the canvas node has a width and height of zero. I have added my code/error msg below. Can't figure out why canvas width/height is always zero.
import {onMount, tick} from 'svelte'
import ElGrapho from 'elgrapho'
let container
let graph
let model = {
nodes: [
{x: 0, y: 0.6, group: 0, label: 0},
{x: -0.4, y: 0, group: 1, label: 1},
{x: 0.4, y: 0, group: 1, label: 2},
{x: -0.6, y: -0.6, group: 2, label: 3},
{x: -0.2, y: -0.6, group: 2, label: 4},
{x: 0.2, y: -0.6, group: 2, label: 5},
{x: 0.6, y: -0.6, group: 2, label: 6}
],
edges: [
{from: 0, to: 1},
{from: 0, to: 2},
{from: 1, to: 3},
{from: 1, to: 4},
{from: 2, to: 5},
{from: 2, to: 6}
]
}
async function diagramInit(){
graph = new ElGrapho({
container: container,
model: model,
height: 500,
width: 500
})
}
onMount(diagramInit)
Uncaught DOMException: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The image argument is a canvas element with a width or height of 0.
at xxxxxxxx/build/bundle.js:8:74837
at Array.forEach (<anonymous>)
at o.Viewport.render (xxxxxxxxxxx/build/bundle.js:8:74795)
at xxxxxxxxx/build/bundle.js:8:108609
at Array.forEach (<anonymous>)
at executeFrame (xxxxx/build/bundle.js:8:108073)