How to use an imported SVG with r2d3?

General
, ,
1

I'm struggling to get r2d3 to display a custom SVG.

I am trying to translate work by a friend who used used the following to
display the SVG in Python:

displayHTML(f"""
<!DOCTYPE html>
<meta charset="utf-8">
<head>
<script src="https://d3js.org/d3.v6.min.js"></script>
<style>
{styleScr}
</style>
</head>
<body>
{load_script}
{campus_map.read()}
{main_script}
</body>
</html>
""")

where load_script is JS that loads data, campus_map.read() inserts the SVG content, and the main_script is D3.

His main_script has

var mapSVG = d3.select('#svg24123');

Should I be doing something similar if I want to use r2d3? Below is my approach, which just outputs a blank white page in Viewer.

d3 <- "d3map/mymap.js"
css <- "d3map/style.css"
svg_path <- "d3map/campus_map.svg"
svg_content <- read_file(svg_path)
d3_content <- read_file(d3)

d3_script <- glue("
var svgContent = '{svg_content}';
var mapSVG = d3.select('body').append('svg');
mapSVG.html(svgContent);
{d3_content}
")

r2d3(data, script = d3_script, css = css, d3_version = "6")
2

This topic was automatically closed 21 days after the last reply. New replies are no longer allowed.

If you have a query related to it or one of the replies, start a new topic and refer back with a link.