Vue-chartjs: Treemap

[alc32]

How to extend vue-chartjs to use Chart.js Treemap?

https://github.com/kurkle/chartjs-chart-treemap

[apertureless]

Hi @alc32

You could try the internal generateChart() helper.

👉 https://vue-chartjs.org/guide/#custom-new-charts

However, I never tried it.

// 1. Import Chart.js so you can use the global Chart object
import Chart from 'chart.js'
// 2. Import the `generateChart()` method to create the vue component.
import { generateChart } from 'vue-chartjs'

// 3. Import the treemap package (not sure what exports are in the package. You will need to look it up

import * from 'chartjs-chart-treemap'

// or

import 'chartjs-chart-treemap'


const TreeMap = generateChart('tree-map', 'treemap')

export default {
  extends: TreeMap,
  mounted () {
    // ....
  }
}

Not exactly sure if step 3 will work. But they define own controllers for the treemap

https://github.com/kurkle/chartjs-chart-treemap/blob/master/src/index.js#L7-L8

So they could be accessible then.