jingrow/charts
1
0
Fork 0
Code Pull Requests Activity

rename 'draw_area' functions as 'layers'

Browse Source
This commit is contained in:
pratu16x7 2017-11-26 15:59:15 +05:30
parent 617c0cb9de
commit 9cd91871d9
13 changed files with 93 additions and 119 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

101
dist/frappe-charts.esm.js vendored
View File

@ -1128,16 +1128,17 @@ class BaseChart {
} }
refresh(init=false) { refresh(init=false) {
// TODO: no init!
this.setup_base_values(); this.setup_base_values();
this.set_width(); this.set_width();
this.setup_container(); this.setup_container();
this.setup_components(); this.setupLayers();
this.setup_values(); this.setup_values();
this.setup_utils(); this.setup_utils();
this.make_graph_components(init); this.renderComponents(init);
this.make_tooltip(); this.make_tooltip();
if(this.summary.length > 0) { if(this.summary.length > 0) {
@ -1205,7 +1206,7 @@ class BaseChart {
); );
} }
setup_components() {} setupLayers() {}
setup_values() {} setup_values() {}
setup_utils() {} setup_utils() {}
@ -1272,7 +1273,7 @@ class BaseChart {
getDataPoint() {} getDataPoint() {}
updateCurrentDataPoint() {} updateCurrentDataPoint() {}
makeDrawAreaComponent(className, transform='') { makeLayer(className, transform='') {
return makeSVGGroup(this.draw_area, className, transform); return makeSVGGroup(this.draw_area, className, transform);
} }
} }
@ -1380,33 +1381,29 @@ class AxisChart extends BaseChart {
if(!this.oldYAnnotationPositions) this.oldYAnnotationPositions = this.yAnnotationPositions; if(!this.oldYAnnotationPositions) this.oldYAnnotationPositions = this.yAnnotationPositions;
} }
setup_components() { setupLayers() {
super.setup_components(); super.setupLayers();
this.setup_marker_components();
this.setup_aggregation_components();
this.setup_graph_components();
}
setup_marker_components() { // For markers
this.y_axis_group = this.makeDrawAreaComponent('y axis'); this.y_axis_group = this.makeLayer('y axis');
this.x_axis_group = this.makeDrawAreaComponent('x axis'); this.x_axis_group = this.makeLayer('x axis');
this.specific_y_group = this.makeDrawAreaComponent('specific axis'); this.specific_y_group = this.makeLayer('specific axis');
}
setup_aggregation_components() { // For Aggregation
this.sum_group = this.makeDrawAreaComponent('data-points'); // this.sumGroup = this.makeLayer('data-points');
this.average_group = this.makeDrawAreaComponent('chart-area'); // this.averageGroup = this.makeLayer('chart-area');
}
setup_graph_components() { this.setupPreUnitLayers && this.setupPreUnitLayers();
// For Graph points
this.svg_units_groups = []; this.svg_units_groups = [];
this.y.map((d, i) => { this.y.map((d, i) => {
this.svg_units_groups[i] = this.makeDrawAreaComponent( this.svg_units_groups[i] = this.makeLayer(
'data-points data-points-' + i); 'data-points data-points-' + i);
}); });
} }
make_graph_components(init=false) { renderComponents(init) {
this.makeYLines(this.yAxisPositions, this.yAxisLabels); this.makeYLines(this.yAxisPositions, this.yAxisLabels);
this.makeXLines(this.xPositions, this.xAxisLabels); this.makeXLines(this.xPositions, this.xAxisLabels);
this.draw_graph(init); this.draw_graph(init);
@ -1477,12 +1474,13 @@ class AxisChart extends BaseChart {
} }
draw_graph(init=false) { draw_graph(init=false) {
// TODO: NO INIT!
if(this.raw_chart_args.hasOwnProperty("init") && !this.raw_chart_args.init) { if(this.raw_chart_args.hasOwnProperty("init") && !this.raw_chart_args.init) {
this.y.map((d, i) => { this.y.map((d, i) => {
d.svg_units = []; d.svg_units = [];
this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]); this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]);
this.make_new_units(d); this.makeUnits(d);
this.calc_y_dependencies(); this.calcYDependencies();
}); });
return; return;
} }
@ -1493,7 +1491,7 @@ class AxisChart extends BaseChart {
this.y.map((d, i) => { this.y.map((d, i) => {
d.svg_units = []; d.svg_units = [];
this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]); this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]);
this.make_new_units(d); this.makeUnits(d);
}); });
} }
@ -1506,7 +1504,7 @@ class AxisChart extends BaseChart {
d.svg_units = []; d.svg_units = [];
this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]); this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]);
this.make_new_units(d); this.makeUnits(d);
}); });
setTimeout(() => { setTimeout(() => {
@ -1525,8 +1523,8 @@ class AxisChart extends BaseChart {
} }
} }
make_new_units(d) { makeUnits(d) {
this.make_new_units_for_dataset( this.makeDatasetUnits(
this.xPositions, this.xPositions,
d.yUnitPositions, d.yUnitPositions,
this.colors[d.index], this.colors[d.index],
@ -1535,7 +1533,7 @@ class AxisChart extends BaseChart {
); );
} }
make_new_units_for_dataset(x_values, y_values, color, dataset_index, makeDatasetUnits(x_values, y_values, color, dataset_index,
no_of_datasets, units_group, units_array, unit) { no_of_datasets, units_group, units_array, unit) {
if(!units_group) units_group = this.svg_units_groups[dataset_index]; if(!units_group) units_group = this.svg_units_groups[dataset_index];
@ -1574,14 +1572,14 @@ class AxisChart extends BaseChart {
let relY = e.pageY - o.top - this.translate_y; let relY = e.pageY - o.top - this.translate_y;
if(relY < this.height + this.translate_y * 2) { if(relY < this.height + this.translate_y * 2) {
this.map_tooltip_x_position_and_show(relX); this.mapTooltipXPosition(relX);
} else { } else {
this.tip.hide_tip(); this.tip.hide_tip();
} }
}); });
} }
map_tooltip_x_position_and_show(relX) { mapTooltipXPosition(relX) {
if(!this.y_min_tops) return; if(!this.y_min_tops) return;
let titles = this.xAxisLabels; let titles = this.xAxisLabels;
@ -1634,7 +1632,7 @@ class AxisChart extends BaseChart {
this.setup_y(); this.setup_y();
// Change in data, so calculate dependencies // Change in data, so calculate dependencies
this.calc_y_dependencies(); this.calcYDependencies();
// Got the values? Now begin drawing // Got the values? Now begin drawing
this.animator = new Animator(this.height, this.width, this.zero_line, this.avg_unit_width); this.animator = new Animator(this.height, this.width, this.zero_line, this.avg_unit_width);
@ -1681,7 +1679,7 @@ class AxisChart extends BaseChart {
); );
if(extra_points > 0) { if(extra_points > 0) {
this.make_path && this.make_path(d, old_x, old_y, this.colors[d.index]); this.make_path && this.make_path(d, old_x, old_y, this.colors[d.index]);
this.make_new_units_for_dataset(old_x, old_y, this.colors[d.index], d.index, this.y.length); this.makeDatasetUnits(old_x, old_y, this.colors[d.index], d.index, this.y.length);
} }
// Animation // Animation
d.path && this.animate_path(d, newX, newY); d.path && this.animate_path(d, newX, newY);
@ -1693,7 +1691,7 @@ class AxisChart extends BaseChart {
setTimeout(() => { setTimeout(() => {
this.y.map(d => { this.y.map(d => {
this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[d.index]); this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[d.index]);
this.make_new_units(d); this.makeUnits(d);
this.makeYLines(this.yAxisPositions, this.yAxisLabels); this.makeYLines(this.yAxisPositions, this.yAxisLabels);
this.makeXLines(this.xPositions, this.xAxisLabels); this.makeXLines(this.xPositions, this.xAxisLabels);
@ -1804,7 +1802,7 @@ class AxisChart extends BaseChart {
return all_values.concat(this.specific_values.map(d => d.value)); return all_values.concat(this.specific_values.map(d => d.value));
} }
calc_y_dependencies() { calcYDependencies() {
this.y_min_tops = new Array(this.xAxisLabels.length).fill(9999); this.y_min_tops = new Array(this.xAxisLabels.length).fill(9999);
this.y.map(d => { this.y.map(d => {
d.yUnitPositions = d.values.map( val => floatTwo(this.zero_line - val * this.multiplier)); d.yUnitPositions = d.values.map( val => floatTwo(this.zero_line - val * this.multiplier));
@ -1923,12 +1921,8 @@ class LineChart extends AxisChart {
this.setup(); this.setup();
} }
setup_graph_components() { setupPreUnitLayers() {
this.setup_path_groups(); // Path groups
super.setup_graph_components();
}
setup_path_groups() {
this.paths_groups = []; this.paths_groups = [];
this.y.map((d, i) => { this.y.map((d, i) => {
this.paths_groups[i] = makeSVGGroup( this.paths_groups[i] = makeSVGGroup(
@ -1946,10 +1940,10 @@ class LineChart extends AxisChart {
}; };
} }
make_new_units_for_dataset(x_values, y_values, color, dataset_index, makeDatasetUnits(x_values, y_values, color, dataset_index,
no_of_datasets, units_group, units_array, unit) { no_of_datasets, units_group, units_array, unit) {
if(this.show_dots) { if(this.show_dots) {
super.make_new_units_for_dataset(x_values, y_values, color, dataset_index, super.makeDatasetUnits(x_values, y_values, color, dataset_index,
no_of_datasets, units_group, units_array, unit); no_of_datasets, units_group, units_array, unit);
} }
} }
@ -2003,13 +1997,6 @@ class ScatterChart extends LineChart {
this.setup(); this.setup();
} }
setup_graph_components() {
this.setup_path_groups();
super.setup_graph_components();
}
setup_path_groups() {}
setup_values() { setup_values() {
super.setup_values(); super.setup_values();
this.unit_args = { this.unit_args = {
@ -2054,7 +2041,7 @@ class PercentageChart extends BaseChart {
}); });
} }
setup_components() { setupLayers() {
this.percentage_bar = $$1.create('div', { this.percentage_bar = $$1.create('div', {
className: 'progress', className: 'progress',
inside: this.chart inside: this.chart
@ -2096,7 +2083,7 @@ class PercentageChart extends BaseChart {
this.legend_totals = this.slice_totals.slice(0, this.max_legend_points); this.legend_totals = this.slice_totals.slice(0, this.max_legend_points);
} }
make_graph_components() { renderComponents() {
this.grand_total = this.slice_totals.reduce((a, b) => a + b, 0); this.grand_total = this.slice_totals.reduce((a, b) => a + b, 0);
this.slices = []; this.slices = [];
this.slice_totals.map((total, i) => { this.slice_totals.map((total, i) => {
@ -2214,7 +2201,7 @@ class PieChart extends BaseChart {
const{centerX,centerY,radius,clockWise} = this; const{centerX,centerY,radius,clockWise} = this;
return `M${centerX} ${centerY} L${centerX+startPosition.x} ${centerY+startPosition.y} A ${radius} ${radius} 0 0 ${clockWise ? 1 : 0} ${centerX+endPosition.x} ${centerY+endPosition.y} z`; return `M${centerX} ${centerY} L${centerX+startPosition.x} ${centerY+startPosition.y} A ${radius} ${radius} 0 0 ${clockWise ? 1 : 0} ${centerX+endPosition.x} ${centerY+endPosition.y} z`;
} }
make_graph_components(init){ renderComponents(init){
const{radius,clockWise} = this; const{radius,clockWise} = this;
this.grand_total = this.slice_totals.reduce((a, b) => a + b, 0); this.grand_total = this.slice_totals.reduce((a, b) => a + b, 0);
const prevSlicesProperties = this.slicesProperties || []; const prevSlicesProperties = this.slicesProperties || [];
@ -2447,11 +2434,11 @@ class Heatmap extends BaseChart {
} }
} }
setup_components() { setupLayers() {
this.domain_label_group = this.makeDrawAreaComponent( this.domain_label_group = this.makeLayer(
'domain-label-group chart-label'); 'domain-label-group chart-label');
this.data_groups = this.makeDrawAreaComponent( this.data_groups = this.makeLayer(
'data-groups', 'data-groups',
`translate(0, 20)` `translate(0, 20)`
); );
@ -2588,7 +2575,7 @@ class Heatmap extends BaseChart {
}); });
} }
make_graph_components() { renderComponents() {
Array.prototype.slice.call( Array.prototype.slice.call(
this.container.querySelectorAll('.graph-stats-container, .sub-title, .title') this.container.querySelectorAll('.graph-stats-container, .sub-title, .title')
).map(d => { ).map(d => {

2
dist/frappe-charts.min.cjs.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/frappe-charts.min.esm.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/frappe-charts.min.iife.js vendored
View File

File diff suppressed because one or more lines are too long

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

File diff suppressed because one or more lines are too long

2
docs/assets/js/index.js
View File

@ -241,7 +241,7 @@ chart_update_buttons.querySelector('[data-update="random"]').addEventListener("c
chart_update_buttons.querySelector('[data-update="add"]').addEventListener("click", (e) => { chart_update_buttons.querySelector('[data-update="add"]').addEventListener("click", (e) => {
// NOTE: this ought to be problem, labels stay the same after update // NOTE: this ought to be problem, labels stay the same after update
let index = update_chart.x.length; // last index to add let index = update_chart.xAxisLabels.length; // last index to add
if(index >= update_data_all_indices.length) return; if(index >= update_data_all_indices.length) return;
update_chart.add_data_point( update_chart.add_data_point(
[update_data_all_values[index]], update_data_all_labels[index] [update_data_all_values[index]], update_data_all_labels[index]

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

@ -110,33 +110,29 @@ export default class AxisChart extends BaseChart {
if(!this.oldYAnnotationPositions) this.oldYAnnotationPositions = this.yAnnotationPositions; if(!this.oldYAnnotationPositions) this.oldYAnnotationPositions = this.yAnnotationPositions;
} }
setup_components() { setupLayers() {
super.setup_components(); super.setupLayers();
this.setup_marker_components();
this.setup_aggregation_components();
this.setup_graph_components();
}
setup_marker_components() { // For markers
this.y_axis_group = this.makeDrawAreaComponent('y axis'); this.y_axis_group = this.makeLayer('y axis');
this.x_axis_group = this.makeDrawAreaComponent('x axis'); this.x_axis_group = this.makeLayer('x axis');
this.specific_y_group = this.makeDrawAreaComponent('specific axis'); this.specific_y_group = this.makeLayer('specific axis');
}
setup_aggregation_components() { // For Aggregation
this.sum_group = this.makeDrawAreaComponent('data-points'); // this.sumGroup = this.makeLayer('data-points');
this.average_group = this.makeDrawAreaComponent('chart-area'); // this.averageGroup = this.makeLayer('chart-area');
}
setup_graph_components() { this.setupPreUnitLayers && this.setupPreUnitLayers();
// For Graph points
this.svg_units_groups = []; this.svg_units_groups = [];
this.y.map((d, i) => { this.y.map((d, i) => {
this.svg_units_groups[i] = this.makeDrawAreaComponent( this.svg_units_groups[i] = this.makeLayer(
'data-points data-points-' + i); 'data-points data-points-' + i);
}); });
} }
make_graph_components(init=false) { renderComponents(init) {
this.makeYLines(this.yAxisPositions, this.yAxisLabels); this.makeYLines(this.yAxisPositions, this.yAxisLabels);
this.makeXLines(this.xPositions, this.xAxisLabels); this.makeXLines(this.xPositions, this.xAxisLabels);
this.draw_graph(init); this.draw_graph(init);
@ -207,12 +203,13 @@ export default class AxisChart extends BaseChart {
} }
draw_graph(init=false) { draw_graph(init=false) {
// TODO: NO INIT!
if(this.raw_chart_args.hasOwnProperty("init") && !this.raw_chart_args.init) { if(this.raw_chart_args.hasOwnProperty("init") && !this.raw_chart_args.init) {
this.y.map((d, i) => { this.y.map((d, i) => {
d.svg_units = []; d.svg_units = [];
this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]); this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]);
this.make_new_units(d); this.makeUnits(d);
this.calc_y_dependencies(); this.calcYDependencies();
}); });
return; return;
} }
@ -223,7 +220,7 @@ export default class AxisChart extends BaseChart {
this.y.map((d, i) => { this.y.map((d, i) => {
d.svg_units = []; d.svg_units = [];
this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]); this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]);
this.make_new_units(d); this.makeUnits(d);
}); });
} }
@ -236,7 +233,7 @@ export default class AxisChart extends BaseChart {
d.svg_units = []; d.svg_units = [];
this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]); this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[i]);
this.make_new_units(d); this.makeUnits(d);
}); });
setTimeout(() => { setTimeout(() => {
@ -255,8 +252,8 @@ export default class AxisChart extends BaseChart {
} }
} }
make_new_units(d) { makeUnits(d) {
this.make_new_units_for_dataset( this.makeDatasetUnits(
this.xPositions, this.xPositions,
d.yUnitPositions, d.yUnitPositions,
this.colors[d.index], this.colors[d.index],
@ -265,7 +262,7 @@ export default class AxisChart extends BaseChart {
); );
} }
make_new_units_for_dataset(x_values, y_values, color, dataset_index, makeDatasetUnits(x_values, y_values, color, dataset_index,
no_of_datasets, units_group, units_array, unit) { no_of_datasets, units_group, units_array, unit) {
if(!units_group) units_group = this.svg_units_groups[dataset_index]; if(!units_group) units_group = this.svg_units_groups[dataset_index];
@ -304,14 +301,14 @@ export default class AxisChart extends BaseChart {
let relY = e.pageY - o.top - this.translate_y; let relY = e.pageY - o.top - this.translate_y;
if(relY < this.height + this.translate_y * 2) { if(relY < this.height + this.translate_y * 2) {
this.map_tooltip_x_position_and_show(relX); this.mapTooltipXPosition(relX);
} else { } else {
this.tip.hide_tip(); this.tip.hide_tip();
} }
}); });
} }
map_tooltip_x_position_and_show(relX) { mapTooltipXPosition(relX) {
if(!this.y_min_tops) return; if(!this.y_min_tops) return;
let titles = this.xAxisLabels; let titles = this.xAxisLabels;
@ -364,7 +361,7 @@ export default class AxisChart extends BaseChart {
this.setup_y(); this.setup_y();
// Change in data, so calculate dependencies // Change in data, so calculate dependencies
this.calc_y_dependencies(); this.calcYDependencies();
// Got the values? Now begin drawing // Got the values? Now begin drawing
this.animator = new Animator(this.height, this.width, this.zero_line, this.avg_unit_width); this.animator = new Animator(this.height, this.width, this.zero_line, this.avg_unit_width);
@ -411,7 +408,7 @@ export default class AxisChart extends BaseChart {
); );
if(extra_points > 0) { if(extra_points > 0) {
this.make_path && this.make_path(d, old_x, old_y, this.colors[d.index]); this.make_path && this.make_path(d, old_x, old_y, this.colors[d.index]);
this.make_new_units_for_dataset(old_x, old_y, this.colors[d.index], d.index, this.y.length); this.makeDatasetUnits(old_x, old_y, this.colors[d.index], d.index, this.y.length);
} }
// Animation // Animation
d.path && this.animate_path(d, newX, newY); d.path && this.animate_path(d, newX, newY);
@ -423,7 +420,7 @@ export default class AxisChart extends BaseChart {
setTimeout(() => { setTimeout(() => {
this.y.map(d => { this.y.map(d => {
this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[d.index]); this.make_path && this.make_path(d, this.xPositions, d.yUnitPositions, this.colors[d.index]);
this.make_new_units(d); this.makeUnits(d);
this.makeYLines(this.yAxisPositions, this.yAxisLabels); this.makeYLines(this.yAxisPositions, this.yAxisLabels);
this.makeXLines(this.xPositions, this.xAxisLabels); this.makeXLines(this.xPositions, this.xAxisLabels);
@ -534,7 +531,7 @@ export default class AxisChart extends BaseChart {
return all_values.concat(this.specific_values.map(d => d.value)); return all_values.concat(this.specific_values.map(d => d.value));
} }
calc_y_dependencies() { calcYDependencies() {
this.y_min_tops = new Array(this.xAxisLabels.length).fill(9999); this.y_min_tops = new Array(this.xAxisLabels.length).fill(9999);
this.y.map(d => { this.y.map(d => {
d.yUnitPositions = d.values.map( val => floatTwo(this.zero_line - val * this.multiplier)); d.yUnitPositions = d.values.map( val => floatTwo(this.zero_line - val * this.multiplier));

9
src/js/charts/BaseChart.js
View File

@ -135,16 +135,17 @@ export default class BaseChart {
} }
refresh(init=false) { refresh(init=false) {
// TODO: no init!
this.setup_base_values(); this.setup_base_values();
this.set_width(); this.set_width();
this.setup_container(); this.setup_container();
this.setup_components(); this.setupLayers();
this.setup_values(); this.setup_values();
this.setup_utils(); this.setup_utils();
this.make_graph_components(init); this.renderComponents(init);
this.make_tooltip(); this.make_tooltip();
if(this.summary.length > 0) { if(this.summary.length > 0) {
@ -212,7 +213,7 @@ export default class BaseChart {
); );
} }
setup_components() {} setupLayers() {}
setup_values() {} setup_values() {}
setup_utils() {} setup_utils() {}
@ -279,7 +280,7 @@ export default class BaseChart {
getDataPoint() {} getDataPoint() {}
updateCurrentDataPoint() {} updateCurrentDataPoint() {}
makeDrawAreaComponent(className, transform='') { makeLayer(className, transform='') {
return makeSVGGroup(this.draw_area, className, transform); return makeSVGGroup(this.draw_area, className, transform);
} }
} }

8
src/js/charts/Heatmap.js
View File

@ -80,11 +80,11 @@ export default class Heatmap extends BaseChart {
} }
} }
setup_components() { setupLayers() {
this.domain_label_group = this.makeDrawAreaComponent( this.domain_label_group = this.makeLayer(
'domain-label-group chart-label'); 'domain-label-group chart-label');
this.data_groups = this.makeDrawAreaComponent( this.data_groups = this.makeLayer(
'data-groups', 'data-groups',
`translate(0, 20)` `translate(0, 20)`
); );
@ -221,7 +221,7 @@ export default class Heatmap extends BaseChart {
}); });
} }
make_graph_components() { renderComponents() {
Array.prototype.slice.call( Array.prototype.slice.call(
this.container.querySelectorAll('.graph-stats-container, .sub-title, .title') this.container.querySelectorAll('.graph-stats-container, .sub-title, .title')
).map(d => { ).map(d => {

12
src/js/charts/LineChart.js
View File

@ -25,12 +25,8 @@ export default class LineChart extends AxisChart {
this.setup(); this.setup();
} }
setup_graph_components() { setupPreUnitLayers() {
this.setup_path_groups(); // Path groups
super.setup_graph_components();
}
setup_path_groups() {
this.paths_groups = []; this.paths_groups = [];
this.y.map((d, i) => { this.y.map((d, i) => {
this.paths_groups[i] = makeSVGGroup( this.paths_groups[i] = makeSVGGroup(
@ -48,10 +44,10 @@ export default class LineChart extends AxisChart {
}; };
} }
make_new_units_for_dataset(x_values, y_values, color, dataset_index, makeDatasetUnits(x_values, y_values, color, dataset_index,
no_of_datasets, units_group, units_array, unit) { no_of_datasets, units_group, units_array, unit) {
if(this.show_dots) { if(this.show_dots) {
super.make_new_units_for_dataset(x_values, y_values, color, dataset_index, super.makeDatasetUnits(x_values, y_values, color, dataset_index,
no_of_datasets, units_group, units_array, unit); no_of_datasets, units_group, units_array, unit);
} }
} }

4
src/js/charts/PercentageChart.js
View File

@ -33,7 +33,7 @@ export default class PercentageChart extends BaseChart {
}); });
} }
setup_components() { setupLayers() {
this.percentage_bar = $.create('div', { this.percentage_bar = $.create('div', {
className: 'progress', className: 'progress',
inside: this.chart inside: this.chart
@ -75,7 +75,7 @@ export default class PercentageChart extends BaseChart {
this.legend_totals = this.slice_totals.slice(0, this.max_legend_points); this.legend_totals = this.slice_totals.slice(0, this.max_legend_points);
} }
make_graph_components() { renderComponents() {
this.grand_total = this.slice_totals.reduce((a, b) => a + b, 0); this.grand_total = this.slice_totals.reduce((a, b) => a + b, 0);
this.slices = []; this.slices = [];
this.slice_totals.map((total, i) => { this.slice_totals.map((total, i) => {

2
src/js/charts/PieChart.js
View File

@ -69,7 +69,7 @@ export default class PieChart extends BaseChart {
const{centerX,centerY,radius,clockWise} = this; const{centerX,centerY,radius,clockWise} = this;
return `M${centerX} ${centerY} L${centerX+startPosition.x} ${centerY+startPosition.y} A ${radius} ${radius} 0 0 ${clockWise ? 1 : 0} ${centerX+endPosition.x} ${centerY+endPosition.y} z`; return `M${centerX} ${centerY} L${centerX+startPosition.x} ${centerY+startPosition.y} A ${radius} ${radius} 0 0 ${clockWise ? 1 : 0} ${centerX+endPosition.x} ${centerY+endPosition.y} z`;
} }
make_graph_components(init){ renderComponents(init){
const{radius,clockWise} = this; const{radius,clockWise} = this;
this.grand_total = this.slice_totals.reduce((a, b) => a + b, 0); this.grand_total = this.slice_totals.reduce((a, b) => a + b, 0);
const prevSlicesProperties = this.slicesProperties || []; const prevSlicesProperties = this.slicesProperties || [];

7
src/js/charts/ScatterChart.js
View File

@ -15,13 +15,6 @@ export default class ScatterChart extends LineChart {
this.setup(); this.setup();
} }
setup_graph_components() {
this.setup_path_groups();
super.setup_graph_components();
}
setup_path_groups() {}
setup_values() { setup_values() {
super.setup_values(); super.setup_values();
this.unit_args = { this.unit_args = {