Загрузить диаграммы d3 по щелчку в sapui5

Question

Я создал диаграмму venn, используя d3 в Sapui5. Примечание: я создал круги внутри тега и внутри тега, я использовал тег для стилизации круга.

Теперь у меня есть кнопка, когда я нажимаю кнопку, svg может быть понижен и может быть просмотрен.

Стили не показаны.

Я делаю так OnClick

d3.select("#save").on("click", function(){ 
    var html = d3.select("svg") 
     .attr("version", 1.1) 
     .attr("xmlns", "http://www.w3.org/2000/svg") 
     .node().parentNode.innerHTML; 

    console.log(html); 
    //var imgsrc = 'data:image/svg+xml;base64,'+ btoa(html); 
    //var img = '<img src="'+imgsrc+'">'; 
    //d3.select("#svgdataurl").html(img); 

}); 

может ли один помочь мне решить эту проблему.

Answer 1

Стили не отображаются, потому что они не включены в ваш документ SVG. В вашем SVG может быть тэг <style> (см. MDN).

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

Answer 2

Ничего общего с sapui5. вы можете добавить стиль к svg что-то похожее на это .attr("fill", "red"); or .style("fill","red"). Существует гораздо больше, чтобы посмотреть на this.