score:0
try removing <script></script>
tag either from base.html
or api_chart.html
before and after jquery block.
and also import chart.js and define id = "mychart"
before using new chart
.
<h1>hello world</h1>
<canvas id="mychart" width="400" height="400"></canvas>
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
{% block jquery %}
<script>
var ctx = document.getelementbyid('mychart')
var mychart = new chart(ctx, {
type: 'bar',
data: {
labels: ['red', 'blue', 'yellow', 'green', 'purple', 'orange'],
datasets: [{
label: '# of votes',
data: [12, 19, 3, 5, 2, 3],
backgroundcolor: [
.....
{% endblock %}
Source: stackoverflow.com
Related Query
- Django + Chart.js Am I Doing This Right? Nothing is being rendered
- How to print a chart rendered by code
- (Chart.js) Is there a way to compare one chart with another so as not to have this inconsistent effect of small values being as big as big values?
- How do I destroy/update Chart Data in this chart.js code example?
- 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
- How to prevent first/last bars from being cut off in a chart with time scale
- Show X axis on top and bottom in line chart rendered with Chart.js 2.4.0
- Obtain max value of y axis of line chart rendered with Chart.js
- Line chart is not being displayed in Chart.js
- Callback after line chart rendered
- How to add comma in this chart js
- Pie chart is not getting rendered in ChartJS
- Primevue Chart not rendered
- ChartJS: Remove padding to the right of chart caused by tick labels
- Draw a horizontal bar chart from right to left
- chart.js v 2.0.1 line, scatter chart pointRadius bug or I'm doing it wrong
- Remove additional white space on left and right side of Angular Chart
- I am using chartjs node canvas to render a chart however the graph options are being ignored
- Detect onHover being complete on a Chart.js doughnut chart
- Labels (category type) on left and right of bar chart using chart.js?
- How to stop axis label from being cut off in chart JS?
- Chart JS, ng2-Charts - How to make the label to the right of pie chart instead on top?
- Why is this bar chart using chart.js not rendering in react.js?
- Chart.js Polar Area Chart is not scale right
- Problems hovering over ChartJS bar chart after being redrawn
- Chart.js v3 - beginAtZero does nothing to my chart
- No rendered annotation line on Line Chart
- Legend isnt moving to the right on my doughnut chart created with chart.js
- pie chart not rendered properly in flask app
- Chart does not display on webpage in Django app (with Chart.js)
More Query from same tag
- How can I show percentages when hovering over my chart?
- Passing the same props while rendering different elements conditionally in React.js
- Determining which chart the user has clicked on
- ChartJS xAxis time formats don't change for days
- chart.js v2 setting the y scale options seem to getting ignored
- How to add labels on top of the chart bar with Chart.js 2
- Chartjs showing labels for bidimensional array
- Limit labesl on chart.js bar chart
- Receiving json data from a server to display a chart.js graph not working
- chart.js: set specific numbers in y-axis
- django chart.js - Query to get count of all distinct values for particular column
- Chart.js Time series - x axis that change depending on timestamp
- Show center tick value radar chart- Chart.js
- Passing data from Python to JavaScript to plot Chart.js
- How to make Chart JS ignore the scale between DatasSets
- Different color for each bar in a bar graph in ChartJS and VueJS
- mongoose.Schema for IoT Data Array and fetch the data to chart.js
- ChartJS Line Chart - Points Connected out of order for Timeseries in Angular 6
- Difference between DXTREME and PhoneGap
- How to set equal width between ticks - chartjs
- Add codeigniter php data to Chart js
- How to fill my chart (chart.js) with my own data from API
- Error with Chart.js : TypeError: t is undefined
- Chart.js How to change y axis title position
- Is it possible to make chartjs charts scrollable?
- How to iterate over array elements inside objects in javascript
- How to json_encode associative php array to [{x: key1, y: value1}, {x: key2, y: value2}, ...]?
- Chart.js won't display percentage label when value is above 1000?
- generator-angular-fullstack cannot add angular-chart.js
- Chart JS Legend Styling