Продвинуть строку SVG в Dom?

Question

Продвинуть строку SVG в Dom?

У меня есть переменная JavaScript, которая в основном похожа на это:

my_svg_image = '<circle cx="227.58331298828125" cy="102" r="3" style="fill:black;stroke-width:0" />';

Это было загружено из моей базы данных. Существует ли способ, которым я могу проанализировать ту строку и добавить его к DOM с JavaScript? Я имею настроенный svgweb, но не вижу, как я могу заставить его анализировать эту строку. Есть ли другие библиотеки, которые могли бы помочь?

5

javascript svg

задан Colin 15 June 2010 в 07:35

1 ответ

Другие вопросы по тегам:

javascript svg

Похожие вопросы:

score 3 · Answer 1

пробовали ли вы свойство javascript innerHTML ?

редактировать: вы можете использовать свойство innerHTML только для элементов html, поэтому вы можете использовать строку, содержащую все изображение svg, чтобы добавить его к элементу html. Но вы не можете добавить элемент svg к существующему элементу svg.

Пример:

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN"
"http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg">
   <head>
      <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
   <script type="text/javascript">
   <![CDATA[    
    function test() {
        var newsvg = document.getElementById("svg-wrapper");
        var svgstr = '<svg:svg height="300" width="700" id="svg-container"><svg:circle cx="150px" cy="100px" r="30px" /></svg:svg>';
        newsvg.innerHTML = svgstr;
    }   
   ]]>
   </script>
   <title>SVG DOM</title>
 </head>
 <body>
    <div id="svg-wrapper"></div>
    <input type="button" onclick="javascript:test();" value="generate svg"/><br/>
 </body>
 </html>

Если вы хотите добавить круг к существующему встроенному SVG, вы должны добавить его, используя методы DOM (и, возможно, сначала проанализируйте вашу строку, чтобы извлечь необходимые значения атрибутов).