在JavaScript变量中存储raphael svg

我有一个交互式SVG，需要在我的网站上的多个不同位置绘制。目前我可以通过在每个页面上运行此操作来完成此操作在JavaScript变量中存储raphael svg

$.getScript(UTIL.theme_dir() + '/assets/js/data/lot-plan.js', function() { 

    // Plan Interactions 
    // Builds the hovers and click events 
    obj.planInteractions(lotInfo); 

    // When clicking on custom title blocks, highlight approriate units 
    $(".custom-title").on('click', function(){ 
     if(!$(this).hasClass('disabled')){ 

      obj.planHighlight(lotInfo, $(this)); 

     } 
    }); 

    obj.scaleSVG('#lot-plan'); 

});

但是正如您所看到的，这将每次调用lot-plan.js文件。我一直在想办法调用一次，并将它的数据存储在一个var中重用。这个批量计划文件是一个Raphael SVG，所以一旦代码被加载，它就会在页面上呈现svg。加载这个文件也让我能够访问“lotInfo”对象，它有一些配置的东西。

我一直试图用getScript调用该文件并将其存储在一个变量中，并检查该变量是否已设置，但我无法从该文件访问js，基本上，svg没有渲染。

我对这一切都错了吗？任何人都可以提供任何见解吗？请询问您是否需要更多信息/代码，我很乐意提供。

来源

2014-02-12 Shan Robertson

您有兴趣首先通过XMLHttpRequest加载svg为XML吗？ –

Juat柜面你要考虑按照上述我的评论XMLHTTPRequest的 ..

，您可以接收可以用来填补innerHTML的一个事业部的网页上的XML字符串。和/或您可以将元素作为XML节点使用，然后将它们克隆到本地SVG中。

var XMLdoc 
function loadSVGasXML() 
{ 
    var SVGFile="yourSVGFile.svg" 
    var loadXML = new XMLHttpRequest; 
    function handler() 
    { 
     if(loadXML.readyState == 4) 
     { 
      if (loadXML.status == 200) //---loaded ok--- 
      { 
       //---responseText--- 
       var xmlString=loadXML.responseText 
       //---mySVGDIV.innerHTML=xmlString 
       //---DOMParser--- 
       var parser = new DOMParser(); 
       XMLdoc=parser.parseFromString(xmlString,"text/xml").documentElement ; 
      } 
     } 
    } 
    if (loadXML != null) 
    { 
     loadXML.open("GET", SVGFile, true); 
     loadXML.onreadystatechange = handler; 
     loadXML.send(); 
    } 
}

来源

2014-02-13 03:48:32

在JavaScript变量中存储raphael svg

回答

相关问题