Почему .html() не работает с SVG-селекторами с помощью jquery?

Вопрос может кто-нибудь сказать мне, как я могу преобразовать свой SVG-элемент в строку?

Я использую canvg, чтобы преобразовать SVG в изображение.

он сначала должен быть рендерингом в холсте, метод canvg() ожидает SVG STRING

код:

function updateChartImage(){
 canvg(document.getElementById('canvas'),expecting ` svg string`);
 var canvas = document.getElementById("canvas") ; 
 var img = canvas.toDataURL("image/png");
 img = img.replace('data:image/png;base64,', '');
 $("#hfChartImg").val(img) ;
 $('#img').attr({ src: img });
 }

Я пробовал

$('#container svg').html() ; // it gives me an error 
//Uncaught TypeError: Cannot call method 'replace' of undefined

обратите внимание, что

$('#container svg') 
 $('#container').html() // both works fine and

UpDATE

Я использую highcharts, у меня есть функция getSVG(), которую я могу передать в canvg(), но проблема в том, что он не получает последние обновления, поэтому я должен сделать это таким образом, при запуске getSVG(), я получаю следующее:

ССЫЛКА

2 ответа

Насколько я могу вспомнить jQuery .html() использует innerHTML, который предназначен для html, а не svg. SVG - это документы xml, поэтому вы можете использовать XMLSerializer()

var svg = document.getElementById('svg_root'); // or whatever you call it
var serializer = new XMLSerializer();
var str = serializer.serializeToString(svg);


Для проблемы вы не получаете свой svg-контент, Если на странице находится только одна диаграмма svg, используйте:

$('svg').html();

и если это больше, чем сейчас, посмотрите, есть ли div из highcharts_container, потому что они создают эти svg-диаграммы. Если вы их используете. Затем используйте:

$('id of that div').html();

licensed under cc by-sa 3.0 with attribution.