%PDF- %PDF-
Direktori : /home/opti/workflow/src/public/app-assets/js/scripts/charts/echarts/pie-doughnut/ |
Current File : /home/opti/workflow/src/public/app-assets/js/scripts/charts/echarts/pie-doughnut/lasagna.js |
/*========================================================================================= File Name: lasagna.js Description: echarts lasagna chart ---------------------------------------------------------------------------------------- Item Name: Modern Admin - Clean Bootstrap 4 Dashboard HTML Template Version: 1.0 Author: PIXINVENT Author URL: http://www.themeforest.net/user/pixinvent ==========================================================================================*/ // Lasagna chart // ------------------------------ $(window).on("load", function(){ // Set paths // ------------------------------ require.config({ paths: { echarts: '../../../app-assets/vendors/js/charts/echarts' } }); // Configuration // ------------------------------ require( [ 'echarts', 'echarts/chart/pie', 'echarts/chart/funnel' ], // Charts setup function (ec) { // Initialize chart // ------------------------------ var myChart = ec.init(document.getElementById('lasagna')); // Chart Options // ------------------------------ chartOptions = { // Add title title: { text: 'Browser statistics', subtext: 'Based on shared research', x: 'center' }, // Add tooltip tooltip: { trigger: 'item', formatter: '{a} <br/>{b}: {c} ({d}%)' }, // Add legend legend: { x: 'left', orient: 'vertical', data: ['Chrome','Firefox','Safari','IE9+','IE8-'] }, // Add custom colors color: ['#00A5A8', '#626E82', '#FF7D4D','#FF4558', '#28D094'], // Enable drag recalculate calculable: false, // Add series series: (function () { var series = []; for (var i = 0; i < 30; i++) { series.push({ name: 'Browser', type: 'pie', itemStyle: { normal: { label: { show: i > 28 }, labelLine: { show: i > 28, length: 20 } } }, radius: [i * 3.6 + 40, i * 3.6 + 43], center: ['50%', '55%'], data: [ {value: i * 128 + 80, name: 'Chrome'}, {value: i * 64 + 160, name: 'Firefox'}, {value: i * 32 + 320, name: 'Safari'}, {value: i * 16 + 640, name: 'IE9+'}, {value: i * 8 + 1280, name: 'IE8-'} ] }) } return series; })() }; // Apply options // ------------------------------ myChart.setOption(chartOptions); // Resize chart // ------------------------------ $(function () { // Resize chart on menu width change and window resize $(window).on('resize', resize); $(".menu-toggle").on('click', resize); // Resize function function resize() { setTimeout(function() { // Resize chart myChart.resize(); }, 200); } }); } ); });