chore: clean deprecated
This commit is contained in:
Arjun Choudhary
parent
f2262fac43
commit
a04dd7f433
@ -1,6 +1,5 @@
|
|||||||
import "../css/charts.scss";
|
import "../css/charts.scss";
|
||||||
|
|
||||||
// import MultiAxisChart from './charts/MultiAxisChart';
|
|
||||||
import PercentageChart from "./charts/PercentageChart";
|
import PercentageChart from "./charts/PercentageChart";
|
||||||
import PieChart from "./charts/PieChart";
|
import PieChart from "./charts/PieChart";
|
||||||
import Heatmap from "./charts/Heatmap";
|
import Heatmap from "./charts/Heatmap";
|
||||||
@ -10,7 +9,6 @@ import DonutChart from "./charts/DonutChart";
|
|||||||
const chartTypes = {
|
const chartTypes = {
|
||||||
bar: AxisChart,
|
bar: AxisChart,
|
||||||
line: AxisChart,
|
line: AxisChart,
|
||||||
// multiaxis: MultiAxisChart,
|
|
||||||
percentage: PercentageChart,
|
percentage: PercentageChart,
|
||||||
heatmap: Heatmap,
|
heatmap: Heatmap,
|
||||||
pie: PieChart,
|
pie: PieChart,
|
||||||
|
|||||||
@ -1,183 +0,0 @@
|
|||||||
import AxisChart from "./AxisChart";
|
|
||||||
import { Y_AXIS_MARGIN } from "../utils/constants";
|
|
||||||
// import { ChartComponent } from '../objects/ChartComponents';
|
|
||||||
import { floatTwo } from "../utils/helpers";
|
|
||||||
|
|
||||||
export default class MultiAxisChart extends AxisChart {
|
|
||||||
constructor(args) {
|
|
||||||
super(args);
|
|
||||||
// this.unitType = args.unitType || 'line';
|
|
||||||
// this.setup();
|
|
||||||
}
|
|
||||||
|
|
||||||
preSetup() {
|
|
||||||
this.type = "multiaxis";
|
|
||||||
}
|
|
||||||
|
|
||||||
setMeasures() {
|
|
||||||
super.setMeasures();
|
|
||||||
let noOfLeftAxes = this.data.datasets.filter(
|
|
||||||
(d) => d.axisPosition === "left"
|
|
||||||
).length;
|
|
||||||
this.measures.margins.left = noOfLeftAxes * Y_AXIS_MARGIN || Y_AXIS_MARGIN;
|
|
||||||
this.measures.margins.right =
|
|
||||||
(this.data.datasets.length - noOfLeftAxes) * Y_AXIS_MARGIN ||
|
|
||||||
Y_AXIS_MARGIN;
|
|
||||||
}
|
|
||||||
|
|
||||||
prepareYAxis() {}
|
|
||||||
|
|
||||||
prepareData(data) {
|
|
||||||
super.prepareData(data);
|
|
||||||
let sets = this.state.datasets;
|
|
||||||
// let axesLeft = sets.filter(d => d.axisPosition === 'left');
|
|
||||||
// let axesRight = sets.filter(d => d.axisPosition === 'right');
|
|
||||||
// let axesNone = sets.filter(d => !d.axisPosition ||
|
|
||||||
// !['left', 'right'].includes(d.axisPosition));
|
|
||||||
|
|
||||||
let leftCount = 0,
|
|
||||||
rightCount = 0;
|
|
||||||
|
|
||||||
sets.forEach((d, i) => {
|
|
||||||
d.yAxis = {
|
|
||||||
position: d.axisPosition,
|
|
||||||
index: d.axisPosition === "left" ? leftCount++ : rightCount++,
|
|
||||||
};
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
configure(args) {
|
|
||||||
super.configure(args);
|
|
||||||
this.config.xAxisMode = args.xAxisMode || "tick";
|
|
||||||
this.config.yAxisMode = args.yAxisMode || "span";
|
|
||||||
}
|
|
||||||
|
|
||||||
// setUnitWidthAndXOffset() {
|
|
||||||
// this.state.unitWidth = this.width/(this.state.datasetLength);
|
|
||||||
// this.state.xOffset = this.state.unitWidth/2;
|
|
||||||
// }
|
|
||||||
|
|
||||||
configUnits() {
|
|
||||||
this.unitArgs = {
|
|
||||||
type: "bar",
|
|
||||||
args: {
|
|
||||||
spaceWidth: this.state.unitWidth / 2,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
setYAxis() {
|
|
||||||
this.state.datasets.map((d) => {
|
|
||||||
this.calcYAxisParameters(d.yAxis, d.values, this.unitType === "line");
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
calcYUnits() {
|
|
||||||
this.state.datasets.map((d) => {
|
|
||||||
d.positions = d.values.map((val) =>
|
|
||||||
floatTwo(d.yAxis.zeroLine - val * d.yAxis.scaleMultiplier)
|
|
||||||
);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// TODO: function doesn't exist, handle with components
|
|
||||||
renderConstants() {
|
|
||||||
this.state.datasets.map((d) => {
|
|
||||||
let guidePos =
|
|
||||||
d.yAxis.position === "left"
|
|
||||||
? -1 * d.yAxis.index * Y_AXIS_MARGIN
|
|
||||||
: this.width + d.yAxis.index * Y_AXIS_MARGIN;
|
|
||||||
this.renderer.xLine(guidePos, "", {
|
|
||||||
pos: "top",
|
|
||||||
mode: "span",
|
|
||||||
stroke: this.colors[i],
|
|
||||||
className: "y-axis-guide",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
getYAxesComponents() {
|
|
||||||
return this.data.datasets.map((e, i) => {
|
|
||||||
return new ChartComponent({
|
|
||||||
layerClass: "y axis y-axis-" + i,
|
|
||||||
make: () => {
|
|
||||||
let yAxis = this.state.datasets[i].yAxis;
|
|
||||||
this.renderer.setZeroline(yAxis.zeroline);
|
|
||||||
let options = {
|
|
||||||
pos: yAxis.position,
|
|
||||||
mode: "tick",
|
|
||||||
offset: yAxis.index * Y_AXIS_MARGIN,
|
|
||||||
stroke: this.colors[i],
|
|
||||||
};
|
|
||||||
|
|
||||||
return yAxis.positions.map((position, j) =>
|
|
||||||
this.renderer.yLine(position, yAxis.labels[j], options)
|
|
||||||
);
|
|
||||||
},
|
|
||||||
animate: () => {},
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// TODO remove renderer zeroline from above and below
|
|
||||||
getChartComponents() {
|
|
||||||
return this.data.datasets.map((d, index) => {
|
|
||||||
return new ChartComponent({
|
|
||||||
layerClass: "dataset-units dataset-" + index,
|
|
||||||
make: () => {
|
|
||||||
let d = this.state.datasets[index];
|
|
||||||
let unitType = this.unitArgs;
|
|
||||||
|
|
||||||
// the only difference, should be tied to datasets or default
|
|
||||||
this.renderer.setZeroline(d.yAxis.zeroLine);
|
|
||||||
|
|
||||||
return d.positions.map((y, j) => {
|
|
||||||
return this.renderer[unitType.type](
|
|
||||||
this.state.xAxisPositions[j],
|
|
||||||
y,
|
|
||||||
unitType.args,
|
|
||||||
this.colors[index],
|
|
||||||
j,
|
|
||||||
index,
|
|
||||||
this.state.datasetLength
|
|
||||||
);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
animate: (svgUnits) => {
|
|
||||||
let d = this.state.datasets[index];
|
|
||||||
let unitType = this.unitArgs.type;
|
|
||||||
|
|
||||||
// have been updated in axis render;
|
|
||||||
let newX = this.state.xAxisPositions;
|
|
||||||
let newY = this.state.datasets[index].positions;
|
|
||||||
|
|
||||||
let lastUnit = svgUnits[svgUnits.length - 1];
|
|
||||||
let parentNode = lastUnit.parentNode;
|
|
||||||
|
|
||||||
if (this.oldState.xExtra > 0) {
|
|
||||||
for (var i = 0; i < this.oldState.xExtra; i++) {
|
|
||||||
let unit = lastUnit.cloneNode(true);
|
|
||||||
parentNode.appendChild(unit);
|
|
||||||
svgUnits.push(unit);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
this.renderer.setZeroline(d.yAxis.zeroLine);
|
|
||||||
|
|
||||||
svgUnits.map((unit, i) => {
|
|
||||||
if (newX[i] === undefined || newY[i] === undefined) return;
|
|
||||||
this.elementsToAnimate.push(
|
|
||||||
this.renderer["animate" + unitType](
|
|
||||||
unit, // unit, with info to replace where it came from in the data
|
|
||||||
newX[i],
|
|
||||||
newY[i],
|
|
||||||
index,
|
|
||||||
this.state.noOfDatasets
|
|
||||||
)
|
|
||||||
);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Loading…
x
Reference in New Issue
Block a user