Question

我正在尝试创建一个不会在UI上显示的canvas元素，并向其中绘制GoJS数据

    const divElement: HTMLDivElement = document.createElement('div')
    divElement.id='pngCanvas';
    divElement.style.height='1000px';
    divElement.style.width='1000px';
    const floorNameData=JSON.parse(localStorage.getItem('floorNameArray'))
    const selectedFloor = floorNameData.find((item, index) => {
        return item.selected === true;
    });
    const mappedModelData=JSON.parse(localStorage.getItem('floorArray'))[selectedFloor.floorId]
    const fpInstance: Floorplan = new Floorplan(divElement);
    var virtualCanvas = document.querySelector('canvas');
    debugger
    fpInstance.model = go.Model.fromJson(mappedModelData);

GoJS将画布元素绘制到已分配的div，我将画布视为div元素的innerHTML。如何检索画布元素和样式，以便我可以转换为png而无需在浏览器中显示。

Answer 1

他的问题是echo $_GET["select"]; //Returns Orange不在文档中，因此div不会返回任何内容，因为它看起来像文档中一样。

更改

document.querySelector('canvas')

到

var virtualCanvas = document.querySelector('canvas');

Answer 2

您不应该依赖HTML DIV元素中Canvas元素的存在。它不是受支持的API的一部分，因此您不能依赖它。

相反，您应该调用 Diagram.makeImage 或 Diagram.makeImageData 。 https://gojs.net/latest/api/symbols/Diagram.html#makeImage

在https://gojs.net/latest/intro/makingImages.html上了解有关渲染的更多信息。另外请考虑：https://gojs.net/latest/intro/makingSVG.html。

找不到在div中创建的画布元素

2 个答案: