如何使用嵌入式API

Question

我确定使用核心的API，方法“svgCanvas.importImage（URL）可以导入base64编码图像，以导入SVG编辑的图像/栅格。

但嵌入的API不公开这种私有方法，似乎我不能使用任何方法使用的方法（svgFromgJson等）。

有没有人有关于如何加载基本64字符串代表图像svg-edit启动？我正在考虑将该字符串包装在模拟svg文件中的< image>标记中，并以此方式导入。

Does SVG support embedding of bitmap images?

Answer 1

修改现有的代码，根据我原来的问题中的答案我修改了他们的示例导入，它的工作原理非常奇妙。

1. 包括在你的页面
2. 的embedapi.js定义一个iframe来显示SVG编辑

3. 呼叫在iframe的onload事件下面的代码功能

   // call onLoad for the iframe 
   var frame = document.getElementById('svgedit'); 
       svgCanvas = new embedded_svg_edit(frame); 
   
   // Hide main button, as we will be controlling new/load/save etc from the host document 
   var doc; 
   doc = frame.contentDocument; 
   if (!doc) 
   { 
       doc = frame.contentWindow.document; 
   } 
   
       var mainButton = doc.getElementById('main_button'); 
       mainButton.style.display = 'none';    
       var embeddedImage='<image xlink:href="data:image/png;base64,..OMITTED FOR BREVITY.." id="svg_2" height="128" width="128" y="0" x="0"/>'; 
   
       var svgDef = '<svg width="128" height="128" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><g><title>Layer 1</title>' + embeddedImage + '</g></svg>'; 
       svgCanvas.setSvgString(svgDef); 
   
   }