remove default white background

Author: mbostock

docs/.vitepress/theme/custom.css

@@ -23,11 +23,6 @@
   color: var(--vp-c-text-2);
 }
 
-.vp-doc .plot,
-.vp-doc .plot-ramp {
-  background: none;
-}
-
 :root.dark marker[stroke="white"] {
   stroke: var(--vp-c-bg);
 }

docs/features/plots.md

@@ -40,7 +40,6 @@ export function legendRamp(color, options) {
       svg.append("style").text(
         `.${className}-ramp {
   display: block;
-  background: white;
   height: auto;
   height: intrinsic;
   max-width: 100%;

src/legends/ramp.js

@@ -77,27 +77,26 @@ export interface PlotOptions extends ScaleDefaults {
   /**
    * Custom styles to override Plot’s defaults. Styles may be specified either
    * as a string of inline styles (*e.g.*, `"color: red;"`, in the same fashion
-   * as assigning
-   * [*element*.style](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style))
-   * or an object of properties (*e.g.*, `{color: "red"}`, in the same fashion
-   * as assigning [*element*.style
-   * properties](https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration)).
-   * Note that unitless numbers ([quirky
-   * lengths](https://www.w3.org/TR/css-values-4/#deprecated-quirky-length))
-   * such as `{padding: 20}` may not supported by some browsers; you should
-   * instead specify a string with units such as `{padding: "20px"}`. By
-   * default, the returned plot has a white background, a max-width of 100%, and
-   * the system-ui font. Plot’s marks and axes default to
-   * [currentColor](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentcolor_keyword),
-   * meaning that they will inherit the surrounding content’s color. For
-   * example, a dark theme:
+   * as assigning [*element*.style](1)) or an object of properties (*e.g.*,
+   * `{color: "red"}`, in the same fashion as assigning [*element*.style
+   * properties](2)). Note that unitless numbers ([quirky lengths](3)) such as
+   * `{padding: 20}` may not supported by some browsers; you should instead
+   * specify a string with units such as `{padding: "20px"}`. By default, the
+   * returned plot has a max-width of 100%, and the system-ui font. Plot’s marks
+   * and axes default to [currentColor](4), meaning that they will inherit the
+   * surrounding content’s color. For example, a dark theme:
    *
    * ```js
    * Plot.plot({
    *   style: "background: black; color: white;",
    *   marks: …
    * })
    * ```
+   *
+   * [1]: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style
+   * [2]: https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration
+   * [3]: https://www.w3.org/TR/css-values-4/#deprecated-quirky-length
+   * [4]: https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentcolor_keyword
    */
   style?: string | Partial<CSSStyleDeclaration> | null;
 

src/plot.d.ts

@@ -220,7 +220,6 @@ export function plot(options = {}) {
       svg.append("style").text(
         `.${className} {
   display: block;
-  background: white;
   height: auto;
   height: intrinsic;
   max-width: 100%;

src/plot.js

@@ -49,7 +49,6 @@
     <style>
       .plot {
         display: block;
-        background: white;
         height: auto;
         height: intrinsic;
         max-width: 100%;

test/output/aaplBollinger.svg

@@ -49,7 +49,6 @@
     <style>
       .plot {
         display: block;
-        background: white;
         height: auto;
         height: intrinsic;
         max-width: 100%;