mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-04-20 16:04:25 +02:00
Code Issues Projects Releases Wiki Activity

MDL-55045 core: Remove the hardcoded canvas tag for chart.js

Browse Source 
Part of MDL-54987 epic.
This commit is contained in:
Frederic Massart 2016-06-29 15:52:03 +08:00 committed by Dan Poltawski
parent 6cf5e0f263
commit 9b28bf0b83
3 changed files with 13 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
lib/amd/build/chart_output_chartjs.min.js vendored
View File

@ -1 +1 @@
define(["jquery","core/chartjs","core/chart_axis","core/chart_output_base"],function(a,b,c,d){function e(){d.prototype.constructor.apply(this,arguments),this._build()}return e.prototype=Object.create(d.prototype),e.prototype._config=null,e.prototype._chartjs=null,e.prototype.getDatasets=function(){var a=this._chart.getSeries().map(function(a){return{label:a.getLabel(),data:a.getValues(),type:a.getType(),fill:!1,borderColor:a.getColor(),backgroundColor:a.getColor()}});return a},e.prototype._build=function(){this._config=this._makeConfig(),this._chartjs=new b(this._node[0],this._config)},e.prototype._makeAxisConfig=function(a){var b={};return a.getPosition()!==c.prototype.POS_DEFAULT&&(b.position=a.getPosition()),null!==a.getLabel()&&(b.scaleLabel={display:!0,labelString:a.getLabel()}),null!==a.getStepSize()&&(b.ticks=b.ticks||{},b.ticks.stepSize=a.getStepSize()),null!==a.getMax()&&(b.ticks=b.ticks||{},b.ticks.max=a.getMax()),null!==a.getMin()&&(b.ticks=b.ticks||{},b.ticks.min=a.getMin()),b},e.prototype._makeConfig=function(){var a={type:this._chart.getType(),data:{labels:this._chart.getLabels(),datasets:this.getDatasets()},options:{title:{display:null!==this._chart.getTitle(),text:this._chart.getTitle()}}};return this._chart.getXAxes().forEach(function(b,c){a.options.scales=a.options.scales||{},a.options.scales.xAxes=a.options.scales.xAxes||[],a.options.scales.xAxes[c]=this._makeAxisConfig(b)}.bind(this)),this._chart.getYAxes().forEach(function(b,c){a.options.scales=a.options.scales||{},a.options.scales.yAxes=a.options.scales.yAxes||[],a.options.scales.yAxes[c]=this._makeAxisConfig(b)}.bind(this)),a},e.prototype.update=function(){a.extend(!0,this._config,this._makeConfig()),this._chartjs.update()},e});
define(["jquery","core/chartjs","core/chart_axis","core/chart_output_base"],function(a,b,c,d){function e(){d.prototype.constructor.apply(this,arguments),this._canvas=this._node,"CANVAS"!=this._canvas.prop("tagName")&&(this._canvas=a("<canvas>"),this._node.append(this._canvas)),this._build()}return e.prototype=Object.create(d.prototype),e.prototype._config=null,e.prototype._chartjs=null,e.prototype._canvas=null,e.prototype.getDatasets=function(){var a=this._chart.getSeries().map(function(a){return{label:a.getLabel(),data:a.getValues(),type:a.getType(),fill:!1,borderColor:a.getColor(),backgroundColor:a.getColor()}});return a},e.prototype._build=function(){this._config=this._makeConfig(),this._chartjs=new b(this._canvas[0],this._config)},e.prototype._makeAxisConfig=function(a){var b={};return a.getPosition()!==c.prototype.POS_DEFAULT&&(b.position=a.getPosition()),null!==a.getLabel()&&(b.scaleLabel={display:!0,labelString:a.getLabel()}),null!==a.getStepSize()&&(b.ticks=b.ticks||{},b.ticks.stepSize=a.getStepSize()),null!==a.getMax()&&(b.ticks=b.ticks||{},b.ticks.max=a.getMax()),null!==a.getMin()&&(b.ticks=b.ticks||{},b.ticks.min=a.getMin()),b},e.prototype._makeConfig=function(){var a={type:this._chart.getType(),data:{labels:this._chart.getLabels(),datasets:this.getDatasets()},options:{title:{display:null!==this._chart.getTitle(),text:this._chart.getTitle()}}};return this._chart.getXAxes().forEach(function(b,c){a.options.scales=a.options.scales||{},a.options.scales.xAxes=a.options.scales.xAxes||[],a.options.scales.xAxes[c]=this._makeAxisConfig(b)}.bind(this)),this._chart.getYAxes().forEach(function(b,c){a.options.scales=a.options.scales||{},a.options.scales.yAxes=a.options.scales.yAxes||[],a.options.scales.yAxes[c]=this._makeAxisConfig(b)}.bind(this)),a},e.prototype.update=function(){a.extend(!0,this._config,this._makeConfig()),this._chartjs.update()},e});

11
lib/amd/src/chart_output_chartjs.js
View File

@ -32,6 +32,14 @@ define([
*/
function Output() {
Base.prototype.constructor.apply(this, arguments);
// Make sure that we've got a canvas tag.
this._canvas = this._node;
if (this._canvas.prop('tagName') != 'CANVAS') {
this._canvas = $('<canvas>');
this._node.append(this._canvas);
}
this._build();
}
@ -39,6 +47,7 @@ define([
Output.prototype._config = null;
Output.prototype._chartjs = null;
Output.prototype._canvas = null;
Output.prototype.getDatasets = function() {
var sets = this._chart.getSeries().map(function(series) {
@ -56,7 +65,7 @@ define([
Output.prototype._build = function() {
this._config = this._makeConfig();
this._chartjs = new Chartjs(this._node[0], this._config);
this._chartjs = new Chartjs(this._canvas[0], this._config);
};
Output.prototype._makeAxisConfig = function(axis) {

5
lib/outputrenderers.php
View File

@ -4319,15 +4319,14 @@ EOD;
*/
public function render_chart(\core\chart_base $chart) {
$id = 'chart' . uniqid();
// TODO Handle the canvas in the output module rather than here.
$canvas = html_writer::tag('canvas', '', ['id' => $id]);
$div = html_writer::tag('div', '', ['id' => $id]);
$js = "require(['core/chart_builder', 'core/chart_output'], function(Builder, Output) {
Builder.make(" . json_encode($chart) . ").then(function(ChartInst) {
new Output('#" . $id . "', ChartInst);
});
});";
$this->page->requires->js_init_code($js, true);
return $canvas;
return $div;
}
}