0

Make sure the svg is an external file for object tag to reference. For some reason I am not able to get the "Layer_1" by id. I can get the svgElem and svgDoc , but not "Layer_1" by its id within the svg file.

(function($) {
  $(window).load(function() {
    var svgElem = document.getElementById("test-svg"); //returns value
    alert("svgElem=" + svgElem); //returns value

    var svgDoc = svgElem.contentDocument;
    alert("svgDoc = " + svgDoc); //returns value when svg external file

    var layer1 = svgDoc.getElementById("Layer_1");
    alert("layer1 = " + layer1); //returns null* This is my problem.
  });
})(jQuery);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Title of the document</title>
</head>

<body>

  <div id="container">

    <div id="container2">
      <object id="test-svg" type="image/svg+xml" data="svg-layer-test.svg">

        <!-- PLEASE MAKE THIS SVG AN EXTERNAL DOCUMENT and name file 'svg-layer-test.svg'-->


        <!--<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 91.333 70.667" enable-background="new 0 0 91.333 70.667" xml:space="preserve">
    <g id="Layer_1">
     <text transform="matrix(1 0 0 1 -4.333 68.6665)" font-family="'TimesNewRomanPS-BoldMT'" font-size="100" id="first_date">13</text>
    </g>
    <g id="Layer_2">
     <text transform="matrix(1 0 0 1 -4.333 68.6665)" font-family="'TimesNewRomanPS-BoldMT'" font-size="100">15</text>
    </g>
   </svg>-->



      </object>
    </div>
  </div>
</body>

</html>
John Stafford
  • 565
  • 2
  • 9
  • 29
  • Do you *have* to use an `` tag? I see you're using ` ` so I would think that you could get away with just using an `` tag. – zero298 Oct 05 '15 at 17:51
  • Possible duplicate of [How to access SVG elements with Javascript](http://stackoverflow.com/questions/2753732/how-to-access-svg-elements-with-javascript) – Paul LeBeau Oct 06 '15 at 03:48
  • @zero298. My html has quite a bit in it already. I was hoping to external reference if possible. Last resort is going to inline svg tag. – John Stafford Oct 06 '15 at 12:44

0 Answers0