Standalone script generates SVG

poptimal.js

@@ -2,17 +2,20 @@
 
 
 
-import * as jsdom from "jsdom";
+import jsdom from "jsdom";
+import * as d3 from "d3";
 
 const { JSDOM } = jsdom;
 
+const xmlns = "http://www.w3.org/2000/xmlns/";
+const xlinkns = "http://www.w3.org/1999/xlink";
+const svgns = "http://www.w3.org/2000/svg";
 
-const document = new JSDOM().window.document;
+const window = new JSDOM().window;
 
+const document = window.document;
 
 
-import * as d3 from "d3";
-
 import {RADIUS_OPTS, DotMaker} from './src/components/dots.js';
 //import {PALETTES, DotControls} from './src/components/controls.js';
 
@@ -24,11 +27,29 @@ const HEIGHT = WIDTH;
 
 
 
-//d3.select(document.body).append("div");
 
 function poptimal() {
+	const container = d3.select(document.body).append("div");
 
-	const svg = d3.create("svg")
+	const dm = new DotMaker(WIDTH);
+
+	const m1 = 2;
+	const m2 = 3;
+	const n1 = 4;
+	const n2 = 5;
+	const bg = "#ffffff";
+	const fg1 = "#ff0000";
+	const fg2 = "#000000";
+	const f1 = "in";
+	const f2 = "noise";
+	const r1 = 0.5;
+	const r2 = 0.19;
+
+	const dots1 = dm.dots(1 / m1, n1);
+	const dots2 = dm.dots(1 / m2, n2);
+
+
+	const svg = container.append("svg")
 	  .attr("width", WIDTH * CELL * MAG)
 	  .attr("height", HEIGHT * CELL * MAG)
 	  .attr("viewBox", [ 0, 0, WIDTH, HEIGHT ]);
@@ -61,8 +82,15 @@ function poptimal() {
 	  .attr("fill", fg2)
 	  .attr("cx", (d) => d.x)
 	  .attr("cy", (d) => d.y);
+  
+	const node = svg.node();
 
-	console.log(svg);
+  	node.setAttributeNS(xmlns, "xmlns", svgns);
+  	node.setAttributeNS(xmlns, "xmlns:xlink", xlinkns);
+  	const serializer = new window.XMLSerializer;
+  	console.log(serializer.serializeToString(node));
+
+//	console.log(download_as_svg(svg));
 }
 
 poptimal();

src/components/download.js

@@ -61,7 +61,6 @@ export function svg_to_string(svg) {
 
 
 export function download_as_svg(svg) {
-  console.log("HEY download_as_svg");
   const str = svg_to_string(svg);
   return new Blob([str], {type: "image/svg+xml"})
 }