Hi,
I am getting an error while taking the image using myDiagram.makeImage().
This issue is coming only in IE.
I have tried using the size property, but that didn’t work out.
Thanks in advance.
Hi Simon,
I am actually trying to save the image using <span id=“599a9533-1b34-4d09-bf89-6d27324ad7aa” ginger_software_uiphraseguid=“38b0e0be-cd30-41c7-abe4-5e1814e93a2f” =“GINGER_SOFTWARE_mark”>makeImage() method. To save the image I have written a<span id=“88f60e33-7cab-4d07-8520-ef199fa8bce5” ginger_software_uiphraseguid=“d9378edf-548c-41de-97e5-b1f1368ad109” =“GINGER_SOFTWARE_mark”> .<span id=“2ab1eb14-760f-4f02-a2f3-6e3af3d02d77” ginger_software_uiphraseguid=“d9378edf-548c-41de-97e5-b1f1368ad109” =“GINGER_SOFTWARE_mark”>cs code that accepts image data(as a Base64 encoded string).
Below is the function that gets called to retrieve the image data <span id=“e8f33bc0-4051-414d-bb08-93a3177b69e6” ginger_software_uiphraseguid=“a23b1739-ce23-4f6a-91c8-debc97d1fd4c” =“GINGER_SOFTWARE_mark”>on a button click()
<span id=“f8cc45a4-8c30-4b22-8948-34abbe3c77fa” ginger_software_uiphraseguid=“cffcd755-3cf1-4266-b6d2-ffa5bbc871a3” =“GINGER_SOFTWARE_mark”>function SaveChartClick() {
<span id=“e0794e5a-59dd-497b-8e38-be49c7a34cfa” ginger_software_uiphraseguid=“e9cd21ea-7e21-42d0-8c0a-98e58e75f81b” =“GINGER_SOFTWARE_mark”>var opener = window<span id=“984b6854-e453-4acb-8030-950191eaea4b” ginger_software_uiphraseguid=“e9cd21ea-7e21-42d0-8c0a-98e58e75f81b” =“GINGER_SOFTWARE_mark”>.opener;
<span id=“2bbb53db-a25b-4d1d-b7df-1ecf64f7d54f” ginger_software_uiphraseguid=“b4173fb3-921f-4237-b84d-c8841656550e” =“GINGER_SOFTWARE_mark”>if (opener) {
<span id=“a9dd3021-cc86-4d89-b5e0-711f4e82217f” ginger_software_uiphraseguid=“cfaabb00-25d9-4c84-a486-2d51c445065e” =“GINGER_SOFTWARE_mark”>var <span id=“a17b5aa8-604e-44a4-8af2-f2765ab87210” ginger_software_uiphraseguid=“cfaabb00-25d9-4c84-a486-2d51c445065e” =“GINGER_SOFTWARE_mark”>imgContainer = opener<span id=“6da0bafd-023f-4749-aa7c-e354e8ccae07” ginger_software_uiphraseguid=“cfaabb00-25d9-4c84-a486-2d51c445065e” =“GINGER_SOFTWARE_mark”>.document<span id=“e7153c87-a10c-4911-a1e7-3fe2d7549e8a” ginger_software_uiphraseguid=“cfaabb00-25d9-4c84-a486-2d51c445065e” =“GINGER_SOFTWARE_mark”>.<span id=“3f29f408-c6c8-4d22-b1ad-a85851bc3244” ginger_software_uiphraseguid=“cfaabb00-25d9-4c84-a486-2d51c445065e” =“GINGER_SOFTWARE_mark”>querySelectorAll("<span id=“d147c677-d694-49f6-823f-a29381ac7d83” ginger_software_uiphraseguid=“cfaabb00-25d9-4c84-a486-2d51c445065e” =“GINGER_SOFTWARE_mark”>imgOrgChart");
<span id="7dbd2b7d-fc7a-49ab-97d6-117462678b64" ginger_software_uiphraseguid="98243db7-8050-4007-a64f-74ba228027a8" ="GINGER_SOFTWARE_mark">if</span> (<span id="bbd4f8ae-490a-4a62-b372-66a15d502c90" ginger_software_uiphraseguid="98243db7-8050-4007-a64f-74ba228027a8" ="GINGER_SOFTWARE_mark">imgContainer</span>) {
// <span id="34ea5714-7229-4b0c-a4e7-1cce98d98911" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">img</span> = <span id="89f15302-83a3-44a5-9914-4106b5739abc" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">myDiagram</span><span id="e238db58-f4ce-423f-ae64-407607ee383d" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">.</span><span id="4be381fc-01a9-4a1b-b01b-8e698280bc66" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">makeImageData</span>(<span id="c5e4e46f-00fa-4f1e-ae73-4acccf6fbfe3" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">{ </span>background: 'white', scale: $('<span id="3f20c83b-d7c5-46b3-9c2e-37ab1a976ad6" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">.</span><span id="a89ce052-2063-4dec-8c8c-1f8c249387b2" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">hdnZoomScale</span>')<span id="fc35ca8a-b528-4fdc-a610-66f6d170bddd" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">.</span><span id="942a76d2-bb7b-44d9-b3cd-01dd769dc113" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark">val</span>(), type: "image/png"<span id="4f29d568-be35-4da7-bc31-3673d87c5e19" ginger_software_uiphraseguid="2aacb14e-8647-49d1-a9d0-904f36735d62" ="GINGER_SOFTWARE_mark"> }</span>);
<span id="60f12e95-afd7-458b-ae4e-dafb29459586" ginger_software_uiphraseguid="287888da-5ef3-4649-a9dc-242ecb0fb857" ="GINGER_SOFTWARE_mark">img</span> =<font color="#ff3399"> <span id="f1088549-3c9f-4577-8a69-ac46a8ba9dac" ginger_software_uiphraseguid="287888da-5ef3-4649-a9dc-242ecb0fb857" ="GINGER_SOFTWARE_mark">myDiagram</span><span id="777c8df3-c05c-4838-a248-b74822231a83" ginger_software_uiphraseguid="287888da-5ef3-4649-a9dc-242ecb0fb857" ="GINGER_SOFTWARE_mark">.</span><span id="e4169890-a2f3-4603-8dc0-ede73c74ba09" ginger_software_uiphraseguid="287888da-5ef3-4649-a9dc-242ecb0fb857" ="GINGER_SOFTWARE_mark">makeImage</span>({</font>
<span id=“31ec9efb-3720-4cba-b16b-5315c695d788” ginger_software_uiphraseguid=“5e3cebec-bc21-491e-872f-4fcfddd333bc” =“GINGER_SOFTWARE_mark”>scale: $(’<span id=“d55362a3-9dbf-4f51-85be-14b730142591” ginger_software_uiphraseguid=“5e3cebec-bc21-491e-872f-4fcfddd333bc” =“GINGER_SOFTWARE_mark”>.<span id=“33fda1ea-a878-420c-819a-279753a38a2f” ginger_software_uiphraseguid=“5e3cebec-bc21-491e-872f-4fcfddd333bc” =“GINGER_SOFTWARE_mark”>hdnZoomScale’)<span id=“fdc79da9-9bed-4170-ae27-a000e139ed3a” ginger_software_uiphraseguid=“5e3cebec-bc21-491e-872f-4fcfddd333bc” =“GINGER_SOFTWARE_mark”>.<span id=“b143bfa1-2d9b-4784-89b0-af9915eac5fa” ginger_software_uiphraseguid=“5e3cebec-bc21-491e-872f-4fcfddd333bc” =“GINGER_SOFTWARE_mark”>val(),
<span id=“8c0971e1-114a-445f-9e69-e1b31f321c46” ginger_software_uiphraseguid=“c41a91c1-5fb3-4219-a618-c03a3d1f9ea2” =“GINGER_SOFTWARE_mark”>maxSize: new go<span id=“d3277a90-1be7-4dde-92b4-930eb55c9af1” ginger_software_uiphraseguid=“c41a91c1-5fb3-4219-a618-c03a3d1f9ea2” =“GINGER_SOFTWARE_mark”>.Size(9999, 9999)
});
<span id="09f1bf0f-90f1-4c40-a27b-3269cd1d1679" ginger_software_uiphraseguid="445bbaf0-5ee2-4b51-b472-24252d81d309" ="GINGER_SOFTWARE_mark">var</span> <span id="11da640e-6160-4960-87f5-ddecd3232cd6" ginger_software_uiphraseguid="445bbaf0-5ee2-4b51-b472-24252d81d309" ="GINGER_SOFTWARE_mark">img</span> = <span id="e7f0d80e-866e-4aef-86fb-f8c1c3d5df9a" ginger_software_uiphraseguid="445bbaf0-5ee2-4b51-b472-24252d81d309" ="GINGER_SOFTWARE_mark">img</span><span id="7319e8fb-3520-4159-b5a9-5e83593abe13" ginger_software_uiphraseguid="445bbaf0-5ee2-4b51-b472-24252d81d309" ="GINGER_SOFTWARE_mark">.</span><span id="9031b7c4-056f-4000-a0fb-3337edf3df06" ginger_software_uiphraseguid="445bbaf0-5ee2-4b51-b472-24252d81d309" ="GINGER_SOFTWARE_mark">src</span><span id="f705c805-029b-434d-a9cc-fe69bfd326e0" ginger_software_uiphraseguid="445bbaf0-5ee2-4b51-b472-24252d81d309" ="GINGER_SOFTWARE_mark">.</span><span id="32fdc111-a5a5-48b2-b153-5e1cf4ae79f7" ginger_software_uiphraseguid="445bbaf0-5ee2-4b51-b472-24252d81d309" ="GINGER_SOFTWARE_mark">replace</span>('data<span id="69d7795d-21e4-4298-b8b8-c097089d7e15" ginger_software_uiphraseguid="445bbaf0-5ee2-4b51-b472-24252d81d309" ="GINGER_SOFTWARE_mark">:</span>image/png;base64,', '');
$("[id$='_hdnSaveImageData']")[0]<span id="bf8bd813-9d7b-4ee8-bc6d-123e549e4587" ginger_software_uiphraseguid="f8f48886-3b49-4ecf-abb6-a9a85a7a0e76" ="GINGER_SOFTWARE_mark">.</span>value = <span id="cc9f562d-4fa6-4724-9e40-f29c900fc4ff" ginger_software_uiphraseguid="f8f48886-3b49-4ecf-abb6-a9a85a7a0e76" ="GINGER_SOFTWARE_mark">img</span>;
}
}
}
Here hidden variable <span id=“4b708c68-c4ac-44b9-abed-9fa6251264e4” ginger_software_uiphraseguid=“c972dd62-919e-4347-9efb-6a5d134bf69d” =“GINGER_SOFTWARE_mark”>hdnZoomScale has the value between<span id=“ac4f8267-9fcc-445f-8f1f-ab5bbc4f9a2f” ginger_software_uiphraseguid=“c972dd62-919e-4347-9efb-6a5d134bf69d” =“GINGER_SOFTWARE_mark”> .1 to 1. This method is working fine in chrome and <span id=“810b821f-1834-4c15-a4e4-de7ff966aa61” ginger_software_uiphraseguid=“5b6f80b8-c23e-4ec9-b678-dddb717eeaa4” =“GINGER_SOFTWARE_mark”>firefox. Only in IE I am getting the error. I have also tried the commented method <span id=“d054f45d-39c3-430a-9f2a-8fbb784e879a” ginger_software_uiphraseguid=“0ada8687-d0c3-432b-a191-5518562a3b0d” =“GINGER_SOFTWARE_mark”>makeImageData()<span id=“a469f9a8-49b6-4972-87be-73a56110ab4d” ginger_software_uiphraseguid=“0ada8687-d0c3-432b-a191-5518562a3b0d” =“GINGER_SOFTWARE_mark”>,but that is not working too.
But if I just call
myDiagram.makeImage({
scale: .35,
maxSize: new go.Size(9999, 9999)
});
In IE it seems to work fine, which is why I think it might be something that you have constructed on the Diagram that is causing the error, perhaps some image or SVG.
Can you share with me what is on the Diagram?
It would be better if we can discuss it over the phone or Skype call so that I can show you my code and explain you the issue scenario<gs id=“ad3182fb-5381-49a1-9a70-129471061e9e” ginger_software_uiphraseguid=“7aba0e46-ce9c-4ab0-a4d7-7f21343aeae4” =“ginger_software_mark”=""><gs id=“9e461850-37d3-4d89-8ae9-51529061e8e2” ginger_software_uiphraseguid=“32fe15c2-7408-43ca-81ef-4ecc48c90044” =“GINGER_SOFTWARE_mark”> ?
Please let me know your availability.
1
< ="ginger-ingG-popup" ="https://cdn.gingersoftware.com/webWidget/ingGMenu/">
We prefer forum or email to better keep track of our customers and their issues with a written/searchable record of everything discussed.
You can email us with details gojs (at) nwoods.com