我有一个标签名称很长的条形图，它们显示正确。我决定在每个空格处剪切每个单词，将它们放在新的一行上。现在，图形显示标签的时间减少了一半。
const ctx = document.getElementById('mainChart');
_label = [ "JUMBO BAG RED RETROSPOT", "REGENCY CAKESTAND 3 TIER", "PARTY BUNTING", "WHITE HANGING HEART T-LIGHT HOLDER", "RECIPE BOX PANTRY YELLOW DESIGN", "SET OF 3 CAKE TINS PANTRY DESIGN ", "SMALL POPCORN HOLDER", "NATURAL SLATE HEART CHALKBOARD ", "LUNCH BAG BLACK SKULL.", "LUNCH BAG SUKI DESIGN " ]
_data = [0,1,2,3,4,5,6,7,8,9]
function barChart(_data, _label, title, graph) {
config_bar_chart = {
type: "bar",
data: {
labels: _label.map(x => { return x.split(" "); }), // _labels
datasets: [{
label: title,
data: _data,
}],
},
options: { scales: {y: {beginAtZero: true } }, },
}
new Chart(graph, config_bar_chart)
}
barChart(_data = _data, _label = _label, title="", graph=ctx)第一节第一节第一节第一节第一次
1条答案
按热度按时间ztigrdn81#
问题在于如何在图表配置中设置标签的格式。
.map()函数按空格拆分标签并将其作为字符串数组返回，chart无法将其正确解释为标签。您需要将拆分标签连接为单个字符串，并在它们之间使用换行符
(\n)。