Usage no npm install needed!

<script type="module">
  import d3Gems from 'https://cdn.skypack.dev/d3-gems';
</script>

README

d3-gems

Collection of reusable widgets powered by d3.js

JavaScript Example

Sample code below shows how to render chart.

// first write/generate chart definition
var column_chart = {
    type: "column",
    axes: {
        x: {majorTicks: "outside"},
        y: {
            majorTicks: "outside",
            scalar: true,
            margin: true,
            grid: { major: true, minor: false }
        }
    },
    categories: ["A", "B", "A"],
    series: {
        Revenue: [90, 70, 95],
        Units: [30, 25, 27]
    },
    title: {
        text: "Test Chart",
        position: "center"
    },
    legend: {
        position: "topright"
    }
};

// then render chart
$(function(){
    $('.chart')
        .data('chart', column_chart)
        .chart();
});