svg = {
const svg = html`<svg id = "svg"></svg>`
const container = d3.select(svg)
const outer = d3.select(svg).append("g").attr("transform","translate(200,200)")
const inner = outer.append("g").attr("transform","rotate(15) scale(0.75)")
inner.append("circle")
.attr("r",150)
.attr("cx",0)
.attr("cy",50)
.attr("fill","white")
.attr("stroke","black")
inner.append("line")
.attr("stroke","black")
.attr("x1",-30)
.attr("x2",10)
.attr("y1",50)
inner.append("line")
.attr("stroke","black")
.attr("x1",30)
.attr("x2",-10)
.attr("y1",50)
inner.append("line")
.attr("stroke","black")
.attr("y1",0)
.attr("y2",50)
inner.append("line")
.attr("stroke","red")
.attr("x1",-50, "y1",25)
.attr("x2",50,"y2",50)
.attr("y1",100)
.attr("y2",100)
inner.append("circle")
.attr("r",30)
.attr("stroke","black")
.attr("fill","cornflowerblue")
.attr("cx",-100)
inner.append("circle")
.attr("r",30)
.attr("stroke","black")
.attr("fill","cornflowerblue")
.attr("cx",100)
const pathData = d3.line().x(d => d.x).y(d => d.y).curve(d3.curveNatural)(data)
container.append("path")
.attr("stroke","black")
.attr("fill","none")
.attr("d",pathData)
return svg
}