Skip to content

gramener/gramex-chartbase

Repository files navigation

@gramex/chartbase

Base utilities for charts

Example

import { layer, getSVG } from "https://cdn.jsdelivr.net/npm/@gramex/chartbase@1";
// Create a new g.layer under <svg id="chart-svg"> ONLY IF it does not exist
layer(d3.select("svg#chart-svg"), "g", "layer");
// Get the viewBox width and height of <svg id="chart-svg">
const { width, height } = getSVG("svg#chart-svg");

Installation

Add this to your script:

import { layer, getSVG } from "@gramex/chartbase";

To use via CDN, add this to your HTML file:

<script type="importmap">
  {
    "imports": {
      "@gramex/chartbase": "https://cdn.jsdelivr.net/npm/@gramex/chartbase@1/dist/chartbase.js"
    }
  }
</script>

To use locally, install via npm:

npm install @gramex/chartbase

... and add this to your HTML file:

<script type="importmap">
  {
    "imports": {
      "@gramex/chartbase": "./node_modules/@gramex/chartbase/dist/chartbase.js"
    }
  }
</script>

API

See API documentation

Release notes

  • 1.0.4: 28 Oct 2024. Deploy at gramex-chartbase.straive.app ensure https://cdn.jsdelivr.net/npm/@gramex/chartbase@1 works
  • 1.0.3: 18 Aug 2024. Security update
  • 1.0.2: 24 Nov 2023. Fix getSVG() width and height calculation
  • 1.0.0: 31 Oct 2023. Initial release

Authors

Anand S s.anand@gramener.com

License

MIT