Skip to main content
Stack Overflow for Teams is now Stack Internal: See how we’re powering the human intelligence layer of enterprise AI. Read more >
Filter by
Sorted by
Tagged with
0 votes
1 answer
81 views

I am using the ChartJS library with a Vue Chart wrapper library. Playground/Demo My current issue is, when you open the playground, you can see the date labels on the X axis sort of "overflow&...
Young Royal's user avatar
0 votes
2 answers
73 views

I'm using ChartJS with Vue: "chart.js": "^4.4.9", "vue": "^3.5.13", "vue-chartjs": "^5.3.2", My line chart has data where the x values ...
Colin's user avatar
  • 2,249
1 vote
1 answer
144 views

in chart js (4.4.8) i want to give discrete line colors based on a baseline and threshold value of the data point. when i give line segment colors it appies color to whole line segment and looks ...
nkd's user avatar
  • 25
0 votes
0 answers
57 views

I'm trying to draw some mixed graphs (Histogram and lines) on a one page HTML integrating Vue and Vuetify. Apprently only vuechartJS as a package that could be integrated with I managed to extends ...
Vaquez Vincent's user avatar
0 votes
0 answers
96 views

I'm trying to use vue-chartjs but I'm having issues with the dependent chart.js installation. Error: ERROR in ./node_modules/vue-chartjs/dist/index.js 1:0-190 Module not found: Error: Package path ./...
Gerrit's user avatar
  • 1
0 votes
0 answers
98 views

This is my chart component and I want to handle events on labels I define in data. I would like to show the tooltip with bar data when I hover on a label. <template> <Bar :data="data&...
Chiara Ani's user avatar
  • 1,135
0 votes
1 answer
107 views

I am trying to use response data from my api call to populate a Pie Chart from Chart.js. The issue is that the UI does not update after the response data is assigned to the chartData object. These are ...
Gary O'Connor's user avatar
1 vote
0 answers
67 views

I created a BarChart using vue-chartjs and have marked the threshold values using arrows Here's the code <template> <Bar :data="data" :options="options" /> </...
Divya Bharathi's user avatar
1 vote
1 answer
139 views

I'm learning to use https://www.npmjs.com/package/vue-chartjs I'm trying to create a bar chart with y-axis scale ranging from -20 to 70. I'm unable to see the bars in the negative range. I tried using ...
Divya Bharathi's user avatar
1 vote
1 answer
93 views

Making a scatter plot with vue-chartjs <Scatter> was perfect: Now the user asks for the same chart but with points connected. So I tried to change <Scatter> to <Line>. But the ...
SiliconValley's user avatar
0 votes
1 answer
122 views

I have this following Prototype created by our Designer using Figma. My stack is: Vuejs Bootstrap ChartJS So my questions is can we add this custom border on certain segment on click? Goals: Add &...
sluxzer's user avatar
  • 31
-1 votes
1 answer
215 views

I need to create a chart looking like the image above, but I have no idea how. The data needs to be dynamic and it would great to also include some animation when the chart is loaded. My tech stack ...
Kris D. J.'s user avatar
0 votes
1 answer
147 views

I need a horizontal dashed line, no y-axis ticks, hidden x-axis grid lines, and centered x-axis ticks for my bar chart. Solution required in vue-chartjs. Chartjs installed package: "chart.js"...
hemant rao's user avatar
  • 3,333
0 votes
0 answers
151 views

I want to create a chart using WebSocket to display real-time information in Vue using vue-chartjs and chart.js. The issue is that for some reason, the data is not displaying. The array of numbers ...
Pato P's user avatar
  • 73
2 votes
0 answers
218 views

Here is my Vue3 project issue, I use chart.js package "chartjs-chart-treemap" to draw As you can see in the picture, there is a gray text that should not appear. My chart.js version is &...
samhuang95's user avatar
0 votes
0 answers
107 views

function addChart(key, colors) { const chartData = getChartData(currentYear.value, key); const chart = { chart: null, data: chartData, colors: colors, key: key }; charts....
dreanor's user avatar
  • 75
1 vote
0 answers
158 views

I am using Chart.js to create a Doughnut chart with Vue.js, and I want to customize the legend items when they are clicked. Specifically, I want to change the color and add a line-through style to the ...
pedro maximo's user avatar
0 votes
0 answers
172 views

I'm using chart.js (or more specifically vue-chartjs) for a component I want to use on a dashboard page. The user is supposed to be able to add new charts to the component using the dashboard. Since ...
dreanor's user avatar
  • 75
1 vote
1 answer
395 views

I'm using vue-chartjs to display a line chart, and right now I'm customizing the appearance. I'm finding that certain attributes to style the Tooltip are not working. I'm currently trying the ...
Andrew's user avatar
  • 23
0 votes
0 answers
243 views

I just started using ChartJS and VueChartJS and begin with a simple bar chart. The problem is that the scales in chartOptions do not affect the UI.I used ChartJS 4.4.2 and VueChartJS 5.3.1. Here's my ...
Lucia's user avatar
  • 69
0 votes
0 answers
255 views

I am having trouble configuring chartjs-plugin-annotation. I have it setup as a dependency in my vue project as well as chart.js Versions: "chart.js": "^4.4.2", "chartjs-...
Parham Alijani's user avatar
1 vote
1 answer
155 views

I try to use unplugin-vue-components to automatically import Vue components from vue-chartjs, but I don't know how. I found this in unplugin-vue-components documentation: You can also write your own ...
hf-xz's user avatar
  • 13
0 votes
1 answer
268 views

I got this error trying to use vue-chartjs LineChart in Vue 3. <template> <va-modal blur size="large" v-model="showCountryModal" no-padding> <template #content=...
Amode Habeeb Damilare's user avatar
0 votes
1 answer
153 views

I don't know how to change the color of the axis. Maybe someone of you had a similar problem. The graph looks like the one in the picture. I don't know if this is a result of the fact that my graph is ...
Ketrabkox's user avatar
0 votes
1 answer
131 views

I have used vue js and vue chart js latest version until now. I tried drawing a Bar graph and edited the main.js file as follows import { BarElement, CategoryScale, Chart as ChartJS, Legend, ...
Kepler452B's user avatar
0 votes
1 answer
191 views

I'm building a budget app with quasar. I'm trying to update the bar value of a chartjs BarChart with a q-slider. But the bar isn't updating when I submit the value. The 'income.value' gives me the ...
Christoph Pfrommer's user avatar
0 votes
1 answer
543 views

I am using vue-chartjs in my Vue2 application. https://vue-chartjs.org/ I want to create a gauge chart and tried using chartjs-gauge library. https://www.npmjs.com/package/chartjs-gauge But I can't ...
Kostadin Terziev's user avatar
0 votes
1 answer
171 views

New to vue and vue-chart, I'm trying to have 2 pies on a page where the undelying query is a parameter (prop) This my main vue <template> <div> <div class="container&...
Francois's user avatar
  • 136
0 votes
0 answers
144 views

I have a multiline line chart, works nicely, I have a graph title, axis titles, different colors for each line, legend. What I cannot get working is having a different point style, marker, for each ...
Ken's user avatar
  • 43
1 vote
1 answer
471 views

As most advice, I've read from the forums is to use computed or props when trying to pass a reactive value on Chart data. I have done that but the issue is the chart does not even display. <script ...
Shulz's user avatar
  • 634
1 vote
1 answer
411 views

I have an application which has other pages working and I am trying to add a page with a chart. To try it out I made changes to include the packages "dependencies": { "@aws-amplify/ui-...
krisrr3's user avatar
  • 97
0 votes
1 answer
440 views

I have a problem with vue 3 vue-chartjs not updating the data when I add a new dataset. Basically the data is not reactive. If I add a new hardcoded object with datasets it works, but not when its ...
ukw's user avatar
  • 300
1 vote
0 answers
232 views

I am creating a component ScatterChart.vue within my Nuxt 3 or Vue 3 application and I am sending value to it from the parent component based on which I want the line graph to be drawn. Currently, I ...
BATMAN_2008's user avatar
  • 3,642
2 votes
0 answers
128 views

I'm expecting the result I get in Google chrome than Mozilla firefox, but in Mozilla firefox after using the quick-pivot library is painted differently in Mozilla firefox due to to mixing the ...
tsiPlus's user avatar
  • 433
0 votes
1 answer
891 views

I have been working with vue3 for some months now, and for a new project want to use chart.js - so I found vue-chartjs which I thought would help. The sample shown in the link is written in the '...
quilkin's user avatar
  • 1,499
1 vote
1 answer
314 views

I got this exception when using Line component. With Bar it works. core.typedRegistry.js:38 Uncaught Error: class does not have id: [object Object] at TypedRegistry.register (core.typedRegistry.js:...
Jean François Manatane's user avatar
0 votes
1 answer
1k views

I use this doughnut chart from chartjs in vue using vue-chartjs. By default the doughnut chart when there are no data or all values are empty it show nothing. Is there a way to show doughnut chart ...
Vishal Sagar's user avatar
0 votes
1 answer
308 views

I'm trying to make a chart in Vue.js but I'm getting this error all the time: Uncaught (in promise) TypeError: this.renderChart is not a function Here is my code: <template> <div> &...
Corboss's user avatar
  • 31
2 votes
0 answers
179 views

The vue-chartjs Line chart wants a type of ChartData<"line",(number | Point | null)[],unknown> as data. In native chartjs you are supposed to adjust the type. (ChartData <'bar', {...
Toaster2-0's user avatar
0 votes
0 answers
101 views

I am working on a chart that should display a graphic with bars and lines. I want to show the number on the chart, but i can't make it. The console gives me this error: Cannot read properties of ...
Corboss's user avatar
  • 31
0 votes
0 answers
66 views

I'm trying to find out what I'm doing wrong. Watcher not firing when childProps is changed. I look at Vue devtools show that object is changing. But when I do a console.log it doesn't show that it's ...
Eric Evans's user avatar
0 votes
1 answer
250 views

Using Vue-chart-js in the below line graph I need a line when there is only one data point, i used beginAtZero: true,, but still no luck. dates in x axis and count in y axis with a single data point
massu1000's user avatar
  • 239
1 vote
1 answer
354 views

Rendering a chart with multiple y axes will display both datasets on the larger scale. I'm trying multiple ways in the chart options to tell the second y axis to use another scale. Expected behavior ...
samiam's user avatar
  • 27
1 vote
0 answers
157 views

I want to align my labels (sunday,monday ect....) center in the grey background, how can I do that in chartJS ? I would need something like padding top but I cant see it in documentation. My code: ...
Paulina Mi's user avatar
0 votes
1 answer
206 views

I have a Vue project with following packages installed. ├── [email protected] ├── [email protected] ├── [email protected] ├── [email protected] └── [email protected] I created a "LineChart.vue" ...
Forrest Hong's user avatar
1 vote
0 answers
739 views

I'm using vue-chartjs, which is recommended in the integration part of the Chart.js documentation. I want to ask that how to setup the dashed grid line like this. I try with options = { scales:...
Tuong Van's user avatar
1 vote
0 answers
77 views

Using vue-chartjs my chart doesnt get rendered. I have the following JSON structure coming from my API: [{"source_ip":"xxx","event_count":203},{"source_ip":&...
FedericoGabusi's user avatar
1 vote
2 answers
2k views

I use chart.js and vue-chartjs I need make fill (start) with gradient: linear-gradient(180deg, #7F56D9 0%, rgba(127, 86, 217, 0) 95.55%); like this image My config const chartData = { labels: ['2022-...
Oleksandr's user avatar
0 votes
0 answers
298 views

VueJS Barchart refuses to update on data change I tried to force the changes using this.$refs.bar.chart.update() after adding the ref to my bar component. Yet the function didn't seem to be recognized ...
Ghost's user avatar
  • 13
0 votes
1 answer
310 views

I've got vue chartjs setup and I want to format label/show 95.7% instead of raw 0.957 as in the screenshot. Same setup I try here works for Line chart, but can't make it work in PolarArea. "...
Jarek Tkaczyk's user avatar

1
2 3 4 5
9