Usage

Include the dynamic vector graphic library in your html page:

<script src="https://unpkg.com/dynamic-vector-graphics/dist/dvg.min.js"></script>

Either create the graphic by providing an existing svg element from the DOM:

const elem = document.getElementById('mysvg')
const graphic = new dvg.DVG(elem)

Or provide a container element and provide a URL to the svg file to load:

const elem = document.getElementById('container')
const graphic = new dvg.DVG(elem, { svg: './graphic.svg' })

Use the update()method to pass data to the graphic as desired. Can be a CSV string:

graphic.update(csv)

Or can be a data structure:

graphic.update({
  values: [
    ['A', 'B', 'C'],
    [1, 2, 3],
  ],
  columns: ['Character', 'Number'],
})

See the examples page for demonstrations of various ways to instatiate dynamic graphics and apply data.