DEV Community

Discussion on: Creating stunning charts with Vue.js and Chart.js

Collapse
l_alcubo profile image
Luis

Hello friends I have a problem with the code, it works perfect, the problem is that once I paint everything, I return and sending other values paints them with the current value, perfect, but if I place the cursor on the line it overlaps with The old value

codepen.io/lalcubo/pen/VWrJwG

sorry for my english and for my code, but i dont know use good the site codepen.io for work the code please download the code and create the file .html and file .js and the library vue and vue-chart thanks

Collapse
apertureless profile image
Jakub Juszczak Author

Hey,

for a working codepen, you need to include vue-chartjs from the cdn

https://cdnjs.cloudflare.com/ajax/libs/vue-chartjs/2.6.5/vue-chartjs.full.min.js

To work with "live" data, you will need to inlcude the reactiveProp Mixin or reactiveData Mixin, depending on if you're passing your chartdata as a prop to your component or you're using a local data model.

Check out the docs: vue-chartjs.org/#/home?id=reactive...

Collapse
l_alcubo profile image
Luis

I got my code to work finally on the website codepen: codepen.io/lalcubo/pen/VWrJwG

My problem its the following:
When i press the button it graphs correctly, and you can see it draws a dot (caption) with it's value.
If you press the button again, it graphs perfectly again with a random value,
if you mouseover the new value(dot) show the current value, but if you mouseover the cursor over the previous value(dot) it will show the old value(dot) overlaping it.
I need to show only the current value, not the previous ones.

thanks