score:0
i've found a solution to my problem. the issue was that i was trying to create some space between my datasets and my datas attribute y doesnt start and end at 0. therefor i added two extra datapoints in each dataset with a borderwidth of 3 and bordercolor that matches the backgroundcolor of the chart. each extra added datapoint will have a y with the value of 0. an example of adding a dataset to my chart is below.
chart.data.datasets.push({
fill: true,
backgroundcolor: gradient,
borderwidth: 3,
bordercolor: '#333',
data: [
{
x: startxvalue,
y: 0
},
{
x: startxvalue,
y: starty,
.. other attributes
},
{
x: newentryxend,
y: endy,
.. other attributes
},
{
x: newentryxend,
y : 0
}]
});
score:0
any reason why you can wanted to keep the same background colors for ,
why cant you try as below
fill: true,
backgroundcolor: 'red',
Source: stackoverflow.com
Related Query
- Draw borders on line chartjs
- How to draw Horizontal line on Bar Chart Chartjs
- How to draw multiple line on y axis for same x axis in chartjs v2?
- Do not draw line on condition in ChartJS line chart
- ChartJS Draw grid line X-Axis and Y-Axis
- Can't Draw Horizontal Line on Graph Using ChartJS Annotation Plugin and Primevue Chart
- Chartjs draw line chart where line go back and forth (by chronological order)
- Chartjs 3 how to draw a horizontal line starting at a specific yAxis value
- Draw stacked horizontal bar chart with Average line using ChartJS
- ChartJS Line Charts - remove color underneath lines
- Chartjs change grid line color
- Chartjs Tooltip Line Breaks
- Draw horizontal line on chart in chart.js on v2
- Dotted Line in ChartJS
- Chart.js - draw horizontal line
- ChartJS - Draw chart with label by month, data by day
- Display line chart with connected dots using chartJS
- Chartjs 2 - Stacked bar and unstacked line on same chart with same y axis
- show label in tooltip but not in x axis for chartjs line chart
- chartjs show dot point on hover over line chart
- How can I draw dotted line using chartjs?
- ChartJS Line Graph - Multiple Lines, Show one Value on Tooltip
- ChartJs line chart repaint glitch while hovering over
- How do I draw a vertical line on a horizontal bar chart with ChartJS?
- Chartjs Line Color Between Two Points
- How to render a vertical line on hover in chartjs
- Draw a horizontal and vertical line on mouse hover in chart js
- ChartJS - Line Chart with different size datasets
- ChartJS won't draw graph inside bootstrap tab until window resize
- Show data dynamically in line chart - ChartJS
More Query from same tag
- ChartJS align axis label to the top
- How to emit an event with vue-chartjs?
- Animated Word Web in Javascript
- How can I shade a portion of a ChartJS line grph=
- Django Chart.js ajax javascript "string data parsing error"
- React-chartjs-2 update height dynamically
- Drilldown on barchart using CHARTJS Devexpress
- Background color hides Y labels
- How to hide axis using Chartkick.js
- Adding a for loop/foreach loop for Charts.js
- Chartjs treemap example
- Chart.js - custom tooltip with multiple values
- Print multiple Primefaces Chart.js
- Creating chart.js chart directly to PNG in Node js?
- Chartjs - how to make line position to vertical center and how to display dotted sharp in the backround?
- Reading converted rss to json file with chart.js not working
- implementing horizontal bar chart
- Chart doesn't display fonts
- Using Chart.Js to plot a scatter plot from an Array
- New Chart.js Chart onclick
- getBoundingClientRect gives incorrect value
- X-axis multiple colored label for bar chart using chart.js
- Chart.js with handlebar.js shows empty canvas
- I need help on Optimization of Laravel Controller
- how can I add a django array element into a js array using an if condition
- How to use chartjs-plugin-datalabels for specific charts using vue-chart.js
- Set fix values on y-axis vue-chartjs
- Chart.js ignoring fill to start
- ChartJS 3+ x-axis only showing full moment object instead of just month
- How to make dynamic chart js using JSON in Codeigniter?