Uses class

This commit is contained in:
Roman Galochkin 2020-02-18 14:33:32 +03:00
parent 6b3d2f0c8b
commit 77c1dada2f

View File

@ -171,34 +171,30 @@ class Chartigo {
this.dataPoints = [this.getDatapoints('primary')]; this.dataPoints = [this.getDatapoints('primary')];
// Scales. // Scales.
let xScale;
const xMin = d3.min(attrs.data.primary.xs); const xMin = d3.min(attrs.data.primary.xs);
const xMax = d3.max(attrs.data.primary.xs); const xMax = d3.max(attrs.data.primary.xs);
if (attrs.scale === 'linear') { if (attrs.scale === 'linear') {
xScale = d3.scaleLinear() this.xScale = d3.scaleLinear()
.domain([ .domain([
attrs.minX || xMin, attrs.minX || xMin,
attrs.maxX || xMax attrs.maxX || xMax
]) ])
.range([0, calc.chartWidth]); .range([0, calc.chartWidth]);
} else { } else {
xScale = d3.scaleLog() this.xScale = d3.scaleLog()
.base(attrs.logBase) .base(attrs.logBase)
.domain([attrs.minX, attrs.maxX]) .domain([attrs.minX, attrs.maxX])
.range([0, calc.chartWidth]); .range([0, calc.chartWidth]);
} }
this.xScale = xScale;
const yMin = d3.min(attrs.data.primary.ys); const yMin = d3.min(attrs.data.primary.ys);
const yMax = d3.max(attrs.data.primary.ys); const yMax = d3.max(attrs.data.primary.ys);
const yScale = d3.scaleLinear() this.yScale = d3.scaleLinear()
.domain([yMin, yMax]) .domain([yMin, yMax])
.range([calc.chartHeight, 0]); .range([calc.chartHeight, 0]);
const xDateScale3 = d3.scaleLinear() const xDateScale3 = d3.scaleLinear()
.domain([new Date(2012, 0, 1), new Date(2020, 0, 31)]) .domain([new Date(2012, 0, 1), new Date(2020, 0, 31)])
.range([0, calc.chartWidth]); .range([0, calc.chartWidth]);
@ -211,22 +207,12 @@ class Chartigo {
// Line generator. // Line generator.
const line = d3.line() const line = d3.line()
.x(function (d, i) { .x(d => this.xScale(d.x))
console.log("d", d, "i", i); .y(d => this.yScale(d.y));
return xScale(d.x);
})
.y(function (d, i) {
console.log("d", d, "i", i);
return yScale(d.y);
});
const area = d3.area() const area = d3.area()
.x(function (d) { .x(d => this.xScale(d.x))
return xScale(d.x); .y1(d => this.yScale(d.y))
})
.y1(function (d) {
return yScale(d.y);
})
.y0(calc.chartHeight); .y0(calc.chartHeight);
// Add svg. // Add svg.