我有這張圖，對于不存在的資料，它會顯示“未定義%”。
如果資料不存在，我怎樣才能擺脫“未定義的%”并在圖表中不顯示任何內容？
下面是代碼：
import { Bar } from "react-chartjs-2";
import "chartjs-plugin-datalabels";
import { Chart } from "chart.js";
import ChartDataLabels from "chartjs-plugin-datalabels";
Chart.register(ChartDataLabels);
<Bar
data={{
labels,
datasets: //datasets here
}}
options={{
scales: {
y: {
min: 0,
max: 100,
ticks: {
stepSize: 20,
callback: function (value) {
return ((value / this.max) * 100).toFixed(0) "%";
},
},
},
},
plugins: {
tooltip: {
callbacks: {
label: function (context) {
var label = context.dataset.label || "";
if (context.parsed.y !== null) {
label = " " context.parsed.y "%";
}
return label;
},
},
},
datalabels: {
formatter: (val, context) => `${val}%`,
}, // for the label percentage symbol inside the graph
},
}}
/>
uj5u.com熱心網友回復：
您可以使用 if 陳述句檢查 val 是否存在
datalabels: {
formatter: (val, context) => {
if(val) return `${val}%`
return;
},
}, //
uj5u.com熱心網友回復：
如果您只想在未定義（或任何虛假陳述句）的情況下顯示 0，您可以使用||運算子。
datalabels: {
formatter: (val, context) => `${val || 0}%`,
}
uj5u.com熱心網友回復：
問題似乎出在這一行：return ((value / this.max) * 100).toFixed(0) "%";
里面有東西，大概value是undefined這樣。例如，您可以有條件地不顯示任何內容return value ? ((value / this.max) * 100).toFixed(0) "%" : null;
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/356484.html