jingrow/charts
1
0
Fork 0
Code Pull Requests Activity

Fixes issue if yAxis returns different lengths

Browse Source
This commit is contained in:
Kaleb White 2021-11-15 14:34:21 -08:00
parent b4f3e77acb
commit c8727014c6
3 changed files with 70 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
docs/assets/js/frappe-charts.min.js vendored
View File

@ -4141,7 +4141,7 @@ var AxisChart = function (_BaseChart) {
this.config.yAxisMode = yAxis ? yAxis.yAxisMode : axisOptions.yAxisMode || 'span';
// if we have yAxis config settings lets populate a yAxis config array.
if (yAxis.id && yAxis.position) {
if (yAxis && yAxis.id && yAxis.position) {
this.config.yAxisConfig = [yAxis];
}
}
@ -4214,7 +4214,9 @@ var AxisChart = function (_BaseChart) {
zeroLine = void 0,
positions = void 0,
yAxisConfigObject = void 0,
yAxisAlignment = void 0;
yAxisAlignment = void 0,
yKeys = void 0;
yKeys = [];
yAxisConfigObject = this.config.yAxisMode || {};
yAxisAlignment = yAxisConfigObject.position ? yAxisConfigObject.position : 'left';
@ -4251,11 +4253,17 @@ var AxisChart = function (_BaseChart) {
positions = yPts.map(function (d) {
return zeroLine - d * scaleMultiplier;
});
yKeys.push(key);
if (_this2.state.yAxis.length > 1) {
var yPtsArray = [];
var firstArr = _this2.state.yAxis[0];
// we need to calculate the scaleMultiplier.
// now that we have an accurate scaleMultiplier we can
// we need to loop through original positions.
scaleMultiplier = _this2.height / getValueRange(yPts);
firstArr.positions.forEach(function (pos) {
yPtsArray.push(Math.ceil(pos / scaleMultiplier));
});
@ -4278,6 +4286,30 @@ var AxisChart = function (_BaseChart) {
for (var key in dataValues) {
_loop(key);
}
// the labels are not aligned in length between the two yAxis objects,
// we need to run some new calculations.
if (this.state.yAxis[1] && this.state.yAxis[0].labels.length !== this.state.yAxis[1].labels.length) {
var newYptsArr = [];
// find the shorter array
var shortest = this.state.yAxis.reduce(function (p, c) {
return p.length > c.labels.length ? c : p;
}, { length: Infinity });
// return the longest
var longest = this.state.yAxis.reduce(function (p, c) {
return p.length < c.labels.length ? p : c;
}, { length: Infinity });
// we now need to populate the shortest obj with the new scale multiplier
// with the positions of the longest obj.
longest.positions.forEach(function (pos) {
// calculate a new yPts
newYptsArr.push(Math.ceil(pos / shortest.scaleMultiplier));
});
shortest.labels = newYptsArr.reverse();
shortest.positions = longest.positions;
}
}
// Dependent if above changes

2
docs/assets/js/frappe-charts.min.js.map
View File

File diff suppressed because one or more lines are too long

37
src/js/charts/AxisChart.js
View File

@ -54,7 +54,7 @@ export default class AxisChart extends BaseChart {
this.config.yAxisMode = yAxis ? yAxis.yAxisMode : axisOptions.yAxisMode || 'span';
// if we have yAxis config settings lets populate a yAxis config array.
if (yAxis.id && yAxis.position) {
if (yAxis && yAxis.id && yAxis.position) {
this.config.yAxisConfig = [yAxis]
}
}
@ -107,7 +107,8 @@ export default class AxisChart extends BaseChart {
calcYAxisParameters(dataValues, withMinimum = 'false') {
let yPts, scaleMultiplier, intervalHeight, zeroLine, positions, yAxisConfigObject, yAxisAlignment;
let yPts, scaleMultiplier, intervalHeight, zeroLine, positions, yAxisConfigObject, yAxisAlignment, yKeys;
yKeys = [];
yAxisConfigObject = this.config.yAxisMode || {};
yAxisAlignment = yAxisConfigObject.position ? yAxisConfigObject.position : 'left';
@ -137,11 +138,17 @@ export default class AxisChart extends BaseChart {
intervalHeight = getIntervalSize(yPts) * scaleMultiplier;
zeroLine = this.height - getZeroIndex(yPts) * intervalHeight;
positions = yPts.map((d) => zeroLine - d * scaleMultiplier);
yKeys.push(key);
if (this.state.yAxis.length > 1) {
const yPtsArray = [];
const firstArr = this.state.yAxis[0];
// we need to calculate the scaleMultiplier.
// now that we have an accurate scaleMultiplier we can
// we need to loop through original positions.
scaleMultiplier = this.height / getValueRange(yPts);
firstArr.positions.forEach((pos) => {
yPtsArray.push(Math.ceil(pos / scaleMultiplier));
});
@ -160,6 +167,32 @@ export default class AxisChart extends BaseChart {
positions
});
}
// the labels are not aligned in length between the two yAxis objects,
// we need to run some new calculations.
if (this.state.yAxis[1] && this.state.yAxis[0].labels.length !== this.state.yAxis[1].labels.length) {
const newYptsArr = [];
// find the shorter array
const shortest = this.state.yAxis.reduce((p,c) => {
return p.length > c.labels.length ? c : p;
},
{ length: Infinity });
// return the longest
const longest = this.state.yAxis.reduce((p,c) => {
return p.length < c.labels.length ? p : c;
},
{ length: Infinity });
// we now need to populate the shortest obj with the new scale multiplier
// with the positions of the longest obj.
longest.positions.forEach((pos) => {
// calculate a new yPts
newYptsArr.push(Math.ceil(pos / shortest.scaleMultiplier));
});
shortest.labels = newYptsArr.reverse();
shortest.positions = longest.positions;
}
}
// Dependent if above changes