4👍
You can add a text "N/A" instead "0" values in your data:
data: ["7", "25", "75", "78", "10", "N/A", "77", "02", "44", "N/A"]
this is the result: Image
here is an example: codepen example
- [Chartjs]-Chart.js Doughnut with rounded edges
- [Chartjs]-Dynamically created Chart.js chart overpopulating time based x-axis?
0👍
You can use the onAnimationComplete function to disable points and tooltip display
var ctx = document.getElementById("myChart").getContext("2d");
var myLineChart = new Chart(ctx).Line(data, {
animation: false,
onAnimationComplete: function () {
// prevents the update from triggering an infinite loop
if (!this.clearCycle) {
this.clearCycle = true;
this.datasets.forEach(function (dataset) {
dataset.points.forEach(function (point) {
if (point.value === 0) {
point.display = false;
point.hasValue = function () {
return false;
}
}
})
})
this.update();
}
else
delete this.clearCycle;
}
});
Fiddle – http://jsfiddle.net/u7dsy6ep/
If you are using animation, the logic needs to be moved to the onAnimationProgress and executed only once, unless you don’t mind seeing the dots while the animation is in progress.
- [Chartjs]-Creating dropdown options with Chart.js using select tag and multiple canvas
- [Chartjs]-Horizontal stacked bar chart with chart.js
0👍
I am not sure if it was possible with previous versions of Chart.js 2, for the tooltips just add this property to Chart object:
filter: x => return x.yLabel > 0
A simple one liner.
I know it’s old, but people might be still confused.
- [Chartjs]-Unable to draw method in Chart.js, v2 can't be found
- [Chartjs]-How do I get tool tips to work on 2 data set half doughnut chart?
0👍
To hide these values from your tooltip on your chart object, options -> plugins -> tooltip -> filter accepts a function that returns a boolean to render the tooltip.
filter: (e: TooltipItem<TType>, index: number, array: TooltipItem<TType>[], data: ChartData) => boolean;
TooltipItem has a raw
attribute which represents the data value.
in my case this is what my filter function looks like
filter: (label) => {
if (typeof (label.raw) === "number")
return label.raw > 0
else return true
}
- [Chartjs]-Chart.js Ionic 2 Angular2: Background color of bar graph not changing
- [Chartjs]-Bubble Chart in Chartjs not working