Skip to content

Commit 637f988

Browse files
author
Jelte Lagendijk
committed
Refactoring chartOptions (use global)
1 parent b5152ef commit 637f988

File tree

8 files changed

+66
-184
lines changed

8 files changed

+66
-184
lines changed

‎src/ChartJS/widgets/BarChart/widget/BarChart.js‎

Lines changed: 9 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -100,16 +100,11 @@ define([
100100
this._chart.update(1000);
101101
this._chart.bindEvents(); // tooltips otherwise won't work
102102
} else {
103-
var chartOptions = {
103+
var chartProperties = {
104104
type: "bar",
105105
data: data,
106-
options: {
107-
title: {
108-
display: (this.chartTitle !== "") ? true : false,
109-
text: (this.chartTitle !== "") ? this.chartTitle : "",
110-
fontFamily: this._font,
111-
fontSize: this.titleSize
112-
},
106+
options: this._chartOptions({
107+
113108
scales : {
114109
xAxes: [{
115110
scaleLabel: {
@@ -133,16 +128,6 @@ define([
133128

134129
},
135130

136-
responsive : this.responsive,
137-
responsiveAnimationDuration : (this.responsiveAnimationDuration > 0 ? this.responsiveAnimationDuration : 0),
138-
tooltips : {
139-
enabled : this.showTooltips
140-
},
141-
legend: {
142-
display : this.showLegend,
143-
labels : { fontFamily : this._font }
144-
},
145-
146131
//Boolean - Whether to show labels on the scale
147132
scaleShowLabels : this.scaleShowLabels,
148133

@@ -179,25 +164,16 @@ define([
179164
scaleLineWidth : this.scaleLineWidth,
180165

181166
//The scale line color
182-
scaleLineColor : this.scaleLineColor,
183-
184-
// maintainAspectRatio
185-
maintainAspectRatio : this.maintainAspectRatio,
186-
187-
// Show tooltips at all
188-
showTooltips : this.showTooltips,
189-
190-
// Custom tooltip?
191-
customTooltips : false,
192-
}
167+
scaleLineColor : this.scaleLineColor
168+
})
193169
};
194170

195171
if (this.scaleBeginAtZero) {
196-
chartOptions.options.scales.yAxes[0].ticks.suggestedMin = 0;
197-
chartOptions.options.scales.yAxes[0].ticks.suggestedMax = 4;
172+
chartProperties.options.scales.yAxes[0].ticks.suggestedMin = 0;
173+
chartProperties.options.scales.yAxes[0].ticks.suggestedMax = 4;
198174
}
199175

200-
this._chart = new this._chartJS(this._ctx, chartOptions);
176+
this._chart = new this._chartJS(this._ctx, chartProperties);
201177

202178
this.connect(window, "resize", lang.hitch(this, function () {
203179
this._resize();
@@ -213,6 +189,7 @@ define([
213189
}
214190
});
215191
});
192+
216193
require(["ChartJS/widgets/BarChart/widget/BarChart"], function () {
217194
"use strict";
218195
});

‎src/ChartJS/widgets/Core.js‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -521,6 +521,33 @@ define([
521521
return "rgba(220,220,220," + alpha + ")";
522522
},
523523

524+
_chartOptions: function (options) {
525+
logger.debug(this.id + "._chartOptions");
526+
// returns default chart options, mixed with specific options for a chart
527+
528+
var defaultOptions = {
529+
title: {
530+
display: (this.chartTitle !== "") ? true : false,
531+
text: (this.chartTitle !== "") ? this.chartTitle : "",
532+
fontFamily: this._font,
533+
fontSize: this.titleSize
534+
},
535+
responsive : this.responsive,
536+
responsiveAnimationDuration : (this.responsiveAnimationDuration > 0 ? this.responsiveAnimationDuration : 0),
537+
tooltips : {
538+
enabled : this.showTooltips
539+
},
540+
legend: {
541+
display : this.showLegend,
542+
labels : { fontFamily : this._font }
543+
},
544+
maintainAspectRatio : this.maintainAspectRatio,
545+
showTooltips : this.showTooltips
546+
};
547+
548+
return lang.mixin(lang.clone(defaultOptions), options);
549+
},
550+
524551
_executeMicroflow: function (mf, callback, obj) {
525552
logger.debug(this.id + "._executeMicroflow");
526553
var _params = {

‎src/ChartJS/widgets/DoughnutChart/widget/DoughnutChart.js‎

Lines changed: 4 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -97,23 +97,7 @@ define([
9797
this._chart = new this._chartJS(this._ctx, {
9898
type: "doughnut",
9999
data: this._createDataSets(data),
100-
options: {
101-
title: {
102-
display: (this.chartTitle !== "") ? true : false,
103-
text: (this.chartTitle !== "") ? this.chartTitle : "",
104-
fontFamily: this._font,
105-
fontSize: this.titleSize
106-
},
107-
108-
responsive : this.responsive,
109-
responsiveAnimationDuration : (this.responsiveAnimationDuration > 0 ? this.responsiveAnimationDuration : 0),
110-
tooltips : {
111-
enabled : this.showTooltips
112-
},
113-
legend: {
114-
display: this.showLegend,
115-
labels : { fontFamily : this._font }
116-
},
100+
options: this._chartOptions({
117101

118102
//Boolean - Whether we should show a stroke on each segment
119103
segmentShowStroke : this.segmentShowStroke,
@@ -124,7 +108,6 @@ define([
124108
//Number - The width of each segment stroke
125109
segmentStrokeWidth : this.segmentStrokeWidth,
126110

127-
128111
//Number - Amount of animation steps
129112
animationSteps : this.animationSteps,
130113

@@ -139,19 +122,9 @@ define([
139122

140123
legendCallback : this._legendAlternateCallback,
141124

142-
// Show tooltips at all
143-
showTooltips : this.showTooltips,
144-
145-
// maintainAspectRatio
146-
maintainAspectRatio : this.maintainAspectRatio,
147-
148125
//Number - The percentage of the chart that we cut out of the middle
149-
cutoutPercentage : this.percentageInnerCutout,
150-
151-
// Custom tooltip?
152-
customTooltips : false //lang.hitch(this, this.customTooltip)
153-
154-
}
126+
cutoutPercentage : this.percentageInnerCutout
127+
})
155128
});
156129

157130
this.connect(window, "resize", lang.hitch(this, function () {
@@ -171,6 +144,7 @@ define([
171144
}
172145
});
173146
});
147+
174148
require(["ChartJS/widgets/DoughnutChart/widget/DoughnutChart"], function () {
175149
"use strict";
176150
});

‎src/ChartJS/widgets/LineChart/widget/LineChart.js‎

Lines changed: 9 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -120,16 +120,11 @@ define([
120120
} else {
121121
//logger.debug("stacked:" + this.isStacked);
122122

123-
var chartOptions = {
123+
var chartProperties = {
124124
type: "line",
125125
data: data,
126-
options: {
127-
title: {
128-
display: (this.chartTitle !== "") ? true : false,
129-
text: (this.chartTitle !== "") ? this.chartTitle : "",
130-
fontFamily: this._font,
131-
fontSize: this.titleSize
132-
},
126+
options: this._chartOptions({
127+
133128
scales : {
134129
yAxes: [{
135130
//If stacked is set to true, the Y-axis needs to be stacked for it to work
@@ -162,15 +157,7 @@ define([
162157
ticks : { fontFamily: this._font, }
163158
}]
164159
},
165-
responsive : this.responsive,
166-
responsiveAnimationDuration : (this.responsiveAnimationDuration > 0 ? this.responsiveAnimationDuration : 0),
167-
tooltips : {
168-
enabled : this.showTooltips
169-
},
170-
legend: {
171-
display: this.showLegend,
172-
labels : { fontFamily : this._font }
173-
},
160+
174161
elements: {
175162
point: {
176163
radius : this.pointDot ? this.pointRadius : 0,
@@ -217,26 +204,16 @@ define([
217204
scaleLineWidth : this.scaleLineWidth,
218205

219206
//The scale line color
220-
scaleLineColor : this.scaleLineColor,
221-
222-
// Show tooltips at all
223-
showTooltips : this.showTooltips,
224-
225-
// maintainAspectRatio
226-
maintainAspectRatio : this.maintainAspectRatio,
227-
228-
// Custom tooltip?
229-
customTooltips : false, //lang.hitch(this, this.customTooltip)
230-
231-
}
207+
scaleLineColor : this.scaleLineColor
208+
})
232209
};
233210

234211
if (this.scaleBeginAtZero) {
235-
chartOptions.options.scales.yAxes[0].ticks.suggestedMin = 0;
236-
chartOptions.options.scales.yAxes[0].ticks.suggestedMax = 4;
212+
chartProperties.options.scales.yAxes[0].ticks.suggestedMin = 0;
213+
chartProperties.options.scales.yAxes[0].ticks.suggestedMax = 4;
237214
}
238215

239-
this._chart = new this._chartJS(this._ctx, chartOptions);
216+
this._chart = new this._chartJS(this._ctx, chartProperties);
240217

241218
this.connect(window, "resize", lang.hitch(this, function () {
242219
this._resize();

‎src/ChartJS/widgets/PieChart/widget/PieChart.js‎

Lines changed: 5 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -99,26 +99,10 @@ define([
9999
this._chart.update(1000);
100100
this._chart.bindEvents(); // tooltips otherwise won't work
101101
} else {
102-
var chartOptions = {
102+
var chartProperties = {
103103
type: "pie",
104104
data: this._createDataSets(data),
105-
options: {
106-
title: {
107-
display: (this.chartTitle !== "") ? true : false,
108-
text: (this.chartTitle !== "") ? this.chartTitle : "",
109-
fontFamily: this._font,
110-
fontSize: this.titleSize
111-
},
112-
113-
responsive : this.responsive,
114-
responsiveAnimationDuration : (this.responsiveAnimationDuration > 0 ? this.responsiveAnimationDuration : 0),
115-
tooltips : {
116-
enabled : this.showTooltips
117-
},
118-
legend: {
119-
display: this.showLegend,
120-
labels : { fontFamily : this._font }
121-
},
105+
options: this._chartOptions({
122106

123107
//Boolean - Whether we should show a stroke on each segment
124108
segmentShowStroke : this.segmentShowStroke,
@@ -143,22 +127,12 @@ define([
143127

144128
legendCallback : this._legendAlternateCallback,
145129

146-
// Show tooltips at all
147-
showTooltips : this.showTooltips,
148-
149-
// maintainAspectRatio
150-
maintainAspectRatio : this.maintainAspectRatio,
151-
152-
153130
//cutOut of pie
154131
cutoutPercentage : 0, //always zero for Pie chart
155132

156-
// Custom tooltip?
157-
customTooltips : false //lang.hitch(this, this.customTooltip)
158-
159-
}
133+
})
160134
};
161-
this._chart = new this._chartJS(this._ctx, chartOptions);
135+
this._chart = new this._chartJS(this._ctx, chartProperties);
162136

163137
// Set the con
164138
html.set(this._numberNode, this._data.object.get(this.numberInside));
@@ -173,6 +147,7 @@ define([
173147
}
174148
});
175149
});
150+
176151
require(["ChartJS/widgets/PieChart/widget/PieChart"], function () {
177152
"use strict";
178153
});

‎src/ChartJS/widgets/RadarChart/widget/RadarChart.js‎

Lines changed: 3 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -107,23 +107,7 @@ define([
107107
this._chart = new this._chartJS(this._ctx, {
108108
type: "radar",
109109
data: data,
110-
options: {
111-
title: {
112-
display: (this.chartTitle !== "") ? true : false,
113-
text: (this.chartTitle !== "") ? this.chartTitle : "",
114-
fontFamily: this._font,
115-
fontSize: this.titleSize
116-
},
117-
118-
responsive : this.responsive,
119-
responsiveAnimationDuration : (this.responsiveAnimationDuration > 0 ? this.responsiveAnimationDuration : 0),
120-
tooltips : {
121-
enabled : this.showTooltips
122-
},
123-
legend: {
124-
display: this.showLegend,
125-
labels : { fontFamily : this._font }
126-
},
110+
options: this._chartOptions({
127111

128112
scale: {
129113
ticks: {
@@ -184,18 +168,8 @@ define([
184168
//Boolean - Whether to fill the dataset with a colour
185169
datasetFill : this.datasetFill,
186170

187-
legendCallback : this._legendCallback,
188-
189-
// Show tooltips at all
190-
showTooltips : this.showTooltips,
191-
192-
// maintainAspectRatio
193-
maintainAspectRatio : this.maintainAspectRatio,
194-
195-
// Custom tooltip?
196-
customTooltips : false //lang.hitch(this, this.customTooltip)
197-
198-
}
171+
legendCallback : this._legendCallback
172+
})
199173
});
200174

201175
// Add class to determain chart type

0 commit comments

Comments
 (0)