Hi Lyubo,
That works. Thanks ! But the diagram having composite nodes are not working. Below is sample code,
var canvasParent = document.createElement("div"); var canvas = document.createElement("canvas"); canvasParent.appendChild(canvas); let diagram = Diagram.create(canvas); let factory = <any>diagram.getFactory() as Factory;
var node = new this.OrgChartNode2();
node.setMainImage("./../../../../Main.png"); node.setFirstImage("./../../../../One.png"); node.setSecondImage("./../../../../Two.png"); node.setThirdImage("./../../../../Three.png"); node.setFourthImage("./../../../../Four.png"); node.setNoOfElementsText("8");
diagram.addItem(node);
diagram.repaint();
var img = canvas.toDataURL("image/png", "");
const link = document.createElement('a'); link.download = 'Diagram-html.png'; link.href = img; link.click();
OrgChartNode2 = CompositeNode.classFromTemplate("OrgChartNode2", { component: "GridPanel", id: "id", rowDefinitions: ["*"], columnDefinitions: ["22"], children: [ { component: "GridPanel", rowDefinitions: ["18", "5"], columnDefinitions: ["18", "5"], children: [ { gridColumn: 0, component: "Image", name: "MainImage", autoProperty: true, location: "MainImage.png", margin: "3", imageAlign: "TopLeft" }, { gridColumn: 0, component: "Image", name: "FirstImage", autoProperty: true, location: "FirstImage.png", margin: "3, 3, 0, 0", imageAlign: "TopLeft" }, { gridColumn: 1, component: "Image", name: "SecondImage", autoProperty: true, location: "SecondImage.png", margin: "3, 3, -50, 5", imageAlign: "TopRight" }, { gridColumn: 1, component: "Image", name: "ThirdImage", autoProperty: true, location: "ThirdImage.png", margin: "3, 30, -50, 3", imageAlign: "TopRight", width: "3" }, { gridColumn: 1, component: "Image", name: "FourthImage", autoProperty: true, location: "FourthImage.png", margin: "3, 50, -50, 3", imageAlign: "BottomRight", width: "3" }, { gridColumn: 0, component: "Text", name: "NoOfElementsText", autoProperty: true, text: "title", margin: "3, 40, 0, 0", font: "Verdana 12px", textAlign: "BottomLeft" }, ] }, ] });
Images are not exported. Only text is exported. May I know why this didn't work for me?
Regards, Kannan
|