#moon_vegalite

#Quick start

let spec : String =
  #|{
  #|  "data": {"values": [{"a": "A", "b": 28}, {"a": "B", "b": 55}, {"a": "C", "b": 43}]},
  #|  "mark": "bar",
  #|  "encoding": {
  #|    "x": {"field": "a", "type": "nominal"},
  #|    "y": {"field": "b", "type": "quantitative"}
  #|  }
  #|}

fn main {
  let svg = @moon_vegalite.render_svg(spec) catch {
    e => {
      println("error: " + e.message())   // names the JSON path of an unsupported feature
      return
    }
  }
  println(svg)
}

git clone https://github.com/sayoi7799/moon_vegalite
cd moon_vegalite/examples/hello
moon run cmd > bar.svg                     # open bar.svg in a browser

cd moon_vegalite
moon run cmd/vl2svg --target native -- examples/bar_basic.vl.json bar.svg   # SVG file (stdout without the second argument)
moon run cmd/vl2svg --target native -- --scene examples/bar_basic.vl.json   # scenegraph JSON, with the bounds of every item

let svg = @moon_vegalite.render_svg(spec_json)        // SVG document
let c = @moon_vegalite.compile(spec_json)             // scenegraph + view metadata
let scene = @moon_vegalite.scene_json(c)              // the scenegraph as JSON

#Installation

// moon.mod
import {
  "sayoi7799/moon_vegalite@0.2.0",
}

// moon.work, next to your moon.mod
members = [
  ".",
  "../moon_vegalite",   // the checkout
]

// your package's moon.pkg
import {
  "sayoi7799/moon_vegalite",
}

#Hand-drawn style

let svg = @moon_vegalite.render_svg_sketch(
  spec_json,
  options=@moon_vegalite.SketchOptions::new(seed=42, roughness=1.5, fill_style=CrossHatch),
)

vl2svg --sketch --seed 42 --roughness 1.5 spec.vl.json chart.svg      # also --decimals 2 for a smaller file

#Online demo

moon build --target js --release
node scripts/build_site.mjs && node scripts/serve_site.mjs     # http://localhost:8080/

#From a CSV file with MoonFrame

#Feeding errors back to a language model

#Side by side with the official output

#Positioning and differences from other charting libraries

• It follows Vega-Lite, not a new grammar. The goal is the same picture the reference implementation draws (vega-lite 5.23.0 + vega 5.33.1), not a similar one: axis ticks, label formats, legends, layout and mark bounds are ported from vega-lite / vega, including their JavaScript number and text-measurement quirks.
• Scenegraph first. Like Vega, the library produces a tree of marks and items with computed bounds. SVG is one renderer of that tree; other backends can consume it. Most MoonBit charting code draws directly; here the intermediate form is public.
• Specifications in, pictures out. Charts are data (JSON), so they can come from other tools. The test-suite feeds specs generated by MoonFrame (DataFrame → Vega-Lite) to the renderer.
• No browser, no JavaScript runtime. Rendering is a pure function, usable in a native CLI, in WebAssembly, or in JS.
• Honest about scope. It is a subset renderer. Anything outside the subset fails with an error that names the JSON path (encoding.color.condition 暂不支持) instead of drawing something different.

#Support

#Accuracy against the official implementation

#Fixture provenance and regeneration

cd scripts
npm ci
npm run fixtures            # downloads the example specs of the vega-lite tag, regenerates ../fixtures
npm run gallery             # regenerates ../gallery (needs: moon build --target native cmd/vl2svg)

#Performance

moon bench --release --target js -p sayoi7799/moon_vegalite/benchmarks        # also wasm-gc and native
moon build --target native cmd/vl2svg                                          # the identical-SVG check runs this binary
cd scripts && npm ci && npm run bench                                          # the vega side, with the identical-SVG check

• On the small chart, vega on Node is faster (5.9 ms against 8.6 to 9.5 ms for wasm-gc and js): a warmed-up JIT and no start-up work.
• On the 100,000-point scatter plot wasm-gc (0.68 s) and js (0.83 s) are as fast as vega on Node (0.88 s) end to end. Building the scenegraph is slower than vega's (0.28 to 0.32 s against 0.17 s); writing the SVG is faster (0.40 and 0.52 s against 0.71 s).
• native is the slowest, about twice as slow as wasm-gc and js on this allocation-heavy work. This was only measured, not investigated or optimised.

#Layout

#Development history

#License