Usage with optional chart types

[Daan Roet]

Hi, first of all thanks for this handy wrapper. Very neat that it also works with Vue 2.

Would it be possible to add support for wrapping optional chart types outside of chartjs core, for example the matrix type for heatmaps?

[Victor Garcia]

Hi @DRoet !

Never used chartjs plugins but I will look at it! Do you mean type wise (ts types) or runtime wise?
Can you give me more info on how you would use it with vue-chart-3? :)

[Daan Roet]

I meant runtime, in a perfect world I would like to do something like:

register the chart:

import { MatrixController, MatrixElement } from 'chartjs-chart-matrix';

Chart.register(MatrixController, MatrixElement)

and inside my component:

import { Matrix } from 'vue-chart-3'

....
   components: {
      Matrix,
   }
...

maybe it could work by providing access to the defineChartComponent() method so I can create the Matrix component myself?

import { defineChartComponent } from 'vue-chart-3'

....
   components: {
      Matrix: defineChartComponent('matrix-chart','matrix'),
   }
...

[Victor Garcia]

Yeah I think exporting defineChartComponent is best for both types on runtime!

[Victor Garcia]

For types I base my arguments on Chart.js ChartTypeRegistry, I think adding shims for declaring it is mandatory

[Victor Garcia]

@DRoet Looks like you're lucky and your plugin already provides it's own types augmentations :D
https://github.com/kurkle/chartjs-chart-matrix/blob/21562afa31f823fe6e48199f3d9054674a58a6aa/types/index.esm.d.ts#L27

[Victor Garcia]

It's released on 0.1.5, tell me if it fits you :)

[Daan Roet]

Would you mind also exposing it as an named export?

right now this doesn't work:

import { defineChartComponent } from 'vue-chart-3'

however using a quick test with

import vueChart from 'vue-chart-3'
vueChart.defineChartComponent()

it seems to render the matrix correctly! 🚀

[Victor Garcia]

Hmm strange! Have you tried to reload vsCode? I will look at it tomorrow i'm not on my laptop now :(

[Daan Roet]

no worries, seems like you only added it as an export default: https://github.com/victorgarciaesgi/vue-chart-3/blob/main/src/index.ts#L21

[Victor Garcia]

@DRoet Should be fixed now!

[Daan Roet]

@victorgarciaesgi awesome, would you mind publishing another release onto NPM?

[Daan Roet]

thanks!