将Raphael SVG存储在JavaScript变量中

Question

I've got an interactive SVG that needs to be drawn in multiple different places on my site. Currently I can do this by running this on each page.

$.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');

});

But as you can see, this will call the lot-plan.js file each time. I've been trying to figure out a way to call it once, and store it's data in a var to reuse. This lot-plan file is a Raphael SVG, so once the code is loaded, it renders the svg on the page. Loading this file also gives me access to the "lotInfo" object, which has some config stuff in it.

I've been trying to call the file with getScript and store it in a variable, and check if that variable is set, but I'm unable to access the js from the file, basically, the svg doesn't render.

Am I going about this all wrong? Can anybody provide any insights into this? Please ask if you need any more info / code, i'll be happy to provide.

Answer 1

Juat incase you want to consider XMLHTTPRequest per my comment above..

You can receive an xml string that can be used to fill innerHTML for a Div on your web page. And/Or you can work with the elements as XML nodes then clone them into your local 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();
    }
}