3 lines
8.2 KiB
JavaScript
3 lines
8.2 KiB
JavaScript
"use strict";function _classCallCheck(a,r){if(!(a instanceof r))throw new TypeError("Cannot call a class as a function")}function _defineProperties(a,r){for(var o=0;o<r.length;o++){var t=r[o];t.enumerable=t.enumerable||!1,t.configurable=!0,"value"in t&&(t.writable=!0),Object.defineProperty(a,t.key,t)}}function _createClass(a,r,o){return r&&_defineProperties(a.prototype,r),o&&_defineProperties(a,o),a}var ChartjsOtherDemo=function(){function a(){_classCallCheck(this,a),this.isDarkSkin="dark"===Looper.skin,this.gray=Looper.getColors("gray"),this.borderColor=this.isDarkSkin?this.gray[200]:Looper.colors.white,this.init()}return _createClass(a,[{key:"init",value:function(){this.dataLabellingChart(),this.comboBarLineChart(),this.bubbleChart(),this.polarAreaChart(),this.pieChart(),this.doughnutChart()}},{key:"randomScalingFactor",value:function(){return(.5<Math.random()?1:-1)*Math.round(100*Math.random())}},{key:"randomScaling",value:function(){return Math.round(100*Math.random())}},{key:"months",value:function(){return["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]}},{key:"dataLabellingChart",value:function(){var a={labels:["Jan","Feb","Mar","Apr","May","Jun","Jul"],datasets:[{type:"bar",label:"Dataset 1",backgroundColor:Chart.helpers.color(Looper.colors.brand.purple).alpha(.2).rgbString(),borderColor:Looper.colors.brand.purple,data:[this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor()]},{type:"line",label:"Dataset 2",backgroundColor:Chart.helpers.color(Looper.colors.brand.green).alpha(.2).rgbString(),borderColor:Looper.colors.brand.green,data:[this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor()]},{type:"bar",label:"Dataset 3",backgroundColor:Chart.helpers.color(Looper.colors.brand.teal).alpha(.2).rgbString(),borderColor:Looper.colors.brand.teal,data:[this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor()]}]};Chart.plugins.register({afterDatasetsDraw:function(o){var i=o.chart.ctx;o.data.datasets.forEach(function(n,a){if(!(0<o.id)){var r=o.getDatasetMeta(a);r.hidden||r.data.forEach(function(a,r){i.fillStyle="#686F76";i.font=Chart.helpers.fontString(12,"normal","inherit");var o=n.data[r].toString();i.textAlign="center",i.textBaseline="middle";var t=a.tooltipPosition();i.fillText(o,t.x,t.y-6-5)})}})}});var r=$("#canvas-data-labelling")[0].getContext("2d");new Chart(r,{type:"bar",data:a,options:{responsive:!0,legend:{display:!1},title:{display:!0,text:"Data Labelling"}}})}},{key:"comboBarLineChart",value:function(){var a={labels:["Jan","Feb","Mar","Apr","May","Jun","Jul"],datasets:[{type:"line",label:"Dataset 1",borderColor:Looper.colors.brand.teal,borderWidth:2,fill:!1,data:[this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor()]},{type:"bar",label:"Dataset 2",backgroundColor:Looper.colors.brand.red,data:[this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor()],borderColor:"white",borderWidth:2},{type:"bar",label:"Dataset 3",backgroundColor:Looper.colors.brand.purple,data:[this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor(),this.randomScalingFactor()]}]},r=$("#canvas-combo-bar-line")[0].getContext("2d");new Chart(r,{type:"bar",data:a,options:{responsive:!0,legend:{display:!1},title:{display:!0,text:"Combo Bar Line Chart"},tooltips:{mode:"index",intersect:!0}}})}},{key:"bubbleChart",value:function(){var a={animation:{duration:1e4},datasets:[{label:"Dataset 1",backgroundColor:Chart.helpers.color(Looper.colors.brand.purple).alpha(.5).rgbString(),borderColor:Looper.colors.brand.purple,borderWidth:1,data:[{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5}]},{label:"Dataset 2",backgroundColor:Chart.helpers.color(Looper.colors.brand.teal).alpha(.5).rgbString(),borderColor:Looper.colors.brand.teal,borderWidth:1,data:[{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5},{x:this.randomScalingFactor(),y:this.randomScalingFactor(),r:Math.abs(this.randomScalingFactor())/5}]}]},r=$("#canvas-bubble")[0].getContext("2d");new Chart(r,{type:"bubble",data:a,options:{responsive:!0,legend:{display:!1},title:{display:!0,text:"Bubble Chart"},tooltips:{mode:"point"}}})}},{key:"polarAreaChart",value:function(){var a={data:{datasets:[{data:[this.randomScaling(),this.randomScaling(),this.randomScaling(),this.randomScaling(),this.randomScaling()],borderColor:[this.borderColor,this.borderColor,this.borderColor,this.borderColor,this.borderColor],backgroundColor:[Looper.hexToRgba(Looper.colors.brand.red,.5),Looper.hexToRgba(Looper.colors.brand.purple,.5),Looper.hexToRgba(Looper.colors.brand.yellow,.5),Looper.hexToRgba(Looper.colors.brand.teal,.5),Looper.hexToRgba(Looper.colors.brand.indigo,.5)],label:"My dataset"}],labels:["Red","Purple","Yellow","Green","Blue"]},options:{responsive:!0,legend:{display:!1},title:{display:!0,text:"Polar Area Chart"},scale:{ticks:{beginAtZero:!0,backdropColor:Looper.getLightColor()},reverse:!1},animation:{animateRotate:!1,animateScale:!0}}},r=$("#canvas-polar-area")[0].getContext("2d");Chart.PolarArea(r,a)}},{key:"pieChart",value:function(){var a={type:"pie",data:{datasets:[{data:[this.randomScaling(),this.randomScaling(),this.randomScaling(),this.randomScaling(),this.randomScaling()],borderColor:[this.borderColor,this.borderColor,this.borderColor,this.borderColor,this.borderColor],backgroundColor:[Looper.colors.brand.red,Looper.colors.brand.purple,Looper.colors.brand.yellow,Looper.colors.brand.teal,Looper.colors.brand.indigo],label:"Dataset 1"}],labels:["Red","Purple","Yellow","Green","Blue"]},options:{responsive:!0,legend:{display:!1},title:{display:!0,text:"Pie Chart"}}},r=$("#canvas-pie")[0].getContext("2d");new Chart(r,a)}},{key:"doughnutChart",value:function(){var a={type:"doughnut",data:{datasets:[{data:[this.randomScaling(),this.randomScaling(),this.randomScaling(),this.randomScaling(),this.randomScaling()],borderColor:[this.borderColor,this.borderColor,this.borderColor,this.borderColor,this.borderColor],backgroundColor:[Looper.colors.brand.red,Looper.colors.brand.purple,Looper.colors.brand.yellow,Looper.colors.brand.teal,Looper.colors.brand.indigo],label:"Dataset 1"}],labels:["Red","Purple","Yellow","Green","Blue"]},options:{responsive:!0,legend:{display:!1},title:{display:!0,text:"Doughnut Chart"},animation:{animateScale:!0,animateRotate:!0}}},r=$("#canvas-doughnut")[0].getContext("2d");new Chart(r,a)}}]),a}();$(document).on("theme:init",function(){new ChartjsOtherDemo});
|
|
//# sourceMappingURL=../../sourcemaps/pages/chartjs-others-demo.min.js.map
|