0
Chart.js 2データセットがTOPの近くにある場合、データセットをバーにどのように配置しますか?
このグラフでは、Chart.js v2.1.4を使用して作業しています。オーバーフローする上位データは、それ自体を調整し、垂直バーの内側に移動する必要があります。したがって、特定のデータセットが最大値に近い場合、データセットは垂直バーの内側にある必要があります。誰か助けてください。
animation: {
duration: 500,
easing: "easeOutQuart",
onComplete: function() {
var ctx = this.chart.ctx;
ctx.font =Chart.helpers.fontString(Chart.defaults.global.defaultFontFamily, 'normal', Chart.defaults.global.defaultFontFamily);
ctx.textAlign = 'center';
ctx.textBaseline = 'bottom';
this.data.datasets.filter(dataset =>
!dataset._meta[Object.keys(dataset._meta)[0]].hidden).forEach(function
(dataset) {
for (var i = 0; i < dataset.data.length; i++) {
var model = dataset._meta[Object.keys(dataset._meta)[0]].data[i]._model, scale_max = dataset._meta[Object.keys(dataset._meta[0]].data[i]._yScale.maxHeight;
ctx.fillStyle = '#000';
var y_pos = model.y - 5;
// Make sure data value does not get overflown and hidden
// when the bar's value is too close to max value of scale
// Note: The y value is reverse, it counts from top down
if ((scale_max - model.y)/scale_max >= 0.80)
y_pos = model.y + 20;
console.log(y_pos);
verticalLabel(ctx, model, addCommas(dataset.data[i]), 50, 20, 4, y_pos);
}
});
}
}
これはverticalLabel機能である:
function verticalLabel(ctx, data, dataToSplit, topOffset, spaceBetween, commaGap, why_pos) {
var i = 0, prev = 0;
console.log(data.y - spaceBetween * i - topOffset/why_pos);
for (x of dataToSplit.toString().split("").reverse()) {
if (x.indexOf(",") > -1) {
ctx.fillText(x, data.x + commaGap, prev - topOffset/why_pos);
} else {
ctx.fillText(x, data.x, data.y - spaceBetween * i - topOffset/why_pos);
i++;
}
var prev = data.y - spaceBetween * i;
}
}
私はそれを得た。ははは。 verticalLabelの下で編集済み ** var prev = why_pos - spaceBetween * i; –