Add initial svg rendering and test

src/marks/image.js

@@ -33,13 +33,18 @@ function isPath(string) {
 function isUrl(string) {
  return /^(blob|data|file|http|https):/i.test(string);
 }
-
 // Disambiguates a constant src definition from a channel. A path or URL string
 // is assumed to be a constant; any other string is assumed to be a field name.
 function maybePathChannel(value) {
  return typeof value === "string" && (isPath(value) || isUrl(value)) ? [undefined, value] : [value, undefined];
 }
 
+// Returns the encoded outerHTML of an svg (with the appropriate namespace)
+function getSvgString(svg) {
+ svg.setAttribute("xmlns", "http:https://www.w3.org/2000/svg");
+ return `data:image/svg+xml;utf8,${svg.outerHTML}`;
+}
+
 export class Image extends Mark {
  constructor(data, options = {}) {
  let {x, y, r, width, height, rotate, src, preserveAspectRatio, crossOrigin, frameAnchor, imageRendering} = options;
@@ -98,7 +103,7 @@ export class Image extends Mark {
  // TODO: combine x, y, rotate and transform-origin into a single transform
  .attr("transform", A ? (i) => `rotate(${A[i]})` : rotate ? `rotate(${rotate})` : null)
  .attr("transform-origin", A || rotate ? template`${X ? (i) => X[i] : cx}px ${Y ? (i) => Y[i] : cy}px` : null)
- .call(applyAttr, "href", S ? (i) => S[i] : this.src)
+ .call(applyAttr, "href", S ? (i) => (S[i] instanceof SVGAElement ? getSvgString(S[i]) : S[i]) : this.src)
  .call(applyAttr, "preserveAspectRatio", this.preserveAspectRatio)
  .call(applyAttr, "crossorigin", this.crossOrigin)
  .call(applyAttr, "image-rendering", this.imageRendering)

test/plots/index.ts

@@ -121,6 +121,7 @@ export * from "./high-cardinality-ordinal.js";
 export * from "./href-fill.js";
 export * from "./ibm-trading.js";
 export * from "./identity-scale.js";
+export * from "./image-render-svgs.js";
 export * from "./image-rendering.js";
 export * from "./industry-unemployment-share.js";
 export * from "./industry-unemployment-stream.js";