![](/img/trans.png)
[英]Javascript and chart.js, how to add euro currency to y label
[英]Chart.js - How to Add Text in the label of the Chart with JavaScript?
我不知道如何在 Chart JavaScript 的標簽中添加文本。 我的圖表在 PC 和平板電腦上使用。
現在圖表
但是我需要標記響應區域,如下所示:
<canvas id="myChart" width="500" height="400"></canvas>
==== 我的代碼(在 1 個標簽數據中 12 個月 - 10 年 = 1 x 條)
var color = Chart.helpers.color;
var barChartData = {
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
datasets: [{
type: 'bar',
label: '<?php echo $year9+543; ?>',
fill: false,
borderColor: "rgba(235,189,139,1)",
data: <? php echo $data_target9_month; ?>
}, ... Array data ...
編輯圖表
window.onload = function () {
var ctx = document.getElementById('canvas').getContext('2d');
window.myBar = new Chart(ctx, {
type: 'bar',
data: barChartData,
options: {
elements: {
line: {
tension: 0
}
},
tooltips: {
mode: 'index',
intersect: false,
callbacks: {
label: function (tooltipItem, data) {
var value = data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index];
if (parseInt(value) >= 1000) {
return data.datasets[tooltipItem.datasetIndex].label + " : " + '$' + value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
if (parseInt(value) == 0) {
return data.datasets[tooltipItem.datasetIndex].label + " : " + 'ไม่มีข้อมูล';
}
else {
return data.datasets[tooltipItem.datasetIndex].label + " : " + '$' + value;
}
}
} // end callbacks:
}
}
})
謝謝。
這肯定可以使用 Chart.JS 方法實現,但最好和最簡單的方法是使用position: absolute;
簡單地重疊要添加的文本position: absolute;
在每個文本框上。
看看這個 JSFiddle: https ://jsfiddle.net/gxjw5hLb/
當然,您需要計算並替換每個“X”的值,
<td><span>X=1000</span></td>
<td><span>X=2500</span></td>
<td><span>X=3000</span></td>
盒子也需要一些額外的 CSS 樣式。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.