score:0
Accepted answer
when you console log '$("#mychart").get(0)' this will return you undefined, because on rendered your get(0) is not initialized, for prevent this you have to add a callback when you initialized you chart. so your get(0) will be initialized first then you can create your chats.
'$("#mychart").get(0)' is not a reative thing so your view will be not re-initialized.
here is the working code:
function drawchart() {
var oldcount = 2;
var newcount = 4;
var data = [{
value: newcount,
color: "#e53935",
highlight: "#c62828",
label: "new"
}, {
value: oldcount,
color: "#3949ab",
highlight: "#1a237e",
label: "regular"
}];
var pieoptions = {
animation: false,
}
// added a callback here.
settimeout( function(){
if ($("#mychart").get(0)) {
var ctx = $("#mychart").get(0).getcontext("2d");
var mynewchart = new chart(ctx);
console.log(mynewchart);
new chart(ctx).pie(data, pieoptions);
}
})
}
Source: stackoverflow.com
Related Query
- My chart is not shown on browser screen using chart.js in meteor
- I am using chart js to draw a chart. I did everything right but i don't know why the x axis and y axis label is not comming in chart. code below
- Edge browser does not render chart using chart js
- Uncaught TypeError: Chart is not a constructor when using Chart.js
- Chart.js Chart in Angular does not load until resizing browser window
- Chart JS chart not rendering in ArcGIS popup when using navigation arrows
- Bar Chart Not Stacking When Using ChartJs
- Why is this bar chart using chart.js not rendering in react.js?
- chart looking strange on phone´s browser using chart.js
- Chart.js in Angular 10: Specified colors not shown in multi-series bar chart (instead random colors)
- Chart won't draw. Returning a string value not a Number value - Meteor - Chartjs
- Bar Chart not displaying when using chart.js
- ChartJS Bar Chart not respecting disabled legend when using cdn
- Trying to create a custom tooltip in a doughnut chart using chartsjs, but it is not working
- Not able to remove legent from Radar Chart in chart.js even using legent: {display : false}
- The chart is not getting shown when page is loaded
- how to draw Line chart using chart.js and datalabels should be shown
- Pie Chart using chart.js not showing up but bar charts are?
- Chart.js returns a console error and does not display the chart when using variables as data input
- Background color does not work when trying to create my data before using scatter chart with chart.js
- Chart.js - Line chart does not render all points when using Point[] format
- Chart.js with line chart and bar chart - bar chart not rendered although the max value of it is shown
- updating chartjs pie chart by using .keypress() not working
- null values for instead of date causes the browser to crash while using chart js
- Pie chart not working using angular and ng2-charts
- How to run Chart.js samples using source code
- Chart JS: Donut/Doughnut Chart: Tooltip to be shown always for all the data. All tooltip is not shown when multiple data are with 0 data
- How to implement scattered chart using chart.js which is not available by default?
- how to not repeat code while creating multiple charts in chart js
- Chart js pie chart not showing dynamic data using JSON
More Query from same tag
- re-creating an animated graph in javascript with charts.js
- Formatting Data With Charts.JS
- chart.js not getting linked with online database and php
- I am having this error in charts v3 chartjs-chart-treemap: fontColor does not exist in type 'ChartDataset<"treemap", TreemapDataPoint[]>
- Add value to horizontal bar in chart.js
- How to include adapters and plugins with ChartJS
- How to make a line dashed or dotted in chartJS?
- Chart.js place y value position and its x-label position relative to the x-value
- ng2-charts angular radar exception
- How to reorganize data to display how many times a string appears in an array object?
- How to add an extra tick on top of the highest bar in Chart.js v2.9.4 (grace)?
- ChartJS, Primeng, Gap first and end of line chart
- Problems with max and min value of Chart.js [line chart]
- Passing Json using JsonResult not working properly
- Chartjs removing labels and begin number
- how to show several labels and data's in the chart.js similar to npmtrend website?
- Why chartJs throws length of undefined although everything seems correct
- How to loop inside javascript using php variable
- How to display multiple y axis titles on seperate lines and rotated 90 degrees clockwise in chart.js
- ChartJS Draw grid line X-Axis and Y-Axis
- Problem adding name to X-axis for a chart
- Chart.js aspect ratio / forced height
- Chartjs: Overwrite plot y-axis integer labels to some string value
- Combine chart.js bar and line charts with differing granularity
- ChartJS - would like to create a mixed chart with horizontal Bar and a dot to represent the answer from the current user
- Canvas displays initially in Chrome but not in Firefox
- Cannot get react-chartjs options to take effect
- display various chart value and tool tip
- Using chart js version 3, how to add custom data to external tooltip?
- How do I import a csv into chart.js?