├── .gitignore ├── .php_cs.cache ├── LICENSE ├── README.md ├── composer.json ├── config └── config.php ├── resources ├── assets │ ├── draw.js │ ├── echarts.min.js │ └── themes │ │ ├── chalk.js │ │ ├── dark.js │ │ ├── halloween.js │ │ ├── infographic.js │ │ ├── macarons.js │ │ ├── purple-passion.js │ │ ├── roma.js │ │ ├── shine.js │ │ ├── vintage.js │ │ ├── walden.js │ │ ├── westeros.js │ │ └── wonderland.js └── views │ └── index.blade.php ├── routes └── web.php └── src ├── Echarts.php ├── EchartsServiceProvider.php └── Http └── Controllers └── EchartsController.php /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | phpunit.phar 3 | /vendor 4 | composer.phar 5 | composer.lock 6 | *.project 7 | .idea/ -------------------------------------------------------------------------------- /.php_cs.cache: -------------------------------------------------------------------------------- 1 | {"php":"7.2.24","version":"2.16.0","indent":" ","lineEnding":"\n","rules":{"blank_line_after_namespace":true,"braces":true,"class_definition":true,"constant_case":true,"elseif":true,"function_declaration":true,"indentation_type":true,"line_ending":true,"lowercase_keywords":true,"method_argument_space":{"on_multiline":"ensure_fully_multiline"},"no_break_comment":true,"no_closing_tag":true,"no_spaces_after_function_name":true,"no_spaces_inside_parenthesis":true,"no_trailing_whitespace":true,"no_trailing_whitespace_in_comment":true,"single_blank_line_at_eof":true,"single_class_element_per_statement":{"elements":["property"]},"single_import_per_statement":true,"single_line_after_imports":true,"switch_case_semicolon_to_colon":true,"switch_case_space":true,"visibility_required":true,"encoding":true,"full_opening_tag":true},"hashes":{"config\/config.php":1868915280,"resources\/views\/index.blade.php":4162280623,"routes\/web.php":2271466094,"src\/Echarts.php":2774331493,"src\/Http\/Controllers\/EchartsController.php":530074248,"src\/EchartsServiceProvider.php":4210772860}} -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Jens cyd622 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of 6 | this software and associated documentation files (the "Software"), to deal in 7 | the Software without restriction, including without limitation the rights to 8 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of 9 | the Software, and to permit persons to whom the Software is furnished to do so, 10 | subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS 17 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR 18 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER 19 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN 20 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 21 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Use Echarts in laravel-admin 2 | ====== 3 | 4 | ## Screenshot 5 | 6 | ![ATUBAe.md.jpg](https://s2.ax1x.com/2019/04/10/ATUBAe.jpg) 7 | ## Installation 8 | 9 | ```bash 10 | composer require cyd622/laravel-admin-ext-echarts 11 | 12 | php artisan vendor:publish --tag=echarts 13 | ``` 14 | 15 | ## Configuration 16 | 17 | Open `config/echarts.php`, set configurations . 18 | 19 | ```php 20 | 21 | [ 22 | 'view' => 'echarts::index', 23 | 'water_mark_text' => 'Cyd622@Laravel-Admin', 24 | 'theme' => 'shine', 25 | ]; 26 | 27 | ``` 28 | 29 | > * `view` set the view 30 | > * `water_mark_text` set the watermark. if value is `null` or `''` will not use watermark 31 | > * `theme` set the echarts theme 32 | 33 | ## Usage 34 | 35 | Add following codes in your controller : 36 | ```php 37 | public function index(Content $content) 38 | { 39 | $json = '[{"count_date":"03-28","fans_num":5906,"article_num":363,"forward_num":27928,"comment_num":9123,"like_num":35632},{"count_date":"03-29","fans_num":9565,"article_num":361,"forward_num":16755,"comment_num":7193,"like_num":36540}]'; 40 | 41 | $jsonArr = json_decode($json, 1); 42 | // bindData 43 | $head = [ 44 | 'count_date' => '日期', 45 | 'fans_num' => '粉丝', 46 | 'comment_num' => '评论', 47 | 'article_num' => '文章', 48 | 'forward_num' => '转发', 49 | 'like_num' => '点赞', 50 | ]; 51 | $echarts = (new Echarts('柱状图', '数据来自新浪云大数据平台')) 52 | ->setData($jsonArr) 53 | ->bindLegend($head); 54 | 55 | return $content 56 | ->header('Echarts demo') 57 | ->description('百度echarts图表展示') 58 | ->body(new Box('折线图', $echarts)); 59 | 60 | } 61 | ``` 62 | 63 | 64 | For more usage, please refer to the official [documentation](https://www.echartsjs.com/tutorial.html) of echartsjs. 65 | 66 | 67 | License 68 | ------------ 69 | Licensed under [The MIT License (MIT)](LICENSE). -------------------------------------------------------------------------------- /composer.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "cyd622/laravel-admin-ext-echarts", 3 | "description": "Use Echarts in laravel-admin", 4 | "type": "library", 5 | "keywords": ["laravel-admin", "extension", "echarts"], 6 | "homepage": "https://github.com/cyd622/laravel-admin-ext-echarts", 7 | "license": "MIT", 8 | "authors": [ 9 | { 10 | "name": "cyd622", 11 | "email": "luffywang622@gmail.com" 12 | } 13 | ], 14 | "require": { 15 | "php": ">=7.0.0", 16 | "encore/laravel-admin": "~1.6" 17 | }, 18 | "require-dev": { 19 | "phpunit/phpunit": "~6.0" 20 | }, 21 | "autoload": { 22 | "psr-4": { 23 | "Encore\\Admin\\Widgets\\Echarts\\": "src/" 24 | } 25 | }, 26 | "extra": { 27 | "laravel": { 28 | "providers": [ 29 | "Encore\\Admin\\Widgets\\Echarts\\EchartsServiceProvider" 30 | ] 31 | 32 | } 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /config/config.php: -------------------------------------------------------------------------------- 1 | 'echarts::index', 5 | 'water_mark_text' => 'Cyd622@Laravel-Admin', 6 | 'theme' => 'shine', 7 | ]; 8 | -------------------------------------------------------------------------------- /resources/assets/draw.js: -------------------------------------------------------------------------------- 1 | let echartTheme = null; 2 | let waterMarkCanvas = null; 3 | 4 | function drawWaterMark(waterMarkText) { 5 | let waterMarkCanvas = document.createElement('canvas'); 6 | let ctx = waterMarkCanvas.getContext('2d'); 7 | waterMarkCanvas.width = 220; 8 | waterMarkCanvas.height = 200; 9 | ctx.textAlign = 'center'; 10 | ctx.textBaseline = 'middle'; 11 | ctx.globalAlpha = 0.07; 12 | ctx.font = '20px Microsoft Yahei'; 13 | ctx.translate(130, 90); 14 | ctx.rotate(-Math.PI / 4); 15 | ctx.fillText(waterMarkText, 0, 0); 16 | return waterMarkCanvas; 17 | } 18 | 19 | function drawEcharts(domId, option) { 20 | 21 | if (waterMarkCanvas) { 22 | option.backgroundColor = { 23 | type: 'pattern', 24 | image: waterMarkCanvas, 25 | repeat: 'repeat' 26 | }; 27 | } 28 | if (option.dataZoom) { 29 | option.grid.bottom = '18%'; 30 | } 31 | let dom = document.getElementById(domId); 32 | let myChart = echarts.init(dom, echartTheme); 33 | myChart.showLoading(); 34 | setTimeout(function () { 35 | myChart.hideLoading(); 36 | myChart.setOption(option, true); 37 | }, 200); 38 | } -------------------------------------------------------------------------------- /resources/assets/themes/chalk.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('chalk', { 23 | "color": [ 24 | "#fc97af", 25 | "#87f7cf", 26 | "#f7f494", 27 | "#72ccff", 28 | "#f7c5a0", 29 | "#d4a4eb", 30 | "#d2f5a6", 31 | "#76f2f2" 32 | ], 33 | "backgroundColor": "rgba(41,52,65,1)", 34 | "textStyle": {}, 35 | "title": { 36 | "textStyle": { 37 | "color": "#ffffff" 38 | }, 39 | "subtextStyle": { 40 | "color": "#dddddd" 41 | } 42 | }, 43 | "line": { 44 | "itemStyle": { 45 | "normal": { 46 | "borderWidth": "4" 47 | } 48 | }, 49 | "lineStyle": { 50 | "normal": { 51 | "width": "3" 52 | } 53 | }, 54 | "symbolSize": "0", 55 | "symbol": "circle", 56 | "smooth": true 57 | }, 58 | "radar": { 59 | "itemStyle": { 60 | "normal": { 61 | "borderWidth": "4" 62 | } 63 | }, 64 | "lineStyle": { 65 | "normal": { 66 | "width": "3" 67 | } 68 | }, 69 | "symbolSize": "0", 70 | "symbol": "circle", 71 | "smooth": true 72 | }, 73 | "bar": { 74 | "itemStyle": { 75 | "normal": { 76 | "barBorderWidth": 0, 77 | "barBorderColor": "#ccc" 78 | }, 79 | "emphasis": { 80 | "barBorderWidth": 0, 81 | "barBorderColor": "#ccc" 82 | } 83 | } 84 | }, 85 | "pie": { 86 | "itemStyle": { 87 | "normal": { 88 | "borderWidth": 0, 89 | "borderColor": "#ccc" 90 | }, 91 | "emphasis": { 92 | "borderWidth": 0, 93 | "borderColor": "#ccc" 94 | } 95 | } 96 | }, 97 | "scatter": { 98 | "itemStyle": { 99 | "normal": { 100 | "borderWidth": 0, 101 | "borderColor": "#ccc" 102 | }, 103 | "emphasis": { 104 | "borderWidth": 0, 105 | "borderColor": "#ccc" 106 | } 107 | } 108 | }, 109 | "boxplot": { 110 | "itemStyle": { 111 | "normal": { 112 | "borderWidth": 0, 113 | "borderColor": "#ccc" 114 | }, 115 | "emphasis": { 116 | "borderWidth": 0, 117 | "borderColor": "#ccc" 118 | } 119 | } 120 | }, 121 | "parallel": { 122 | "itemStyle": { 123 | "normal": { 124 | "borderWidth": 0, 125 | "borderColor": "#ccc" 126 | }, 127 | "emphasis": { 128 | "borderWidth": 0, 129 | "borderColor": "#ccc" 130 | } 131 | } 132 | }, 133 | "sankey": { 134 | "itemStyle": { 135 | "normal": { 136 | "borderWidth": 0, 137 | "borderColor": "#ccc" 138 | }, 139 | "emphasis": { 140 | "borderWidth": 0, 141 | "borderColor": "#ccc" 142 | } 143 | } 144 | }, 145 | "funnel": { 146 | "itemStyle": { 147 | "normal": { 148 | "borderWidth": 0, 149 | "borderColor": "#ccc" 150 | }, 151 | "emphasis": { 152 | "borderWidth": 0, 153 | "borderColor": "#ccc" 154 | } 155 | } 156 | }, 157 | "gauge": { 158 | "itemStyle": { 159 | "normal": { 160 | "borderWidth": 0, 161 | "borderColor": "#ccc" 162 | }, 163 | "emphasis": { 164 | "borderWidth": 0, 165 | "borderColor": "#ccc" 166 | } 167 | } 168 | }, 169 | "candlestick": { 170 | "itemStyle": { 171 | "normal": { 172 | "color": "#fc97af", 173 | "color0": "transparent", 174 | "borderColor": "#fc97af", 175 | "borderColor0": "#87f7cf", 176 | "borderWidth": "2" 177 | } 178 | } 179 | }, 180 | "graph": { 181 | "itemStyle": { 182 | "normal": { 183 | "borderWidth": 0, 184 | "borderColor": "#ccc" 185 | } 186 | }, 187 | "lineStyle": { 188 | "normal": { 189 | "width": "1", 190 | "color": "#ffffff" 191 | } 192 | }, 193 | "symbolSize": "0", 194 | "symbol": "circle", 195 | "smooth": true, 196 | "color": [ 197 | "#fc97af", 198 | "#87f7cf", 199 | "#f7f494", 200 | "#72ccff", 201 | "#f7c5a0", 202 | "#d4a4eb", 203 | "#d2f5a6", 204 | "#76f2f2" 205 | ], 206 | "label": { 207 | "normal": { 208 | "textStyle": { 209 | "color": "#293441" 210 | } 211 | } 212 | } 213 | }, 214 | "map": { 215 | "itemStyle": { 216 | "normal": { 217 | "areaColor": "#f3f3f3", 218 | "borderColor": "#999999", 219 | "borderWidth": 0.5 220 | }, 221 | "emphasis": { 222 | "areaColor": "rgba(255,178,72,1)", 223 | "borderColor": "#eb8146", 224 | "borderWidth": 1 225 | } 226 | }, 227 | "label": { 228 | "normal": { 229 | "textStyle": { 230 | "color": "#893448" 231 | } 232 | }, 233 | "emphasis": { 234 | "textStyle": { 235 | "color": "rgb(137,52,72)" 236 | } 237 | } 238 | } 239 | }, 240 | "geo": { 241 | "itemStyle": { 242 | "normal": { 243 | "areaColor": "#f3f3f3", 244 | "borderColor": "#999999", 245 | "borderWidth": 0.5 246 | }, 247 | "emphasis": { 248 | "areaColor": "rgba(255,178,72,1)", 249 | "borderColor": "#eb8146", 250 | "borderWidth": 1 251 | } 252 | }, 253 | "label": { 254 | "normal": { 255 | "textStyle": { 256 | "color": "#893448" 257 | } 258 | }, 259 | "emphasis": { 260 | "textStyle": { 261 | "color": "rgb(137,52,72)" 262 | } 263 | } 264 | } 265 | }, 266 | "categoryAxis": { 267 | "axisLine": { 268 | "show": true, 269 | "lineStyle": { 270 | "color": "#666666" 271 | } 272 | }, 273 | "axisTick": { 274 | "show": false, 275 | "lineStyle": { 276 | "color": "#333" 277 | } 278 | }, 279 | "axisLabel": { 280 | "show": true, 281 | "textStyle": { 282 | "color": "#aaaaaa" 283 | } 284 | }, 285 | "splitLine": { 286 | "show": false, 287 | "lineStyle": { 288 | "color": [ 289 | "#e6e6e6" 290 | ] 291 | } 292 | }, 293 | "splitArea": { 294 | "show": false, 295 | "areaStyle": { 296 | "color": [ 297 | "rgba(250,250,250,0.05)", 298 | "rgba(200,200,200,0.02)" 299 | ] 300 | } 301 | } 302 | }, 303 | "valueAxis": { 304 | "axisLine": { 305 | "show": true, 306 | "lineStyle": { 307 | "color": "#666666" 308 | } 309 | }, 310 | "axisTick": { 311 | "show": false, 312 | "lineStyle": { 313 | "color": "#333" 314 | } 315 | }, 316 | "axisLabel": { 317 | "show": true, 318 | "textStyle": { 319 | "color": "#aaaaaa" 320 | } 321 | }, 322 | "splitLine": { 323 | "show": false, 324 | "lineStyle": { 325 | "color": [ 326 | "#e6e6e6" 327 | ] 328 | } 329 | }, 330 | "splitArea": { 331 | "show": false, 332 | "areaStyle": { 333 | "color": [ 334 | "rgba(250,250,250,0.05)", 335 | "rgba(200,200,200,0.02)" 336 | ] 337 | } 338 | } 339 | }, 340 | "logAxis": { 341 | "axisLine": { 342 | "show": true, 343 | "lineStyle": { 344 | "color": "#666666" 345 | } 346 | }, 347 | "axisTick": { 348 | "show": false, 349 | "lineStyle": { 350 | "color": "#333" 351 | } 352 | }, 353 | "axisLabel": { 354 | "show": true, 355 | "textStyle": { 356 | "color": "#aaaaaa" 357 | } 358 | }, 359 | "splitLine": { 360 | "show": false, 361 | "lineStyle": { 362 | "color": [ 363 | "#e6e6e6" 364 | ] 365 | } 366 | }, 367 | "splitArea": { 368 | "show": false, 369 | "areaStyle": { 370 | "color": [ 371 | "rgba(250,250,250,0.05)", 372 | "rgba(200,200,200,0.02)" 373 | ] 374 | } 375 | } 376 | }, 377 | "timeAxis": { 378 | "axisLine": { 379 | "show": true, 380 | "lineStyle": { 381 | "color": "#666666" 382 | } 383 | }, 384 | "axisTick": { 385 | "show": false, 386 | "lineStyle": { 387 | "color": "#333" 388 | } 389 | }, 390 | "axisLabel": { 391 | "show": true, 392 | "textStyle": { 393 | "color": "#aaaaaa" 394 | } 395 | }, 396 | "splitLine": { 397 | "show": false, 398 | "lineStyle": { 399 | "color": [ 400 | "#e6e6e6" 401 | ] 402 | } 403 | }, 404 | "splitArea": { 405 | "show": false, 406 | "areaStyle": { 407 | "color": [ 408 | "rgba(250,250,250,0.05)", 409 | "rgba(200,200,200,0.02)" 410 | ] 411 | } 412 | } 413 | }, 414 | "toolbox": { 415 | "iconStyle": { 416 | "normal": { 417 | "borderColor": "#999999" 418 | }, 419 | "emphasis": { 420 | "borderColor": "#666666" 421 | } 422 | } 423 | }, 424 | "legend": { 425 | "textStyle": { 426 | "color": "#999999" 427 | } 428 | }, 429 | "tooltip": { 430 | "axisPointer": { 431 | "lineStyle": { 432 | "color": "#cccccc", 433 | "width": 1 434 | }, 435 | "crossStyle": { 436 | "color": "#cccccc", 437 | "width": 1 438 | } 439 | } 440 | }, 441 | "timeline": { 442 | "lineStyle": { 443 | "color": "#87f7cf", 444 | "width": 1 445 | }, 446 | "itemStyle": { 447 | "normal": { 448 | "color": "#87f7cf", 449 | "borderWidth": 1 450 | }, 451 | "emphasis": { 452 | "color": "#f7f494" 453 | } 454 | }, 455 | "controlStyle": { 456 | "normal": { 457 | "color": "#87f7cf", 458 | "borderColor": "#87f7cf", 459 | "borderWidth": 0.5 460 | }, 461 | "emphasis": { 462 | "color": "#87f7cf", 463 | "borderColor": "#87f7cf", 464 | "borderWidth": 0.5 465 | } 466 | }, 467 | "checkpointStyle": { 468 | "color": "#fc97af", 469 | "borderColor": "rgba(252,151,175,0.3)" 470 | }, 471 | "label": { 472 | "normal": { 473 | "textStyle": { 474 | "color": "#87f7cf" 475 | } 476 | }, 477 | "emphasis": { 478 | "textStyle": { 479 | "color": "#87f7cf" 480 | } 481 | } 482 | } 483 | }, 484 | "visualMap": { 485 | "color": [ 486 | "#fc97af", 487 | "#87f7cf" 488 | ] 489 | }, 490 | "dataZoom": { 491 | "backgroundColor": "rgba(255,255,255,0)", 492 | "dataBackgroundColor": "rgba(114,204,255,1)", 493 | "fillerColor": "rgba(114,204,255,0.2)", 494 | "handleColor": "#72ccff", 495 | "handleSize": "100%", 496 | "textStyle": { 497 | "color": "#333333" 498 | } 499 | }, 500 | "markPoint": { 501 | "label": { 502 | "normal": { 503 | "textStyle": { 504 | "color": "#293441" 505 | } 506 | }, 507 | "emphasis": { 508 | "textStyle": { 509 | "color": "#293441" 510 | } 511 | } 512 | } 513 | } 514 | }); 515 | })); 516 | -------------------------------------------------------------------------------- /resources/assets/themes/dark.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('dark', { 23 | "color": [ 24 | "#dd6b66", 25 | "#759aa0", 26 | "#e69d87", 27 | "#8dc1a9", 28 | "#ea7e53", 29 | "#eedd78", 30 | "#73a373", 31 | "#73b9bc", 32 | "#7289ab", 33 | "#91ca8c", 34 | "#f49f42" 35 | ], 36 | "backgroundColor": "rgba(51,51,51,1)", 37 | "textStyle": {}, 38 | "title": { 39 | "textStyle": { 40 | "color": "#eeeeee" 41 | }, 42 | "subtextStyle": { 43 | "color": "#aaaaaa" 44 | } 45 | }, 46 | "line": { 47 | "itemStyle": { 48 | "normal": { 49 | "borderWidth": 1 50 | } 51 | }, 52 | "lineStyle": { 53 | "normal": { 54 | "width": 2 55 | } 56 | }, 57 | "symbolSize": 4, 58 | "symbol": "circle", 59 | "smooth": false 60 | }, 61 | "radar": { 62 | "itemStyle": { 63 | "normal": { 64 | "borderWidth": 1 65 | } 66 | }, 67 | "lineStyle": { 68 | "normal": { 69 | "width": 2 70 | } 71 | }, 72 | "symbolSize": 4, 73 | "symbol": "circle", 74 | "smooth": false 75 | }, 76 | "bar": { 77 | "itemStyle": { 78 | "normal": { 79 | "barBorderWidth": 0, 80 | "barBorderColor": "#ccc" 81 | }, 82 | "emphasis": { 83 | "barBorderWidth": 0, 84 | "barBorderColor": "#ccc" 85 | } 86 | } 87 | }, 88 | "pie": { 89 | "itemStyle": { 90 | "normal": { 91 | "borderWidth": 0, 92 | "borderColor": "#ccc" 93 | }, 94 | "emphasis": { 95 | "borderWidth": 0, 96 | "borderColor": "#ccc" 97 | } 98 | } 99 | }, 100 | "scatter": { 101 | "itemStyle": { 102 | "normal": { 103 | "borderWidth": 0, 104 | "borderColor": "#ccc" 105 | }, 106 | "emphasis": { 107 | "borderWidth": 0, 108 | "borderColor": "#ccc" 109 | } 110 | } 111 | }, 112 | "boxplot": { 113 | "itemStyle": { 114 | "normal": { 115 | "borderWidth": 0, 116 | "borderColor": "#ccc" 117 | }, 118 | "emphasis": { 119 | "borderWidth": 0, 120 | "borderColor": "#ccc" 121 | } 122 | } 123 | }, 124 | "parallel": { 125 | "itemStyle": { 126 | "normal": { 127 | "borderWidth": 0, 128 | "borderColor": "#ccc" 129 | }, 130 | "emphasis": { 131 | "borderWidth": 0, 132 | "borderColor": "#ccc" 133 | } 134 | } 135 | }, 136 | "sankey": { 137 | "itemStyle": { 138 | "normal": { 139 | "borderWidth": 0, 140 | "borderColor": "#ccc" 141 | }, 142 | "emphasis": { 143 | "borderWidth": 0, 144 | "borderColor": "#ccc" 145 | } 146 | } 147 | }, 148 | "funnel": { 149 | "itemStyle": { 150 | "normal": { 151 | "borderWidth": 0, 152 | "borderColor": "#ccc" 153 | }, 154 | "emphasis": { 155 | "borderWidth": 0, 156 | "borderColor": "#ccc" 157 | } 158 | } 159 | }, 160 | "gauge": { 161 | "itemStyle": { 162 | "normal": { 163 | "borderWidth": 0, 164 | "borderColor": "#ccc" 165 | }, 166 | "emphasis": { 167 | "borderWidth": 0, 168 | "borderColor": "#ccc" 169 | } 170 | } 171 | }, 172 | "candlestick": { 173 | "itemStyle": { 174 | "normal": { 175 | "color": "#fd1050", 176 | "color0": "#0cf49b", 177 | "borderColor": "#fd1050", 178 | "borderColor0": "#0cf49b", 179 | "borderWidth": 1 180 | } 181 | } 182 | }, 183 | "graph": { 184 | "itemStyle": { 185 | "normal": { 186 | "borderWidth": 0, 187 | "borderColor": "#ccc" 188 | } 189 | }, 190 | "lineStyle": { 191 | "normal": { 192 | "width": 1, 193 | "color": "#aaaaaa" 194 | } 195 | }, 196 | "symbolSize": 4, 197 | "symbol": "circle", 198 | "smooth": false, 199 | "color": [ 200 | "#dd6b66", 201 | "#759aa0", 202 | "#e69d87", 203 | "#8dc1a9", 204 | "#ea7e53", 205 | "#eedd78", 206 | "#73a373", 207 | "#73b9bc", 208 | "#7289ab", 209 | "#91ca8c", 210 | "#f49f42" 211 | ], 212 | "label": { 213 | "normal": { 214 | "textStyle": { 215 | "color": "#eeeeee" 216 | } 217 | } 218 | } 219 | }, 220 | "map": { 221 | "itemStyle": { 222 | "normal": { 223 | "areaColor": "#eeeeee", 224 | "borderColor": "#444444", 225 | "borderWidth": 0.5 226 | }, 227 | "emphasis": { 228 | "areaColor": "rgba(255,215,0,0.8)", 229 | "borderColor": "#444444", 230 | "borderWidth": 1 231 | } 232 | }, 233 | "label": { 234 | "normal": { 235 | "textStyle": { 236 | "color": "#000000" 237 | } 238 | }, 239 | "emphasis": { 240 | "textStyle": { 241 | "color": "rgb(100,0,0)" 242 | } 243 | } 244 | } 245 | }, 246 | "geo": { 247 | "itemStyle": { 248 | "normal": { 249 | "areaColor": "#eeeeee", 250 | "borderColor": "#444444", 251 | "borderWidth": 0.5 252 | }, 253 | "emphasis": { 254 | "areaColor": "rgba(255,215,0,0.8)", 255 | "borderColor": "#444444", 256 | "borderWidth": 1 257 | } 258 | }, 259 | "label": { 260 | "normal": { 261 | "textStyle": { 262 | "color": "#000000" 263 | } 264 | }, 265 | "emphasis": { 266 | "textStyle": { 267 | "color": "rgb(100,0,0)" 268 | } 269 | } 270 | } 271 | }, 272 | "categoryAxis": { 273 | "axisLine": { 274 | "show": true, 275 | "lineStyle": { 276 | "color": "#eeeeee" 277 | } 278 | }, 279 | "axisTick": { 280 | "show": true, 281 | "lineStyle": { 282 | "color": "#eeeeee" 283 | } 284 | }, 285 | "axisLabel": { 286 | "show": true, 287 | "textStyle": { 288 | "color": "#eeeeee" 289 | } 290 | }, 291 | "splitLine": { 292 | "show": true, 293 | "lineStyle": { 294 | "color": [ 295 | "#aaaaaa" 296 | ] 297 | } 298 | }, 299 | "splitArea": { 300 | "show": false, 301 | "areaStyle": { 302 | "color": [ 303 | "#eeeeee" 304 | ] 305 | } 306 | } 307 | }, 308 | "valueAxis": { 309 | "axisLine": { 310 | "show": true, 311 | "lineStyle": { 312 | "color": "#eeeeee" 313 | } 314 | }, 315 | "axisTick": { 316 | "show": true, 317 | "lineStyle": { 318 | "color": "#eeeeee" 319 | } 320 | }, 321 | "axisLabel": { 322 | "show": true, 323 | "textStyle": { 324 | "color": "#eeeeee" 325 | } 326 | }, 327 | "splitLine": { 328 | "show": true, 329 | "lineStyle": { 330 | "color": [ 331 | "#aaaaaa" 332 | ] 333 | } 334 | }, 335 | "splitArea": { 336 | "show": false, 337 | "areaStyle": { 338 | "color": [ 339 | "#eeeeee" 340 | ] 341 | } 342 | } 343 | }, 344 | "logAxis": { 345 | "axisLine": { 346 | "show": true, 347 | "lineStyle": { 348 | "color": "#eeeeee" 349 | } 350 | }, 351 | "axisTick": { 352 | "show": true, 353 | "lineStyle": { 354 | "color": "#eeeeee" 355 | } 356 | }, 357 | "axisLabel": { 358 | "show": true, 359 | "textStyle": { 360 | "color": "#eeeeee" 361 | } 362 | }, 363 | "splitLine": { 364 | "show": true, 365 | "lineStyle": { 366 | "color": [ 367 | "#aaaaaa" 368 | ] 369 | } 370 | }, 371 | "splitArea": { 372 | "show": false, 373 | "areaStyle": { 374 | "color": [ 375 | "#eeeeee" 376 | ] 377 | } 378 | } 379 | }, 380 | "timeAxis": { 381 | "axisLine": { 382 | "show": true, 383 | "lineStyle": { 384 | "color": "#eeeeee" 385 | } 386 | }, 387 | "axisTick": { 388 | "show": true, 389 | "lineStyle": { 390 | "color": "#eeeeee" 391 | } 392 | }, 393 | "axisLabel": { 394 | "show": true, 395 | "textStyle": { 396 | "color": "#eeeeee" 397 | } 398 | }, 399 | "splitLine": { 400 | "show": true, 401 | "lineStyle": { 402 | "color": [ 403 | "#aaaaaa" 404 | ] 405 | } 406 | }, 407 | "splitArea": { 408 | "show": false, 409 | "areaStyle": { 410 | "color": [ 411 | "#eeeeee" 412 | ] 413 | } 414 | } 415 | }, 416 | "toolbox": { 417 | "iconStyle": { 418 | "normal": { 419 | "borderColor": "#999999" 420 | }, 421 | "emphasis": { 422 | "borderColor": "#666666" 423 | } 424 | } 425 | }, 426 | "legend": { 427 | "textStyle": { 428 | "color": "#eeeeee" 429 | } 430 | }, 431 | "tooltip": { 432 | "axisPointer": { 433 | "lineStyle": { 434 | "color": "#eeeeee", 435 | "width": "1" 436 | }, 437 | "crossStyle": { 438 | "color": "#eeeeee", 439 | "width": "1" 440 | } 441 | } 442 | }, 443 | "timeline": { 444 | "lineStyle": { 445 | "color": "#eeeeee", 446 | "width": 1 447 | }, 448 | "itemStyle": { 449 | "normal": { 450 | "color": "#dd6b66", 451 | "borderWidth": 1 452 | }, 453 | "emphasis": { 454 | "color": "#a9334c" 455 | } 456 | }, 457 | "controlStyle": { 458 | "normal": { 459 | "color": "#eeeeee", 460 | "borderColor": "#eeeeee", 461 | "borderWidth": 0.5 462 | }, 463 | "emphasis": { 464 | "color": "#eeeeee", 465 | "borderColor": "#eeeeee", 466 | "borderWidth": 0.5 467 | } 468 | }, 469 | "checkpointStyle": { 470 | "color": "#e43c59", 471 | "borderColor": "rgba(194,53,49,0.5)" 472 | }, 473 | "label": { 474 | "normal": { 475 | "textStyle": { 476 | "color": "#eeeeee" 477 | } 478 | }, 479 | "emphasis": { 480 | "textStyle": { 481 | "color": "#eeeeee" 482 | } 483 | } 484 | } 485 | }, 486 | "visualMap": { 487 | "color": [ 488 | "#bf444c", 489 | "#d88273", 490 | "#f6efa6" 491 | ] 492 | }, 493 | "dataZoom": { 494 | "backgroundColor": "rgba(47,69,84,0)", 495 | "dataBackgroundColor": "rgba(255,255,255,0.3)", 496 | "fillerColor": "rgba(167,183,204,0.4)", 497 | "handleColor": "#a7b7cc", 498 | "handleSize": "100%", 499 | "textStyle": { 500 | "color": "#eeeeee" 501 | } 502 | }, 503 | "markPoint": { 504 | "label": { 505 | "normal": { 506 | "textStyle": { 507 | "color": "#eeeeee" 508 | } 509 | }, 510 | "emphasis": { 511 | "textStyle": { 512 | "color": "#eeeeee" 513 | } 514 | } 515 | } 516 | } 517 | }); 518 | })); 519 | -------------------------------------------------------------------------------- /resources/assets/themes/infographic.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('infographic', { 23 | "color": [ 24 | "#c1232b", 25 | "#27727b", 26 | "#fcce10", 27 | "#e87c25", 28 | "#b5c334", 29 | "#fe8463", 30 | "#9bca63", 31 | "#fad860", 32 | "#f3a43b", 33 | "#60c0dd", 34 | "#d7504b", 35 | "#c6e579", 36 | "#f4e001", 37 | "#f0805a", 38 | "#26c0c0" 39 | ], 40 | "backgroundColor": "rgba(0,0,0,0)", 41 | "textStyle": {}, 42 | "title": { 43 | "textStyle": { 44 | "color": "#27727b" 45 | }, 46 | "subtextStyle": { 47 | "color": "#aaaaaa" 48 | } 49 | }, 50 | "line": { 51 | "itemStyle": { 52 | "normal": { 53 | "borderWidth": 1 54 | } 55 | }, 56 | "lineStyle": { 57 | "normal": { 58 | "width": "3" 59 | } 60 | }, 61 | "symbolSize": "5", 62 | "symbol": "emptyCircle", 63 | "smooth": false 64 | }, 65 | "radar": { 66 | "itemStyle": { 67 | "normal": { 68 | "borderWidth": 1 69 | } 70 | }, 71 | "lineStyle": { 72 | "normal": { 73 | "width": "3" 74 | } 75 | }, 76 | "symbolSize": "5", 77 | "symbol": "emptyCircle", 78 | "smooth": false 79 | }, 80 | "bar": { 81 | "itemStyle": { 82 | "normal": { 83 | "barBorderWidth": 0, 84 | "barBorderColor": "#ccc" 85 | }, 86 | "emphasis": { 87 | "barBorderWidth": 0, 88 | "barBorderColor": "#ccc" 89 | } 90 | } 91 | }, 92 | "pie": { 93 | "itemStyle": { 94 | "normal": { 95 | "borderWidth": 0, 96 | "borderColor": "#ccc" 97 | }, 98 | "emphasis": { 99 | "borderWidth": 0, 100 | "borderColor": "#ccc" 101 | } 102 | } 103 | }, 104 | "scatter": { 105 | "itemStyle": { 106 | "normal": { 107 | "borderWidth": 0, 108 | "borderColor": "#ccc" 109 | }, 110 | "emphasis": { 111 | "borderWidth": 0, 112 | "borderColor": "#ccc" 113 | } 114 | } 115 | }, 116 | "boxplot": { 117 | "itemStyle": { 118 | "normal": { 119 | "borderWidth": 0, 120 | "borderColor": "#ccc" 121 | }, 122 | "emphasis": { 123 | "borderWidth": 0, 124 | "borderColor": "#ccc" 125 | } 126 | } 127 | }, 128 | "parallel": { 129 | "itemStyle": { 130 | "normal": { 131 | "borderWidth": 0, 132 | "borderColor": "#ccc" 133 | }, 134 | "emphasis": { 135 | "borderWidth": 0, 136 | "borderColor": "#ccc" 137 | } 138 | } 139 | }, 140 | "sankey": { 141 | "itemStyle": { 142 | "normal": { 143 | "borderWidth": 0, 144 | "borderColor": "#ccc" 145 | }, 146 | "emphasis": { 147 | "borderWidth": 0, 148 | "borderColor": "#ccc" 149 | } 150 | } 151 | }, 152 | "funnel": { 153 | "itemStyle": { 154 | "normal": { 155 | "borderWidth": 0, 156 | "borderColor": "#ccc" 157 | }, 158 | "emphasis": { 159 | "borderWidth": 0, 160 | "borderColor": "#ccc" 161 | } 162 | } 163 | }, 164 | "gauge": { 165 | "itemStyle": { 166 | "normal": { 167 | "borderWidth": 0, 168 | "borderColor": "#ccc" 169 | }, 170 | "emphasis": { 171 | "borderWidth": 0, 172 | "borderColor": "#ccc" 173 | } 174 | } 175 | }, 176 | "candlestick": { 177 | "itemStyle": { 178 | "normal": { 179 | "color": "#c1232b", 180 | "color0": "#b5c334", 181 | "borderColor": "#c1232b", 182 | "borderColor0": "#b5c334", 183 | "borderWidth": 1 184 | } 185 | } 186 | }, 187 | "graph": { 188 | "itemStyle": { 189 | "normal": { 190 | "borderWidth": 0, 191 | "borderColor": "#ccc" 192 | } 193 | }, 194 | "lineStyle": { 195 | "normal": { 196 | "width": 1, 197 | "color": "#aaaaaa" 198 | } 199 | }, 200 | "symbolSize": "5", 201 | "symbol": "emptyCircle", 202 | "smooth": false, 203 | "color": [ 204 | "#c1232b", 205 | "#27727b", 206 | "#fcce10", 207 | "#e87c25", 208 | "#b5c334", 209 | "#fe8463", 210 | "#9bca63", 211 | "#fad860", 212 | "#f3a43b", 213 | "#60c0dd", 214 | "#d7504b", 215 | "#c6e579", 216 | "#f4e001", 217 | "#f0805a", 218 | "#26c0c0" 219 | ], 220 | "label": { 221 | "normal": { 222 | "textStyle": { 223 | "color": "#eeeeee" 224 | } 225 | } 226 | } 227 | }, 228 | "map": { 229 | "itemStyle": { 230 | "normal": { 231 | "areaColor": "#dddddd", 232 | "borderColor": "#eeeeee", 233 | "borderWidth": 0.5 234 | }, 235 | "emphasis": { 236 | "areaColor": "rgba(254,153,78,1)", 237 | "borderColor": "#444444", 238 | "borderWidth": 1 239 | } 240 | }, 241 | "label": { 242 | "normal": { 243 | "textStyle": { 244 | "color": "#c1232b" 245 | } 246 | }, 247 | "emphasis": { 248 | "textStyle": { 249 | "color": "rgb(100,0,0)" 250 | } 251 | } 252 | } 253 | }, 254 | "geo": { 255 | "itemStyle": { 256 | "normal": { 257 | "areaColor": "#dddddd", 258 | "borderColor": "#eeeeee", 259 | "borderWidth": 0.5 260 | }, 261 | "emphasis": { 262 | "areaColor": "rgba(254,153,78,1)", 263 | "borderColor": "#444444", 264 | "borderWidth": 1 265 | } 266 | }, 267 | "label": { 268 | "normal": { 269 | "textStyle": { 270 | "color": "#c1232b" 271 | } 272 | }, 273 | "emphasis": { 274 | "textStyle": { 275 | "color": "rgb(100,0,0)" 276 | } 277 | } 278 | } 279 | }, 280 | "categoryAxis": { 281 | "axisLine": { 282 | "show": true, 283 | "lineStyle": { 284 | "color": "#27727b" 285 | } 286 | }, 287 | "axisTick": { 288 | "show": true, 289 | "lineStyle": { 290 | "color": "#27727b" 291 | } 292 | }, 293 | "axisLabel": { 294 | "show": true, 295 | "textStyle": { 296 | "color": "#333" 297 | } 298 | }, 299 | "splitLine": { 300 | "show": false, 301 | "lineStyle": { 302 | "color": [ 303 | "#ccc" 304 | ] 305 | } 306 | }, 307 | "splitArea": { 308 | "show": false, 309 | "areaStyle": { 310 | "color": [ 311 | "rgba(250,250,250,0.3)", 312 | "rgba(200,200,200,0.3)" 313 | ] 314 | } 315 | } 316 | }, 317 | "valueAxis": { 318 | "axisLine": { 319 | "show": false, 320 | "lineStyle": { 321 | "color": "#333" 322 | } 323 | }, 324 | "axisTick": { 325 | "show": false, 326 | "lineStyle": { 327 | "color": "#333" 328 | } 329 | }, 330 | "axisLabel": { 331 | "show": true, 332 | "textStyle": { 333 | "color": "#333" 334 | } 335 | }, 336 | "splitLine": { 337 | "show": true, 338 | "lineStyle": { 339 | "color": [ 340 | "#ccc" 341 | ] 342 | } 343 | }, 344 | "splitArea": { 345 | "show": false, 346 | "areaStyle": { 347 | "color": [ 348 | "rgba(250,250,250,0.3)", 349 | "rgba(200,200,200,0.3)" 350 | ] 351 | } 352 | } 353 | }, 354 | "logAxis": { 355 | "axisLine": { 356 | "show": true, 357 | "lineStyle": { 358 | "color": "#27727b" 359 | } 360 | }, 361 | "axisTick": { 362 | "show": true, 363 | "lineStyle": { 364 | "color": "#333" 365 | } 366 | }, 367 | "axisLabel": { 368 | "show": true, 369 | "textStyle": { 370 | "color": "#333" 371 | } 372 | }, 373 | "splitLine": { 374 | "show": true, 375 | "lineStyle": { 376 | "color": [ 377 | "#ccc" 378 | ] 379 | } 380 | }, 381 | "splitArea": { 382 | "show": false, 383 | "areaStyle": { 384 | "color": [ 385 | "rgba(250,250,250,0.3)", 386 | "rgba(200,200,200,0.3)" 387 | ] 388 | } 389 | } 390 | }, 391 | "timeAxis": { 392 | "axisLine": { 393 | "show": true, 394 | "lineStyle": { 395 | "color": "#27727b" 396 | } 397 | }, 398 | "axisTick": { 399 | "show": true, 400 | "lineStyle": { 401 | "color": "#333" 402 | } 403 | }, 404 | "axisLabel": { 405 | "show": true, 406 | "textStyle": { 407 | "color": "#333" 408 | } 409 | }, 410 | "splitLine": { 411 | "show": true, 412 | "lineStyle": { 413 | "color": [ 414 | "#ccc" 415 | ] 416 | } 417 | }, 418 | "splitArea": { 419 | "show": false, 420 | "areaStyle": { 421 | "color": [ 422 | "rgba(250,250,250,0.3)", 423 | "rgba(200,200,200,0.3)" 424 | ] 425 | } 426 | } 427 | }, 428 | "toolbox": { 429 | "iconStyle": { 430 | "normal": { 431 | "borderColor": "#c1232b" 432 | }, 433 | "emphasis": { 434 | "borderColor": "#e87c25" 435 | } 436 | } 437 | }, 438 | "legend": { 439 | "textStyle": { 440 | "color": "#333333" 441 | } 442 | }, 443 | "tooltip": { 444 | "axisPointer": { 445 | "lineStyle": { 446 | "color": "#27727b", 447 | "width": 1 448 | }, 449 | "crossStyle": { 450 | "color": "#27727b", 451 | "width": 1 452 | } 453 | } 454 | }, 455 | "timeline": { 456 | "lineStyle": { 457 | "color": "#293c55", 458 | "width": 1 459 | }, 460 | "itemStyle": { 461 | "normal": { 462 | "color": "#27727b", 463 | "borderWidth": 1 464 | }, 465 | "emphasis": { 466 | "color": "#72d4e0" 467 | } 468 | }, 469 | "controlStyle": { 470 | "normal": { 471 | "color": "#27727b", 472 | "borderColor": "#27727b", 473 | "borderWidth": 0.5 474 | }, 475 | "emphasis": { 476 | "color": "#27727b", 477 | "borderColor": "#27727b", 478 | "borderWidth": 0.5 479 | } 480 | }, 481 | "checkpointStyle": { 482 | "color": "#c1232b", 483 | "borderColor": "rgba(194,53,49,0.5)" 484 | }, 485 | "label": { 486 | "normal": { 487 | "textStyle": { 488 | "color": "#293c55" 489 | } 490 | }, 491 | "emphasis": { 492 | "textStyle": { 493 | "color": "#293c55" 494 | } 495 | } 496 | } 497 | }, 498 | "visualMap": { 499 | "color": [ 500 | "#c1232b", 501 | "#fcce10" 502 | ] 503 | }, 504 | "dataZoom": { 505 | "backgroundColor": "rgba(0,0,0,0)", 506 | "dataBackgroundColor": "rgba(181,195,52,0.3)", 507 | "fillerColor": "rgba(181,195,52,0.2)", 508 | "handleColor": "#27727b", 509 | "handleSize": "100%", 510 | "textStyle": { 511 | "color": "#999999" 512 | } 513 | }, 514 | "markPoint": { 515 | "label": { 516 | "normal": { 517 | "textStyle": { 518 | "color": "#eeeeee" 519 | } 520 | }, 521 | "emphasis": { 522 | "textStyle": { 523 | "color": "#eeeeee" 524 | } 525 | } 526 | } 527 | } 528 | }); 529 | })); 530 | -------------------------------------------------------------------------------- /resources/assets/themes/macarons.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('macarons', { 23 | "color": [ 24 | "#2ec7c9", 25 | "#b6a2de", 26 | "#5ab1ef", 27 | "#ffb980", 28 | "#d87a80", 29 | "#8d98b3", 30 | "#e5cf0d", 31 | "#97b552", 32 | "#95706d", 33 | "#dc69aa", 34 | "#07a2a4", 35 | "#9a7fd1", 36 | "#588dd5", 37 | "#f5994e", 38 | "#c05050", 39 | "#59678c", 40 | "#c9ab00", 41 | "#7eb00a", 42 | "#6f5553", 43 | "#c14089" 44 | ], 45 | "backgroundColor": "rgba(0,0,0,0)", 46 | "textStyle": {}, 47 | "title": { 48 | "textStyle": { 49 | "color": "#008acd" 50 | }, 51 | "subtextStyle": { 52 | "color": "#aaaaaa" 53 | } 54 | }, 55 | "line": { 56 | "itemStyle": { 57 | "normal": { 58 | "borderWidth": 1 59 | } 60 | }, 61 | "lineStyle": { 62 | "normal": { 63 | "width": 2 64 | } 65 | }, 66 | "symbolSize": 3, 67 | "symbol": "emptyCircle", 68 | "smooth": true 69 | }, 70 | "radar": { 71 | "itemStyle": { 72 | "normal": { 73 | "borderWidth": 1 74 | } 75 | }, 76 | "lineStyle": { 77 | "normal": { 78 | "width": 2 79 | } 80 | }, 81 | "symbolSize": 3, 82 | "symbol": "emptyCircle", 83 | "smooth": true 84 | }, 85 | "bar": { 86 | "itemStyle": { 87 | "normal": { 88 | "barBorderWidth": 0, 89 | "barBorderColor": "#ccc" 90 | }, 91 | "emphasis": { 92 | "barBorderWidth": 0, 93 | "barBorderColor": "#ccc" 94 | } 95 | } 96 | }, 97 | "pie": { 98 | "itemStyle": { 99 | "normal": { 100 | "borderWidth": 0, 101 | "borderColor": "#ccc" 102 | }, 103 | "emphasis": { 104 | "borderWidth": 0, 105 | "borderColor": "#ccc" 106 | } 107 | } 108 | }, 109 | "scatter": { 110 | "itemStyle": { 111 | "normal": { 112 | "borderWidth": 0, 113 | "borderColor": "#ccc" 114 | }, 115 | "emphasis": { 116 | "borderWidth": 0, 117 | "borderColor": "#ccc" 118 | } 119 | } 120 | }, 121 | "boxplot": { 122 | "itemStyle": { 123 | "normal": { 124 | "borderWidth": 0, 125 | "borderColor": "#ccc" 126 | }, 127 | "emphasis": { 128 | "borderWidth": 0, 129 | "borderColor": "#ccc" 130 | } 131 | } 132 | }, 133 | "parallel": { 134 | "itemStyle": { 135 | "normal": { 136 | "borderWidth": 0, 137 | "borderColor": "#ccc" 138 | }, 139 | "emphasis": { 140 | "borderWidth": 0, 141 | "borderColor": "#ccc" 142 | } 143 | } 144 | }, 145 | "sankey": { 146 | "itemStyle": { 147 | "normal": { 148 | "borderWidth": 0, 149 | "borderColor": "#ccc" 150 | }, 151 | "emphasis": { 152 | "borderWidth": 0, 153 | "borderColor": "#ccc" 154 | } 155 | } 156 | }, 157 | "funnel": { 158 | "itemStyle": { 159 | "normal": { 160 | "borderWidth": 0, 161 | "borderColor": "#ccc" 162 | }, 163 | "emphasis": { 164 | "borderWidth": 0, 165 | "borderColor": "#ccc" 166 | } 167 | } 168 | }, 169 | "gauge": { 170 | "itemStyle": { 171 | "normal": { 172 | "borderWidth": 0, 173 | "borderColor": "#ccc" 174 | }, 175 | "emphasis": { 176 | "borderWidth": 0, 177 | "borderColor": "#ccc" 178 | } 179 | } 180 | }, 181 | "candlestick": { 182 | "itemStyle": { 183 | "normal": { 184 | "color": "#d87a80", 185 | "color0": "#2ec7c9", 186 | "borderColor": "#d87a80", 187 | "borderColor0": "#2ec7c9", 188 | "borderWidth": 1 189 | } 190 | } 191 | }, 192 | "graph": { 193 | "itemStyle": { 194 | "normal": { 195 | "borderWidth": 0, 196 | "borderColor": "#ccc" 197 | } 198 | }, 199 | "lineStyle": { 200 | "normal": { 201 | "width": 1, 202 | "color": "#aaaaaa" 203 | } 204 | }, 205 | "symbolSize": 3, 206 | "symbol": "emptyCircle", 207 | "smooth": true, 208 | "color": [ 209 | "#2ec7c9", 210 | "#b6a2de", 211 | "#5ab1ef", 212 | "#ffb980", 213 | "#d87a80", 214 | "#8d98b3", 215 | "#e5cf0d", 216 | "#97b552", 217 | "#95706d", 218 | "#dc69aa", 219 | "#07a2a4", 220 | "#9a7fd1", 221 | "#588dd5", 222 | "#f5994e", 223 | "#c05050", 224 | "#59678c", 225 | "#c9ab00", 226 | "#7eb00a", 227 | "#6f5553", 228 | "#c14089" 229 | ], 230 | "label": { 231 | "normal": { 232 | "textStyle": { 233 | "color": "#eeeeee" 234 | } 235 | } 236 | } 237 | }, 238 | "map": { 239 | "itemStyle": { 240 | "normal": { 241 | "areaColor": "#dddddd", 242 | "borderColor": "#eeeeee", 243 | "borderWidth": 0.5 244 | }, 245 | "emphasis": { 246 | "areaColor": "rgba(254,153,78,1)", 247 | "borderColor": "#444444", 248 | "borderWidth": 1 249 | } 250 | }, 251 | "label": { 252 | "normal": { 253 | "textStyle": { 254 | "color": "#d87a80" 255 | } 256 | }, 257 | "emphasis": { 258 | "textStyle": { 259 | "color": "rgb(100,0,0)" 260 | } 261 | } 262 | } 263 | }, 264 | "geo": { 265 | "itemStyle": { 266 | "normal": { 267 | "areaColor": "#dddddd", 268 | "borderColor": "#eeeeee", 269 | "borderWidth": 0.5 270 | }, 271 | "emphasis": { 272 | "areaColor": "rgba(254,153,78,1)", 273 | "borderColor": "#444444", 274 | "borderWidth": 1 275 | } 276 | }, 277 | "label": { 278 | "normal": { 279 | "textStyle": { 280 | "color": "#d87a80" 281 | } 282 | }, 283 | "emphasis": { 284 | "textStyle": { 285 | "color": "rgb(100,0,0)" 286 | } 287 | } 288 | } 289 | }, 290 | "categoryAxis": { 291 | "axisLine": { 292 | "show": true, 293 | "lineStyle": { 294 | "color": "#008acd" 295 | } 296 | }, 297 | "axisTick": { 298 | "show": true, 299 | "lineStyle": { 300 | "color": "#333" 301 | } 302 | }, 303 | "axisLabel": { 304 | "show": true, 305 | "textStyle": { 306 | "color": "#333" 307 | } 308 | }, 309 | "splitLine": { 310 | "show": false, 311 | "lineStyle": { 312 | "color": [ 313 | "#eee" 314 | ] 315 | } 316 | }, 317 | "splitArea": { 318 | "show": false, 319 | "areaStyle": { 320 | "color": [ 321 | "rgba(250,250,250,0.3)", 322 | "rgba(200,200,200,0.3)" 323 | ] 324 | } 325 | } 326 | }, 327 | "valueAxis": { 328 | "axisLine": { 329 | "show": true, 330 | "lineStyle": { 331 | "color": "#008acd" 332 | } 333 | }, 334 | "axisTick": { 335 | "show": true, 336 | "lineStyle": { 337 | "color": "#333" 338 | } 339 | }, 340 | "axisLabel": { 341 | "show": true, 342 | "textStyle": { 343 | "color": "#333" 344 | } 345 | }, 346 | "splitLine": { 347 | "show": true, 348 | "lineStyle": { 349 | "color": [ 350 | "#eee" 351 | ] 352 | } 353 | }, 354 | "splitArea": { 355 | "show": true, 356 | "areaStyle": { 357 | "color": [ 358 | "rgba(250,250,250,0.3)", 359 | "rgba(200,200,200,0.3)" 360 | ] 361 | } 362 | } 363 | }, 364 | "logAxis": { 365 | "axisLine": { 366 | "show": true, 367 | "lineStyle": { 368 | "color": "#008acd" 369 | } 370 | }, 371 | "axisTick": { 372 | "show": true, 373 | "lineStyle": { 374 | "color": "#333" 375 | } 376 | }, 377 | "axisLabel": { 378 | "show": true, 379 | "textStyle": { 380 | "color": "#333" 381 | } 382 | }, 383 | "splitLine": { 384 | "show": true, 385 | "lineStyle": { 386 | "color": [ 387 | "#eee" 388 | ] 389 | } 390 | }, 391 | "splitArea": { 392 | "show": true, 393 | "areaStyle": { 394 | "color": [ 395 | "rgba(250,250,250,0.3)", 396 | "rgba(200,200,200,0.3)" 397 | ] 398 | } 399 | } 400 | }, 401 | "timeAxis": { 402 | "axisLine": { 403 | "show": true, 404 | "lineStyle": { 405 | "color": "#008acd" 406 | } 407 | }, 408 | "axisTick": { 409 | "show": true, 410 | "lineStyle": { 411 | "color": "#333" 412 | } 413 | }, 414 | "axisLabel": { 415 | "show": true, 416 | "textStyle": { 417 | "color": "#333" 418 | } 419 | }, 420 | "splitLine": { 421 | "show": true, 422 | "lineStyle": { 423 | "color": [ 424 | "#eee" 425 | ] 426 | } 427 | }, 428 | "splitArea": { 429 | "show": false, 430 | "areaStyle": { 431 | "color": [ 432 | "rgba(250,250,250,0.3)", 433 | "rgba(200,200,200,0.3)" 434 | ] 435 | } 436 | } 437 | }, 438 | "toolbox": { 439 | "iconStyle": { 440 | "normal": { 441 | "borderColor": "#2ec7c9" 442 | }, 443 | "emphasis": { 444 | "borderColor": "#18a4a6" 445 | } 446 | } 447 | }, 448 | "legend": { 449 | "textStyle": { 450 | "color": "#333333" 451 | } 452 | }, 453 | "tooltip": { 454 | "axisPointer": { 455 | "lineStyle": { 456 | "color": "#008acd", 457 | "width": "1" 458 | }, 459 | "crossStyle": { 460 | "color": "#008acd", 461 | "width": "1" 462 | } 463 | } 464 | }, 465 | "timeline": { 466 | "lineStyle": { 467 | "color": "#008acd", 468 | "width": 1 469 | }, 470 | "itemStyle": { 471 | "normal": { 472 | "color": "#008acd", 473 | "borderWidth": 1 474 | }, 475 | "emphasis": { 476 | "color": "#a9334c" 477 | } 478 | }, 479 | "controlStyle": { 480 | "normal": { 481 | "color": "#008acd", 482 | "borderColor": "#008acd", 483 | "borderWidth": 0.5 484 | }, 485 | "emphasis": { 486 | "color": "#008acd", 487 | "borderColor": "#008acd", 488 | "borderWidth": 0.5 489 | } 490 | }, 491 | "checkpointStyle": { 492 | "color": "#2ec7c9", 493 | "borderColor": "rgba(46,199,201,0.4)" 494 | }, 495 | "label": { 496 | "normal": { 497 | "textStyle": { 498 | "color": "#008acd" 499 | } 500 | }, 501 | "emphasis": { 502 | "textStyle": { 503 | "color": "#008acd" 504 | } 505 | } 506 | } 507 | }, 508 | "visualMap": { 509 | "color": [ 510 | "#5ab1ef", 511 | "#e0ffff" 512 | ] 513 | }, 514 | "dataZoom": { 515 | "backgroundColor": "rgba(47,69,84,0)", 516 | "dataBackgroundColor": "rgba(239,239,255,1)", 517 | "fillerColor": "rgba(182,162,222,0.2)", 518 | "handleColor": "#008acd", 519 | "handleSize": "100%", 520 | "textStyle": { 521 | "color": "#333333" 522 | } 523 | }, 524 | "markPoint": { 525 | "label": { 526 | "normal": { 527 | "textStyle": { 528 | "color": "#eeeeee" 529 | } 530 | }, 531 | "emphasis": { 532 | "textStyle": { 533 | "color": "#eeeeee" 534 | } 535 | } 536 | } 537 | } 538 | }); 539 | })); 540 | -------------------------------------------------------------------------------- /resources/assets/themes/purple-passion.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('purple-passion', { 23 | "color": [ 24 | "#9b8bba", 25 | "#e098c7", 26 | "#8fd3e8", 27 | "#71669e", 28 | "#cc70af", 29 | "#7cb4cc" 30 | ], 31 | "backgroundColor": "rgba(91,92,110,1)", 32 | "textStyle": {}, 33 | "title": { 34 | "textStyle": { 35 | "color": "#ffffff" 36 | }, 37 | "subtextStyle": { 38 | "color": "#cccccc" 39 | } 40 | }, 41 | "line": { 42 | "itemStyle": { 43 | "normal": { 44 | "borderWidth": "2" 45 | } 46 | }, 47 | "lineStyle": { 48 | "normal": { 49 | "width": "3" 50 | } 51 | }, 52 | "symbolSize": "7", 53 | "symbol": "circle", 54 | "smooth": true 55 | }, 56 | "radar": { 57 | "itemStyle": { 58 | "normal": { 59 | "borderWidth": "2" 60 | } 61 | }, 62 | "lineStyle": { 63 | "normal": { 64 | "width": "3" 65 | } 66 | }, 67 | "symbolSize": "7", 68 | "symbol": "circle", 69 | "smooth": true 70 | }, 71 | "bar": { 72 | "itemStyle": { 73 | "normal": { 74 | "barBorderWidth": 0, 75 | "barBorderColor": "#ccc" 76 | }, 77 | "emphasis": { 78 | "barBorderWidth": 0, 79 | "barBorderColor": "#ccc" 80 | } 81 | } 82 | }, 83 | "pie": { 84 | "itemStyle": { 85 | "normal": { 86 | "borderWidth": 0, 87 | "borderColor": "#ccc" 88 | }, 89 | "emphasis": { 90 | "borderWidth": 0, 91 | "borderColor": "#ccc" 92 | } 93 | } 94 | }, 95 | "scatter": { 96 | "itemStyle": { 97 | "normal": { 98 | "borderWidth": 0, 99 | "borderColor": "#ccc" 100 | }, 101 | "emphasis": { 102 | "borderWidth": 0, 103 | "borderColor": "#ccc" 104 | } 105 | } 106 | }, 107 | "boxplot": { 108 | "itemStyle": { 109 | "normal": { 110 | "borderWidth": 0, 111 | "borderColor": "#ccc" 112 | }, 113 | "emphasis": { 114 | "borderWidth": 0, 115 | "borderColor": "#ccc" 116 | } 117 | } 118 | }, 119 | "parallel": { 120 | "itemStyle": { 121 | "normal": { 122 | "borderWidth": 0, 123 | "borderColor": "#ccc" 124 | }, 125 | "emphasis": { 126 | "borderWidth": 0, 127 | "borderColor": "#ccc" 128 | } 129 | } 130 | }, 131 | "sankey": { 132 | "itemStyle": { 133 | "normal": { 134 | "borderWidth": 0, 135 | "borderColor": "#ccc" 136 | }, 137 | "emphasis": { 138 | "borderWidth": 0, 139 | "borderColor": "#ccc" 140 | } 141 | } 142 | }, 143 | "funnel": { 144 | "itemStyle": { 145 | "normal": { 146 | "borderWidth": 0, 147 | "borderColor": "#ccc" 148 | }, 149 | "emphasis": { 150 | "borderWidth": 0, 151 | "borderColor": "#ccc" 152 | } 153 | } 154 | }, 155 | "gauge": { 156 | "itemStyle": { 157 | "normal": { 158 | "borderWidth": 0, 159 | "borderColor": "#ccc" 160 | }, 161 | "emphasis": { 162 | "borderWidth": 0, 163 | "borderColor": "#ccc" 164 | } 165 | } 166 | }, 167 | "candlestick": { 168 | "itemStyle": { 169 | "normal": { 170 | "color": "#e098c7", 171 | "color0": "transparent", 172 | "borderColor": "#e098c7", 173 | "borderColor0": "#8fd3e8", 174 | "borderWidth": "2" 175 | } 176 | } 177 | }, 178 | "graph": { 179 | "itemStyle": { 180 | "normal": { 181 | "borderWidth": 0, 182 | "borderColor": "#ccc" 183 | } 184 | }, 185 | "lineStyle": { 186 | "normal": { 187 | "width": 1, 188 | "color": "#aaaaaa" 189 | } 190 | }, 191 | "symbolSize": "7", 192 | "symbol": "circle", 193 | "smooth": true, 194 | "color": [ 195 | "#9b8bba", 196 | "#e098c7", 197 | "#8fd3e8", 198 | "#71669e", 199 | "#cc70af", 200 | "#7cb4cc" 201 | ], 202 | "label": { 203 | "normal": { 204 | "textStyle": { 205 | "color": "#eeeeee" 206 | } 207 | } 208 | } 209 | }, 210 | "map": { 211 | "itemStyle": { 212 | "normal": { 213 | "areaColor": "#eeeeee", 214 | "borderColor": "#444444", 215 | "borderWidth": 0.5 216 | }, 217 | "emphasis": { 218 | "areaColor": "rgba(224,152,199,1)", 219 | "borderColor": "#444444", 220 | "borderWidth": 1 221 | } 222 | }, 223 | "label": { 224 | "normal": { 225 | "textStyle": { 226 | "color": "#000000" 227 | } 228 | }, 229 | "emphasis": { 230 | "textStyle": { 231 | "color": "rgb(255,255,255)" 232 | } 233 | } 234 | } 235 | }, 236 | "geo": { 237 | "itemStyle": { 238 | "normal": { 239 | "areaColor": "#eeeeee", 240 | "borderColor": "#444444", 241 | "borderWidth": 0.5 242 | }, 243 | "emphasis": { 244 | "areaColor": "rgba(224,152,199,1)", 245 | "borderColor": "#444444", 246 | "borderWidth": 1 247 | } 248 | }, 249 | "label": { 250 | "normal": { 251 | "textStyle": { 252 | "color": "#000000" 253 | } 254 | }, 255 | "emphasis": { 256 | "textStyle": { 257 | "color": "rgb(255,255,255)" 258 | } 259 | } 260 | } 261 | }, 262 | "categoryAxis": { 263 | "axisLine": { 264 | "show": true, 265 | "lineStyle": { 266 | "color": "#cccccc" 267 | } 268 | }, 269 | "axisTick": { 270 | "show": false, 271 | "lineStyle": { 272 | "color": "#333" 273 | } 274 | }, 275 | "axisLabel": { 276 | "show": true, 277 | "textStyle": { 278 | "color": "#cccccc" 279 | } 280 | }, 281 | "splitLine": { 282 | "show": false, 283 | "lineStyle": { 284 | "color": [ 285 | "#eeeeee", 286 | "#333333" 287 | ] 288 | } 289 | }, 290 | "splitArea": { 291 | "show": true, 292 | "areaStyle": { 293 | "color": [ 294 | "rgba(250,250,250,0.05)", 295 | "rgba(200,200,200,0.02)" 296 | ] 297 | } 298 | } 299 | }, 300 | "valueAxis": { 301 | "axisLine": { 302 | "show": true, 303 | "lineStyle": { 304 | "color": "#cccccc" 305 | } 306 | }, 307 | "axisTick": { 308 | "show": false, 309 | "lineStyle": { 310 | "color": "#333" 311 | } 312 | }, 313 | "axisLabel": { 314 | "show": true, 315 | "textStyle": { 316 | "color": "#cccccc" 317 | } 318 | }, 319 | "splitLine": { 320 | "show": false, 321 | "lineStyle": { 322 | "color": [ 323 | "#eeeeee", 324 | "#333333" 325 | ] 326 | } 327 | }, 328 | "splitArea": { 329 | "show": true, 330 | "areaStyle": { 331 | "color": [ 332 | "rgba(250,250,250,0.05)", 333 | "rgba(200,200,200,0.02)" 334 | ] 335 | } 336 | } 337 | }, 338 | "logAxis": { 339 | "axisLine": { 340 | "show": true, 341 | "lineStyle": { 342 | "color": "#cccccc" 343 | } 344 | }, 345 | "axisTick": { 346 | "show": false, 347 | "lineStyle": { 348 | "color": "#333" 349 | } 350 | }, 351 | "axisLabel": { 352 | "show": true, 353 | "textStyle": { 354 | "color": "#cccccc" 355 | } 356 | }, 357 | "splitLine": { 358 | "show": false, 359 | "lineStyle": { 360 | "color": [ 361 | "#eeeeee", 362 | "#333333" 363 | ] 364 | } 365 | }, 366 | "splitArea": { 367 | "show": true, 368 | "areaStyle": { 369 | "color": [ 370 | "rgba(250,250,250,0.05)", 371 | "rgba(200,200,200,0.02)" 372 | ] 373 | } 374 | } 375 | }, 376 | "timeAxis": { 377 | "axisLine": { 378 | "show": true, 379 | "lineStyle": { 380 | "color": "#cccccc" 381 | } 382 | }, 383 | "axisTick": { 384 | "show": false, 385 | "lineStyle": { 386 | "color": "#333" 387 | } 388 | }, 389 | "axisLabel": { 390 | "show": true, 391 | "textStyle": { 392 | "color": "#cccccc" 393 | } 394 | }, 395 | "splitLine": { 396 | "show": false, 397 | "lineStyle": { 398 | "color": [ 399 | "#eeeeee", 400 | "#333333" 401 | ] 402 | } 403 | }, 404 | "splitArea": { 405 | "show": true, 406 | "areaStyle": { 407 | "color": [ 408 | "rgba(250,250,250,0.05)", 409 | "rgba(200,200,200,0.02)" 410 | ] 411 | } 412 | } 413 | }, 414 | "toolbox": { 415 | "iconStyle": { 416 | "normal": { 417 | "borderColor": "#999999" 418 | }, 419 | "emphasis": { 420 | "borderColor": "#666666" 421 | } 422 | } 423 | }, 424 | "legend": { 425 | "textStyle": { 426 | "color": "#cccccc" 427 | } 428 | }, 429 | "tooltip": { 430 | "axisPointer": { 431 | "lineStyle": { 432 | "color": "#cccccc", 433 | "width": 1 434 | }, 435 | "crossStyle": { 436 | "color": "#cccccc", 437 | "width": 1 438 | } 439 | } 440 | }, 441 | "timeline": { 442 | "lineStyle": { 443 | "color": "#8fd3e8", 444 | "width": 1 445 | }, 446 | "itemStyle": { 447 | "normal": { 448 | "color": "#8fd3e8", 449 | "borderWidth": 1 450 | }, 451 | "emphasis": { 452 | "color": "#8fd3e8" 453 | } 454 | }, 455 | "controlStyle": { 456 | "normal": { 457 | "color": "#8fd3e8", 458 | "borderColor": "#8fd3e8", 459 | "borderWidth": 0.5 460 | }, 461 | "emphasis": { 462 | "color": "#8fd3e8", 463 | "borderColor": "#8fd3e8", 464 | "borderWidth": 0.5 465 | } 466 | }, 467 | "checkpointStyle": { 468 | "color": "#8fd3e8", 469 | "borderColor": "rgba(138,124,168,0.37)" 470 | }, 471 | "label": { 472 | "normal": { 473 | "textStyle": { 474 | "color": "#8fd3e8" 475 | } 476 | }, 477 | "emphasis": { 478 | "textStyle": { 479 | "color": "#8fd3e8" 480 | } 481 | } 482 | } 483 | }, 484 | "visualMap": { 485 | "color": [ 486 | "#8a7ca8", 487 | "#e098c7", 488 | "#cceffa" 489 | ] 490 | }, 491 | "dataZoom": { 492 | "backgroundColor": "rgba(0,0,0,0)", 493 | "dataBackgroundColor": "rgba(255,255,255,0.3)", 494 | "fillerColor": "rgba(167,183,204,0.4)", 495 | "handleColor": "#a7b7cc", 496 | "handleSize": "100%", 497 | "textStyle": { 498 | "color": "#333333" 499 | } 500 | }, 501 | "markPoint": { 502 | "label": { 503 | "normal": { 504 | "textStyle": { 505 | "color": "#eeeeee" 506 | } 507 | }, 508 | "emphasis": { 509 | "textStyle": { 510 | "color": "#eeeeee" 511 | } 512 | } 513 | } 514 | } 515 | }); 516 | })); 517 | -------------------------------------------------------------------------------- /resources/assets/themes/roma.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('roma', { 23 | "color": [ 24 | "#e01f54", 25 | "#001852", 26 | "#f5e8c8", 27 | "#b8d2c7", 28 | "#c6b38e", 29 | "#a4d8c2", 30 | "#f3d999", 31 | "#d3758f", 32 | "#dcc392", 33 | "#2e4783", 34 | "#82b6e9", 35 | "#ff6347", 36 | "#a092f1", 37 | "#0a915d", 38 | "#eaf889", 39 | "#6699ff", 40 | "#ff6666", 41 | "#3cb371", 42 | "#d5b158", 43 | "#38b6b6" 44 | ], 45 | "backgroundColor": "rgba(0,0,0,0)", 46 | "textStyle": {}, 47 | "title": { 48 | "textStyle": { 49 | "color": "#333333" 50 | }, 51 | "subtextStyle": { 52 | "color": "#aaaaaa" 53 | } 54 | }, 55 | "line": { 56 | "itemStyle": { 57 | "normal": { 58 | "borderWidth": 1 59 | } 60 | }, 61 | "lineStyle": { 62 | "normal": { 63 | "width": 2 64 | } 65 | }, 66 | "symbolSize": 4, 67 | "symbol": "emptyCircle", 68 | "smooth": false 69 | }, 70 | "radar": { 71 | "itemStyle": { 72 | "normal": { 73 | "borderWidth": 1 74 | } 75 | }, 76 | "lineStyle": { 77 | "normal": { 78 | "width": 2 79 | } 80 | }, 81 | "symbolSize": 4, 82 | "symbol": "emptyCircle", 83 | "smooth": false 84 | }, 85 | "bar": { 86 | "itemStyle": { 87 | "normal": { 88 | "barBorderWidth": 0, 89 | "barBorderColor": "#ccc" 90 | }, 91 | "emphasis": { 92 | "barBorderWidth": 0, 93 | "barBorderColor": "#ccc" 94 | } 95 | } 96 | }, 97 | "pie": { 98 | "itemStyle": { 99 | "normal": { 100 | "borderWidth": 0, 101 | "borderColor": "#ccc" 102 | }, 103 | "emphasis": { 104 | "borderWidth": 0, 105 | "borderColor": "#ccc" 106 | } 107 | } 108 | }, 109 | "scatter": { 110 | "itemStyle": { 111 | "normal": { 112 | "borderWidth": 0, 113 | "borderColor": "#ccc" 114 | }, 115 | "emphasis": { 116 | "borderWidth": 0, 117 | "borderColor": "#ccc" 118 | } 119 | } 120 | }, 121 | "boxplot": { 122 | "itemStyle": { 123 | "normal": { 124 | "borderWidth": 0, 125 | "borderColor": "#ccc" 126 | }, 127 | "emphasis": { 128 | "borderWidth": 0, 129 | "borderColor": "#ccc" 130 | } 131 | } 132 | }, 133 | "parallel": { 134 | "itemStyle": { 135 | "normal": { 136 | "borderWidth": 0, 137 | "borderColor": "#ccc" 138 | }, 139 | "emphasis": { 140 | "borderWidth": 0, 141 | "borderColor": "#ccc" 142 | } 143 | } 144 | }, 145 | "sankey": { 146 | "itemStyle": { 147 | "normal": { 148 | "borderWidth": 0, 149 | "borderColor": "#ccc" 150 | }, 151 | "emphasis": { 152 | "borderWidth": 0, 153 | "borderColor": "#ccc" 154 | } 155 | } 156 | }, 157 | "funnel": { 158 | "itemStyle": { 159 | "normal": { 160 | "borderWidth": 0, 161 | "borderColor": "#ccc" 162 | }, 163 | "emphasis": { 164 | "borderWidth": 0, 165 | "borderColor": "#ccc" 166 | } 167 | } 168 | }, 169 | "gauge": { 170 | "itemStyle": { 171 | "normal": { 172 | "borderWidth": 0, 173 | "borderColor": "#ccc" 174 | }, 175 | "emphasis": { 176 | "borderWidth": 0, 177 | "borderColor": "#ccc" 178 | } 179 | } 180 | }, 181 | "candlestick": { 182 | "itemStyle": { 183 | "normal": { 184 | "color": "#e01f54", 185 | "color0": "#001852", 186 | "borderColor": "#f5e8c8", 187 | "borderColor0": "#b8d2c7", 188 | "borderWidth": 1 189 | } 190 | } 191 | }, 192 | "graph": { 193 | "itemStyle": { 194 | "normal": { 195 | "borderWidth": 0, 196 | "borderColor": "#ccc" 197 | } 198 | }, 199 | "lineStyle": { 200 | "normal": { 201 | "width": 1, 202 | "color": "#aaaaaa" 203 | } 204 | }, 205 | "symbolSize": 4, 206 | "symbol": "emptyCircle", 207 | "smooth": false, 208 | "color": [ 209 | "#e01f54", 210 | "#001852", 211 | "#f5e8c8", 212 | "#b8d2c7", 213 | "#c6b38e", 214 | "#a4d8c2", 215 | "#f3d999", 216 | "#d3758f", 217 | "#dcc392", 218 | "#2e4783", 219 | "#82b6e9", 220 | "#ff6347", 221 | "#a092f1", 222 | "#0a915d", 223 | "#eaf889", 224 | "#6699ff", 225 | "#ff6666", 226 | "#3cb371", 227 | "#d5b158", 228 | "#38b6b6" 229 | ], 230 | "label": { 231 | "normal": { 232 | "textStyle": { 233 | "color": "#eeeeee" 234 | } 235 | } 236 | } 237 | }, 238 | "map": { 239 | "itemStyle": { 240 | "normal": { 241 | "areaColor": "#eeeeee", 242 | "borderColor": "#444444", 243 | "borderWidth": 0.5 244 | }, 245 | "emphasis": { 246 | "areaColor": "rgba(255,215,0,0.8)", 247 | "borderColor": "#444444", 248 | "borderWidth": 1 249 | } 250 | }, 251 | "label": { 252 | "normal": { 253 | "textStyle": { 254 | "color": "#000000" 255 | } 256 | }, 257 | "emphasis": { 258 | "textStyle": { 259 | "color": "rgb(100,0,0)" 260 | } 261 | } 262 | } 263 | }, 264 | "geo": { 265 | "itemStyle": { 266 | "normal": { 267 | "areaColor": "#eeeeee", 268 | "borderColor": "#444444", 269 | "borderWidth": 0.5 270 | }, 271 | "emphasis": { 272 | "areaColor": "rgba(255,215,0,0.8)", 273 | "borderColor": "#444444", 274 | "borderWidth": 1 275 | } 276 | }, 277 | "label": { 278 | "normal": { 279 | "textStyle": { 280 | "color": "#000000" 281 | } 282 | }, 283 | "emphasis": { 284 | "textStyle": { 285 | "color": "rgb(100,0,0)" 286 | } 287 | } 288 | } 289 | }, 290 | "categoryAxis": { 291 | "axisLine": { 292 | "show": true, 293 | "lineStyle": { 294 | "color": "#333" 295 | } 296 | }, 297 | "axisTick": { 298 | "show": true, 299 | "lineStyle": { 300 | "color": "#333" 301 | } 302 | }, 303 | "axisLabel": { 304 | "show": true, 305 | "textStyle": { 306 | "color": "#333" 307 | } 308 | }, 309 | "splitLine": { 310 | "show": false, 311 | "lineStyle": { 312 | "color": [ 313 | "#ccc" 314 | ] 315 | } 316 | }, 317 | "splitArea": { 318 | "show": false, 319 | "areaStyle": { 320 | "color": [ 321 | "rgba(250,250,250,0.3)", 322 | "rgba(200,200,200,0.3)" 323 | ] 324 | } 325 | } 326 | }, 327 | "valueAxis": { 328 | "axisLine": { 329 | "show": true, 330 | "lineStyle": { 331 | "color": "#333" 332 | } 333 | }, 334 | "axisTick": { 335 | "show": true, 336 | "lineStyle": { 337 | "color": "#333" 338 | } 339 | }, 340 | "axisLabel": { 341 | "show": true, 342 | "textStyle": { 343 | "color": "#333" 344 | } 345 | }, 346 | "splitLine": { 347 | "show": true, 348 | "lineStyle": { 349 | "color": [ 350 | "#ccc" 351 | ] 352 | } 353 | }, 354 | "splitArea": { 355 | "show": false, 356 | "areaStyle": { 357 | "color": [ 358 | "rgba(250,250,250,0.3)", 359 | "rgba(200,200,200,0.3)" 360 | ] 361 | } 362 | } 363 | }, 364 | "logAxis": { 365 | "axisLine": { 366 | "show": true, 367 | "lineStyle": { 368 | "color": "#333" 369 | } 370 | }, 371 | "axisTick": { 372 | "show": true, 373 | "lineStyle": { 374 | "color": "#333" 375 | } 376 | }, 377 | "axisLabel": { 378 | "show": true, 379 | "textStyle": { 380 | "color": "#333" 381 | } 382 | }, 383 | "splitLine": { 384 | "show": true, 385 | "lineStyle": { 386 | "color": [ 387 | "#ccc" 388 | ] 389 | } 390 | }, 391 | "splitArea": { 392 | "show": false, 393 | "areaStyle": { 394 | "color": [ 395 | "rgba(250,250,250,0.3)", 396 | "rgba(200,200,200,0.3)" 397 | ] 398 | } 399 | } 400 | }, 401 | "timeAxis": { 402 | "axisLine": { 403 | "show": true, 404 | "lineStyle": { 405 | "color": "#333" 406 | } 407 | }, 408 | "axisTick": { 409 | "show": true, 410 | "lineStyle": { 411 | "color": "#333" 412 | } 413 | }, 414 | "axisLabel": { 415 | "show": true, 416 | "textStyle": { 417 | "color": "#333" 418 | } 419 | }, 420 | "splitLine": { 421 | "show": true, 422 | "lineStyle": { 423 | "color": [ 424 | "#ccc" 425 | ] 426 | } 427 | }, 428 | "splitArea": { 429 | "show": false, 430 | "areaStyle": { 431 | "color": [ 432 | "rgba(250,250,250,0.3)", 433 | "rgba(200,200,200,0.3)" 434 | ] 435 | } 436 | } 437 | }, 438 | "toolbox": { 439 | "iconStyle": { 440 | "normal": { 441 | "borderColor": "#999999" 442 | }, 443 | "emphasis": { 444 | "borderColor": "#666666" 445 | } 446 | } 447 | }, 448 | "legend": { 449 | "textStyle": { 450 | "color": "#333333" 451 | } 452 | }, 453 | "tooltip": { 454 | "axisPointer": { 455 | "lineStyle": { 456 | "color": "#cccccc", 457 | "width": 1 458 | }, 459 | "crossStyle": { 460 | "color": "#cccccc", 461 | "width": 1 462 | } 463 | } 464 | }, 465 | "timeline": { 466 | "lineStyle": { 467 | "color": "#293c55", 468 | "width": 1 469 | }, 470 | "itemStyle": { 471 | "normal": { 472 | "color": "#293c55", 473 | "borderWidth": 1 474 | }, 475 | "emphasis": { 476 | "color": "#a9334c" 477 | } 478 | }, 479 | "controlStyle": { 480 | "normal": { 481 | "color": "#293c55", 482 | "borderColor": "#293c55", 483 | "borderWidth": 0.5 484 | }, 485 | "emphasis": { 486 | "color": "#293c55", 487 | "borderColor": "#293c55", 488 | "borderWidth": 0.5 489 | } 490 | }, 491 | "checkpointStyle": { 492 | "color": "#e43c59", 493 | "borderColor": "rgba(194,53,49,0.5)" 494 | }, 495 | "label": { 496 | "normal": { 497 | "textStyle": { 498 | "color": "#293c55" 499 | } 500 | }, 501 | "emphasis": { 502 | "textStyle": { 503 | "color": "#293c55" 504 | } 505 | } 506 | } 507 | }, 508 | "visualMap": { 509 | "color": [ 510 | "#e01f54", 511 | "#e7dbc3" 512 | ] 513 | }, 514 | "dataZoom": { 515 | "backgroundColor": "rgba(47,69,84,0)", 516 | "dataBackgroundColor": "rgba(47,69,84,0.3)", 517 | "fillerColor": "rgba(167,183,204,0.4)", 518 | "handleColor": "#a7b7cc", 519 | "handleSize": "100%", 520 | "textStyle": { 521 | "color": "#333333" 522 | } 523 | }, 524 | "markPoint": { 525 | "label": { 526 | "normal": { 527 | "textStyle": { 528 | "color": "#eeeeee" 529 | } 530 | }, 531 | "emphasis": { 532 | "textStyle": { 533 | "color": "#eeeeee" 534 | } 535 | } 536 | } 537 | } 538 | }); 539 | })); 540 | -------------------------------------------------------------------------------- /resources/assets/themes/shine.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('shine', { 23 | "color": [ 24 | "#c12e34", 25 | "#e6b600", 26 | "#0098d9", 27 | "#2b821d", 28 | "#005eaa", 29 | "#339ca8", 30 | "#cda819", 31 | "#32a487" 32 | ], 33 | "backgroundColor": "rgba(0,0,0,0)", 34 | "textStyle": {}, 35 | "title": { 36 | "textStyle": { 37 | "color": "#333333" 38 | }, 39 | "subtextStyle": { 40 | "color": "#aaaaaa" 41 | } 42 | }, 43 | "line": { 44 | "itemStyle": { 45 | "normal": { 46 | "borderWidth": 1 47 | } 48 | }, 49 | "lineStyle": { 50 | "normal": { 51 | "width": 2 52 | } 53 | }, 54 | "symbolSize": 4, 55 | "symbol": "emptyCircle", 56 | "smooth": false 57 | }, 58 | "radar": { 59 | "itemStyle": { 60 | "normal": { 61 | "borderWidth": 1 62 | } 63 | }, 64 | "lineStyle": { 65 | "normal": { 66 | "width": 2 67 | } 68 | }, 69 | "symbolSize": 4, 70 | "symbol": "emptyCircle", 71 | "smooth": false 72 | }, 73 | "bar": { 74 | "itemStyle": { 75 | "normal": { 76 | "barBorderWidth": 0, 77 | "barBorderColor": "#ccc" 78 | }, 79 | "emphasis": { 80 | "barBorderWidth": 0, 81 | "barBorderColor": "#ccc" 82 | } 83 | } 84 | }, 85 | "pie": { 86 | "itemStyle": { 87 | "normal": { 88 | "borderWidth": 0, 89 | "borderColor": "#ccc" 90 | }, 91 | "emphasis": { 92 | "borderWidth": 0, 93 | "borderColor": "#ccc" 94 | } 95 | } 96 | }, 97 | "scatter": { 98 | "itemStyle": { 99 | "normal": { 100 | "borderWidth": 0, 101 | "borderColor": "#ccc" 102 | }, 103 | "emphasis": { 104 | "borderWidth": 0, 105 | "borderColor": "#ccc" 106 | } 107 | } 108 | }, 109 | "boxplot": { 110 | "itemStyle": { 111 | "normal": { 112 | "borderWidth": 0, 113 | "borderColor": "#ccc" 114 | }, 115 | "emphasis": { 116 | "borderWidth": 0, 117 | "borderColor": "#ccc" 118 | } 119 | } 120 | }, 121 | "parallel": { 122 | "itemStyle": { 123 | "normal": { 124 | "borderWidth": 0, 125 | "borderColor": "#ccc" 126 | }, 127 | "emphasis": { 128 | "borderWidth": 0, 129 | "borderColor": "#ccc" 130 | } 131 | } 132 | }, 133 | "sankey": { 134 | "itemStyle": { 135 | "normal": { 136 | "borderWidth": 0, 137 | "borderColor": "#ccc" 138 | }, 139 | "emphasis": { 140 | "borderWidth": 0, 141 | "borderColor": "#ccc" 142 | } 143 | } 144 | }, 145 | "funnel": { 146 | "itemStyle": { 147 | "normal": { 148 | "borderWidth": 0, 149 | "borderColor": "#ccc" 150 | }, 151 | "emphasis": { 152 | "borderWidth": 0, 153 | "borderColor": "#ccc" 154 | } 155 | } 156 | }, 157 | "gauge": { 158 | "itemStyle": { 159 | "normal": { 160 | "borderWidth": 0, 161 | "borderColor": "#ccc" 162 | }, 163 | "emphasis": { 164 | "borderWidth": 0, 165 | "borderColor": "#ccc" 166 | } 167 | } 168 | }, 169 | "candlestick": { 170 | "itemStyle": { 171 | "normal": { 172 | "color": "#c12e34", 173 | "color0": "#2b821d", 174 | "borderColor": "#c12e34", 175 | "borderColor0": "#2b821d", 176 | "borderWidth": 1 177 | } 178 | } 179 | }, 180 | "graph": { 181 | "itemStyle": { 182 | "normal": { 183 | "borderWidth": 0, 184 | "borderColor": "#ccc" 185 | } 186 | }, 187 | "lineStyle": { 188 | "normal": { 189 | "width": 1, 190 | "color": "#aaaaaa" 191 | } 192 | }, 193 | "symbolSize": 4, 194 | "symbol": "emptyCircle", 195 | "smooth": false, 196 | "color": [ 197 | "#c12e34", 198 | "#e6b600", 199 | "#0098d9", 200 | "#2b821d", 201 | "#005eaa", 202 | "#339ca8", 203 | "#cda819", 204 | "#32a487" 205 | ], 206 | "label": { 207 | "normal": { 208 | "textStyle": { 209 | "color": "#eeeeee" 210 | } 211 | } 212 | } 213 | }, 214 | "map": { 215 | "itemStyle": { 216 | "normal": { 217 | "areaColor": "#dddddd", 218 | "borderColor": "#eeeeee", 219 | "borderWidth": 0.5 220 | }, 221 | "emphasis": { 222 | "areaColor": "rgba(230,182,0,1)", 223 | "borderColor": "#dddddd", 224 | "borderWidth": 1 225 | } 226 | }, 227 | "label": { 228 | "normal": { 229 | "textStyle": { 230 | "color": "#c12e34" 231 | } 232 | }, 233 | "emphasis": { 234 | "textStyle": { 235 | "color": "rgb(193,46,52)" 236 | } 237 | } 238 | } 239 | }, 240 | "geo": { 241 | "itemStyle": { 242 | "normal": { 243 | "areaColor": "#dddddd", 244 | "borderColor": "#eeeeee", 245 | "borderWidth": 0.5 246 | }, 247 | "emphasis": { 248 | "areaColor": "rgba(230,182,0,1)", 249 | "borderColor": "#dddddd", 250 | "borderWidth": 1 251 | } 252 | }, 253 | "label": { 254 | "normal": { 255 | "textStyle": { 256 | "color": "#c12e34" 257 | } 258 | }, 259 | "emphasis": { 260 | "textStyle": { 261 | "color": "rgb(193,46,52)" 262 | } 263 | } 264 | } 265 | }, 266 | "categoryAxis": { 267 | "axisLine": { 268 | "show": true, 269 | "lineStyle": { 270 | "color": "#333" 271 | } 272 | }, 273 | "axisTick": { 274 | "show": true, 275 | "lineStyle": { 276 | "color": "#333" 277 | } 278 | }, 279 | "axisLabel": { 280 | "show": true, 281 | "textStyle": { 282 | "color": "#333" 283 | } 284 | }, 285 | "splitLine": { 286 | "show": false, 287 | "lineStyle": { 288 | "color": [ 289 | "#ccc" 290 | ] 291 | } 292 | }, 293 | "splitArea": { 294 | "show": false, 295 | "areaStyle": { 296 | "color": [ 297 | "rgba(250,250,250,0.3)", 298 | "rgba(200,200,200,0.3)" 299 | ] 300 | } 301 | } 302 | }, 303 | "valueAxis": { 304 | "axisLine": { 305 | "show": true, 306 | "lineStyle": { 307 | "color": "#333" 308 | } 309 | }, 310 | "axisTick": { 311 | "show": true, 312 | "lineStyle": { 313 | "color": "#333" 314 | } 315 | }, 316 | "axisLabel": { 317 | "show": true, 318 | "textStyle": { 319 | "color": "#333" 320 | } 321 | }, 322 | "splitLine": { 323 | "show": true, 324 | "lineStyle": { 325 | "color": [ 326 | "#ccc" 327 | ] 328 | } 329 | }, 330 | "splitArea": { 331 | "show": false, 332 | "areaStyle": { 333 | "color": [ 334 | "rgba(250,250,250,0.3)", 335 | "rgba(200,200,200,0.3)" 336 | ] 337 | } 338 | } 339 | }, 340 | "logAxis": { 341 | "axisLine": { 342 | "show": true, 343 | "lineStyle": { 344 | "color": "#333" 345 | } 346 | }, 347 | "axisTick": { 348 | "show": true, 349 | "lineStyle": { 350 | "color": "#333" 351 | } 352 | }, 353 | "axisLabel": { 354 | "show": true, 355 | "textStyle": { 356 | "color": "#333" 357 | } 358 | }, 359 | "splitLine": { 360 | "show": true, 361 | "lineStyle": { 362 | "color": [ 363 | "#ccc" 364 | ] 365 | } 366 | }, 367 | "splitArea": { 368 | "show": false, 369 | "areaStyle": { 370 | "color": [ 371 | "rgba(250,250,250,0.3)", 372 | "rgba(200,200,200,0.3)" 373 | ] 374 | } 375 | } 376 | }, 377 | "timeAxis": { 378 | "axisLine": { 379 | "show": true, 380 | "lineStyle": { 381 | "color": "#333" 382 | } 383 | }, 384 | "axisTick": { 385 | "show": true, 386 | "lineStyle": { 387 | "color": "#333" 388 | } 389 | }, 390 | "axisLabel": { 391 | "show": true, 392 | "textStyle": { 393 | "color": "#333" 394 | } 395 | }, 396 | "splitLine": { 397 | "show": true, 398 | "lineStyle": { 399 | "color": [ 400 | "#ccc" 401 | ] 402 | } 403 | }, 404 | "splitArea": { 405 | "show": false, 406 | "areaStyle": { 407 | "color": [ 408 | "rgba(250,250,250,0.3)", 409 | "rgba(200,200,200,0.3)" 410 | ] 411 | } 412 | } 413 | }, 414 | "toolbox": { 415 | "iconStyle": { 416 | "normal": { 417 | "borderColor": "#06467c" 418 | }, 419 | "emphasis": { 420 | "borderColor": "#4187c2" 421 | } 422 | } 423 | }, 424 | "legend": { 425 | "textStyle": { 426 | "color": "#333333" 427 | } 428 | }, 429 | "tooltip": { 430 | "axisPointer": { 431 | "lineStyle": { 432 | "color": "#cccccc", 433 | "width": 1 434 | }, 435 | "crossStyle": { 436 | "color": "#cccccc", 437 | "width": 1 438 | } 439 | } 440 | }, 441 | "timeline": { 442 | "lineStyle": { 443 | "color": "#005eaa", 444 | "width": 1 445 | }, 446 | "itemStyle": { 447 | "normal": { 448 | "color": "#005eaa", 449 | "borderWidth": 1 450 | }, 451 | "emphasis": { 452 | "color": "#005eaa" 453 | } 454 | }, 455 | "controlStyle": { 456 | "normal": { 457 | "color": "#005eaa", 458 | "borderColor": "#005eaa", 459 | "borderWidth": 0.5 460 | }, 461 | "emphasis": { 462 | "color": "#005eaa", 463 | "borderColor": "#005eaa", 464 | "borderWidth": 0.5 465 | } 466 | }, 467 | "checkpointStyle": { 468 | "color": "#005eaa", 469 | "borderColor": "rgba(49,107,194,0.5)" 470 | }, 471 | "label": { 472 | "normal": { 473 | "textStyle": { 474 | "color": "#005eaa" 475 | } 476 | }, 477 | "emphasis": { 478 | "textStyle": { 479 | "color": "#005eaa" 480 | } 481 | } 482 | } 483 | }, 484 | "visualMap": { 485 | "color": [ 486 | "#1790cf", 487 | "#a2d4e6" 488 | ] 489 | }, 490 | "dataZoom": { 491 | "backgroundColor": "rgba(47,69,84,0)", 492 | "dataBackgroundColor": "rgba(47,69,84,0.3)", 493 | "fillerColor": "rgba(167,183,204,0.4)", 494 | "handleColor": "#a7b7cc", 495 | "handleSize": "100%", 496 | "textStyle": { 497 | "color": "#333333" 498 | } 499 | }, 500 | "markPoint": { 501 | "label": { 502 | "normal": { 503 | "textStyle": { 504 | "color": "#eeeeee" 505 | } 506 | }, 507 | "emphasis": { 508 | "textStyle": { 509 | "color": "#eeeeee" 510 | } 511 | } 512 | } 513 | } 514 | }); 515 | })); 516 | -------------------------------------------------------------------------------- /resources/assets/themes/vintage.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('vintage', { 23 | "color": [ 24 | "#d87c7c", 25 | "#919e8b", 26 | "#d7ab82", 27 | "#6e7074", 28 | "#61a0a8", 29 | "#efa18d", 30 | "#787464", 31 | "#cc7e63", 32 | "#724e58", 33 | "#4b565b" 34 | ], 35 | "backgroundColor": "rgba(254,248,239,1)", 36 | "textStyle": {}, 37 | "title": { 38 | "textStyle": { 39 | "color": "#333333" 40 | }, 41 | "subtextStyle": { 42 | "color": "#aaaaaa" 43 | } 44 | }, 45 | "line": { 46 | "itemStyle": { 47 | "normal": { 48 | "borderWidth": 1 49 | } 50 | }, 51 | "lineStyle": { 52 | "normal": { 53 | "width": 2 54 | } 55 | }, 56 | "symbolSize": 4, 57 | "symbol": "emptyCircle", 58 | "smooth": false 59 | }, 60 | "radar": { 61 | "itemStyle": { 62 | "normal": { 63 | "borderWidth": 1 64 | } 65 | }, 66 | "lineStyle": { 67 | "normal": { 68 | "width": 2 69 | } 70 | }, 71 | "symbolSize": 4, 72 | "symbol": "emptyCircle", 73 | "smooth": false 74 | }, 75 | "bar": { 76 | "itemStyle": { 77 | "normal": { 78 | "barBorderWidth": 0, 79 | "barBorderColor": "#ccc" 80 | }, 81 | "emphasis": { 82 | "barBorderWidth": 0, 83 | "barBorderColor": "#ccc" 84 | } 85 | } 86 | }, 87 | "pie": { 88 | "itemStyle": { 89 | "normal": { 90 | "borderWidth": 0, 91 | "borderColor": "#ccc" 92 | }, 93 | "emphasis": { 94 | "borderWidth": 0, 95 | "borderColor": "#ccc" 96 | } 97 | } 98 | }, 99 | "scatter": { 100 | "itemStyle": { 101 | "normal": { 102 | "borderWidth": 0, 103 | "borderColor": "#ccc" 104 | }, 105 | "emphasis": { 106 | "borderWidth": 0, 107 | "borderColor": "#ccc" 108 | } 109 | } 110 | }, 111 | "boxplot": { 112 | "itemStyle": { 113 | "normal": { 114 | "borderWidth": 0, 115 | "borderColor": "#ccc" 116 | }, 117 | "emphasis": { 118 | "borderWidth": 0, 119 | "borderColor": "#ccc" 120 | } 121 | } 122 | }, 123 | "parallel": { 124 | "itemStyle": { 125 | "normal": { 126 | "borderWidth": 0, 127 | "borderColor": "#ccc" 128 | }, 129 | "emphasis": { 130 | "borderWidth": 0, 131 | "borderColor": "#ccc" 132 | } 133 | } 134 | }, 135 | "sankey": { 136 | "itemStyle": { 137 | "normal": { 138 | "borderWidth": 0, 139 | "borderColor": "#ccc" 140 | }, 141 | "emphasis": { 142 | "borderWidth": 0, 143 | "borderColor": "#ccc" 144 | } 145 | } 146 | }, 147 | "funnel": { 148 | "itemStyle": { 149 | "normal": { 150 | "borderWidth": 0, 151 | "borderColor": "#ccc" 152 | }, 153 | "emphasis": { 154 | "borderWidth": 0, 155 | "borderColor": "#ccc" 156 | } 157 | } 158 | }, 159 | "gauge": { 160 | "itemStyle": { 161 | "normal": { 162 | "borderWidth": 0, 163 | "borderColor": "#ccc" 164 | }, 165 | "emphasis": { 166 | "borderWidth": 0, 167 | "borderColor": "#ccc" 168 | } 169 | } 170 | }, 171 | "candlestick": { 172 | "itemStyle": { 173 | "normal": { 174 | "color": "#c23531", 175 | "color0": "#314656", 176 | "borderColor": "#c23531", 177 | "borderColor0": "#314656", 178 | "borderWidth": 1 179 | } 180 | } 181 | }, 182 | "graph": { 183 | "itemStyle": { 184 | "normal": { 185 | "borderWidth": 0, 186 | "borderColor": "#ccc" 187 | } 188 | }, 189 | "lineStyle": { 190 | "normal": { 191 | "width": 1, 192 | "color": "#aaaaaa" 193 | } 194 | }, 195 | "symbolSize": 4, 196 | "symbol": "emptyCircle", 197 | "smooth": false, 198 | "color": [ 199 | "#d87c7c", 200 | "#919e8b", 201 | "#d7ab82", 202 | "#6e7074", 203 | "#61a0a8", 204 | "#efa18d", 205 | "#787464", 206 | "#cc7e63", 207 | "#724e58", 208 | "#4b565b" 209 | ], 210 | "label": { 211 | "normal": { 212 | "textStyle": { 213 | "color": "#eeeeee" 214 | } 215 | } 216 | } 217 | }, 218 | "map": { 219 | "itemStyle": { 220 | "normal": { 221 | "areaColor": "#eeeeee", 222 | "borderColor": "#444444", 223 | "borderWidth": 0.5 224 | }, 225 | "emphasis": { 226 | "areaColor": "rgba(255,215,0,0.8)", 227 | "borderColor": "#444444", 228 | "borderWidth": 1 229 | } 230 | }, 231 | "label": { 232 | "normal": { 233 | "textStyle": { 234 | "color": "#000000" 235 | } 236 | }, 237 | "emphasis": { 238 | "textStyle": { 239 | "color": "rgb(100,0,0)" 240 | } 241 | } 242 | } 243 | }, 244 | "geo": { 245 | "itemStyle": { 246 | "normal": { 247 | "areaColor": "#eeeeee", 248 | "borderColor": "#444444", 249 | "borderWidth": 0.5 250 | }, 251 | "emphasis": { 252 | "areaColor": "rgba(255,215,0,0.8)", 253 | "borderColor": "#444444", 254 | "borderWidth": 1 255 | } 256 | }, 257 | "label": { 258 | "normal": { 259 | "textStyle": { 260 | "color": "#000000" 261 | } 262 | }, 263 | "emphasis": { 264 | "textStyle": { 265 | "color": "rgb(100,0,0)" 266 | } 267 | } 268 | } 269 | }, 270 | "categoryAxis": { 271 | "axisLine": { 272 | "show": true, 273 | "lineStyle": { 274 | "color": "#333" 275 | } 276 | }, 277 | "axisTick": { 278 | "show": true, 279 | "lineStyle": { 280 | "color": "#333" 281 | } 282 | }, 283 | "axisLabel": { 284 | "show": true, 285 | "textStyle": { 286 | "color": "#333" 287 | } 288 | }, 289 | "splitLine": { 290 | "show": false, 291 | "lineStyle": { 292 | "color": [ 293 | "#ccc" 294 | ] 295 | } 296 | }, 297 | "splitArea": { 298 | "show": false, 299 | "areaStyle": { 300 | "color": [ 301 | "rgba(250,250,250,0.3)", 302 | "rgba(200,200,200,0.3)" 303 | ] 304 | } 305 | } 306 | }, 307 | "valueAxis": { 308 | "axisLine": { 309 | "show": true, 310 | "lineStyle": { 311 | "color": "#333" 312 | } 313 | }, 314 | "axisTick": { 315 | "show": true, 316 | "lineStyle": { 317 | "color": "#333" 318 | } 319 | }, 320 | "axisLabel": { 321 | "show": true, 322 | "textStyle": { 323 | "color": "#333" 324 | } 325 | }, 326 | "splitLine": { 327 | "show": true, 328 | "lineStyle": { 329 | "color": [ 330 | "#ccc" 331 | ] 332 | } 333 | }, 334 | "splitArea": { 335 | "show": false, 336 | "areaStyle": { 337 | "color": [ 338 | "rgba(250,250,250,0.3)", 339 | "rgba(200,200,200,0.3)" 340 | ] 341 | } 342 | } 343 | }, 344 | "logAxis": { 345 | "axisLine": { 346 | "show": true, 347 | "lineStyle": { 348 | "color": "#333" 349 | } 350 | }, 351 | "axisTick": { 352 | "show": true, 353 | "lineStyle": { 354 | "color": "#333" 355 | } 356 | }, 357 | "axisLabel": { 358 | "show": true, 359 | "textStyle": { 360 | "color": "#333" 361 | } 362 | }, 363 | "splitLine": { 364 | "show": true, 365 | "lineStyle": { 366 | "color": [ 367 | "#ccc" 368 | ] 369 | } 370 | }, 371 | "splitArea": { 372 | "show": false, 373 | "areaStyle": { 374 | "color": [ 375 | "rgba(250,250,250,0.3)", 376 | "rgba(200,200,200,0.3)" 377 | ] 378 | } 379 | } 380 | }, 381 | "timeAxis": { 382 | "axisLine": { 383 | "show": true, 384 | "lineStyle": { 385 | "color": "#333" 386 | } 387 | }, 388 | "axisTick": { 389 | "show": true, 390 | "lineStyle": { 391 | "color": "#333" 392 | } 393 | }, 394 | "axisLabel": { 395 | "show": true, 396 | "textStyle": { 397 | "color": "#333" 398 | } 399 | }, 400 | "splitLine": { 401 | "show": true, 402 | "lineStyle": { 403 | "color": [ 404 | "#ccc" 405 | ] 406 | } 407 | }, 408 | "splitArea": { 409 | "show": false, 410 | "areaStyle": { 411 | "color": [ 412 | "rgba(250,250,250,0.3)", 413 | "rgba(200,200,200,0.3)" 414 | ] 415 | } 416 | } 417 | }, 418 | "toolbox": { 419 | "iconStyle": { 420 | "normal": { 421 | "borderColor": "#999999" 422 | }, 423 | "emphasis": { 424 | "borderColor": "#666666" 425 | } 426 | } 427 | }, 428 | "legend": { 429 | "textStyle": { 430 | "color": "#333333" 431 | } 432 | }, 433 | "tooltip": { 434 | "axisPointer": { 435 | "lineStyle": { 436 | "color": "#cccccc", 437 | "width": 1 438 | }, 439 | "crossStyle": { 440 | "color": "#cccccc", 441 | "width": 1 442 | } 443 | } 444 | }, 445 | "timeline": { 446 | "lineStyle": { 447 | "color": "#293c55", 448 | "width": 1 449 | }, 450 | "itemStyle": { 451 | "normal": { 452 | "color": "#293c55", 453 | "borderWidth": 1 454 | }, 455 | "emphasis": { 456 | "color": "#a9334c" 457 | } 458 | }, 459 | "controlStyle": { 460 | "normal": { 461 | "color": "#293c55", 462 | "borderColor": "#293c55", 463 | "borderWidth": 0.5 464 | }, 465 | "emphasis": { 466 | "color": "#293c55", 467 | "borderColor": "#293c55", 468 | "borderWidth": 0.5 469 | } 470 | }, 471 | "checkpointStyle": { 472 | "color": "#e43c59", 473 | "borderColor": "rgba(194,53,49,0.5)" 474 | }, 475 | "label": { 476 | "normal": { 477 | "textStyle": { 478 | "color": "#293c55" 479 | } 480 | }, 481 | "emphasis": { 482 | "textStyle": { 483 | "color": "#293c55" 484 | } 485 | } 486 | } 487 | }, 488 | "visualMap": { 489 | "color": [ 490 | "#bf444c", 491 | "#d88273", 492 | "#f6efa6" 493 | ] 494 | }, 495 | "dataZoom": { 496 | "backgroundColor": "rgba(47,69,84,0)", 497 | "dataBackgroundColor": "rgba(47,69,84,0.3)", 498 | "fillerColor": "rgba(167,183,204,0.4)", 499 | "handleColor": "#a7b7cc", 500 | "handleSize": "100%", 501 | "textStyle": { 502 | "color": "#333333" 503 | } 504 | }, 505 | "markPoint": { 506 | "label": { 507 | "normal": { 508 | "textStyle": { 509 | "color": "#eeeeee" 510 | } 511 | }, 512 | "emphasis": { 513 | "textStyle": { 514 | "color": "#eeeeee" 515 | } 516 | } 517 | } 518 | } 519 | }); 520 | })); 521 | -------------------------------------------------------------------------------- /resources/assets/themes/walden.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('walden', { 23 | "color": [ 24 | "#3fb1e3", 25 | "#6be6c1", 26 | "#626c91", 27 | "#a0a7e6", 28 | "#c4ebad", 29 | "#96dee8" 30 | ], 31 | "backgroundColor": "rgba(252,252,252,0)", 32 | "textStyle": {}, 33 | "title": { 34 | "textStyle": { 35 | "color": "#666666" 36 | }, 37 | "subtextStyle": { 38 | "color": "#999999" 39 | } 40 | }, 41 | "line": { 42 | "itemStyle": { 43 | "normal": { 44 | "borderWidth": "2" 45 | } 46 | }, 47 | "lineStyle": { 48 | "normal": { 49 | "width": "3" 50 | } 51 | }, 52 | "symbolSize": "8", 53 | "symbol": "emptyCircle", 54 | "smooth": false 55 | }, 56 | "radar": { 57 | "itemStyle": { 58 | "normal": { 59 | "borderWidth": "2" 60 | } 61 | }, 62 | "lineStyle": { 63 | "normal": { 64 | "width": "3" 65 | } 66 | }, 67 | "symbolSize": "8", 68 | "symbol": "emptyCircle", 69 | "smooth": false 70 | }, 71 | "bar": { 72 | "itemStyle": { 73 | "normal": { 74 | "barBorderWidth": 0, 75 | "barBorderColor": "#ccc" 76 | }, 77 | "emphasis": { 78 | "barBorderWidth": 0, 79 | "barBorderColor": "#ccc" 80 | } 81 | } 82 | }, 83 | "pie": { 84 | "itemStyle": { 85 | "normal": { 86 | "borderWidth": 0, 87 | "borderColor": "#ccc" 88 | }, 89 | "emphasis": { 90 | "borderWidth": 0, 91 | "borderColor": "#ccc" 92 | } 93 | } 94 | }, 95 | "scatter": { 96 | "itemStyle": { 97 | "normal": { 98 | "borderWidth": 0, 99 | "borderColor": "#ccc" 100 | }, 101 | "emphasis": { 102 | "borderWidth": 0, 103 | "borderColor": "#ccc" 104 | } 105 | } 106 | }, 107 | "boxplot": { 108 | "itemStyle": { 109 | "normal": { 110 | "borderWidth": 0, 111 | "borderColor": "#ccc" 112 | }, 113 | "emphasis": { 114 | "borderWidth": 0, 115 | "borderColor": "#ccc" 116 | } 117 | } 118 | }, 119 | "parallel": { 120 | "itemStyle": { 121 | "normal": { 122 | "borderWidth": 0, 123 | "borderColor": "#ccc" 124 | }, 125 | "emphasis": { 126 | "borderWidth": 0, 127 | "borderColor": "#ccc" 128 | } 129 | } 130 | }, 131 | "sankey": { 132 | "itemStyle": { 133 | "normal": { 134 | "borderWidth": 0, 135 | "borderColor": "#ccc" 136 | }, 137 | "emphasis": { 138 | "borderWidth": 0, 139 | "borderColor": "#ccc" 140 | } 141 | } 142 | }, 143 | "funnel": { 144 | "itemStyle": { 145 | "normal": { 146 | "borderWidth": 0, 147 | "borderColor": "#ccc" 148 | }, 149 | "emphasis": { 150 | "borderWidth": 0, 151 | "borderColor": "#ccc" 152 | } 153 | } 154 | }, 155 | "gauge": { 156 | "itemStyle": { 157 | "normal": { 158 | "borderWidth": 0, 159 | "borderColor": "#ccc" 160 | }, 161 | "emphasis": { 162 | "borderWidth": 0, 163 | "borderColor": "#ccc" 164 | } 165 | } 166 | }, 167 | "candlestick": { 168 | "itemStyle": { 169 | "normal": { 170 | "color": "#e6a0d2", 171 | "color0": "transparent", 172 | "borderColor": "#e6a0d2", 173 | "borderColor0": "#3fb1e3", 174 | "borderWidth": "2" 175 | } 176 | } 177 | }, 178 | "graph": { 179 | "itemStyle": { 180 | "normal": { 181 | "borderWidth": 0, 182 | "borderColor": "#ccc" 183 | } 184 | }, 185 | "lineStyle": { 186 | "normal": { 187 | "width": "1", 188 | "color": "#cccccc" 189 | } 190 | }, 191 | "symbolSize": "8", 192 | "symbol": "emptyCircle", 193 | "smooth": false, 194 | "color": [ 195 | "#3fb1e3", 196 | "#6be6c1", 197 | "#626c91", 198 | "#a0a7e6", 199 | "#c4ebad", 200 | "#96dee8" 201 | ], 202 | "label": { 203 | "normal": { 204 | "textStyle": { 205 | "color": "#ffffff" 206 | } 207 | } 208 | } 209 | }, 210 | "map": { 211 | "itemStyle": { 212 | "normal": { 213 | "areaColor": "#eeeeee", 214 | "borderColor": "#aaaaaa", 215 | "borderWidth": 0.5 216 | }, 217 | "emphasis": { 218 | "areaColor": "rgba(63,177,227,0.25)", 219 | "borderColor": "#3fb1e3", 220 | "borderWidth": 1 221 | } 222 | }, 223 | "label": { 224 | "normal": { 225 | "textStyle": { 226 | "color": "#ffffff" 227 | } 228 | }, 229 | "emphasis": { 230 | "textStyle": { 231 | "color": "rgb(63,177,227)" 232 | } 233 | } 234 | } 235 | }, 236 | "geo": { 237 | "itemStyle": { 238 | "normal": { 239 | "areaColor": "#eeeeee", 240 | "borderColor": "#aaaaaa", 241 | "borderWidth": 0.5 242 | }, 243 | "emphasis": { 244 | "areaColor": "rgba(63,177,227,0.25)", 245 | "borderColor": "#3fb1e3", 246 | "borderWidth": 1 247 | } 248 | }, 249 | "label": { 250 | "normal": { 251 | "textStyle": { 252 | "color": "#ffffff" 253 | } 254 | }, 255 | "emphasis": { 256 | "textStyle": { 257 | "color": "rgb(63,177,227)" 258 | } 259 | } 260 | } 261 | }, 262 | "categoryAxis": { 263 | "axisLine": { 264 | "show": true, 265 | "lineStyle": { 266 | "color": "#cccccc" 267 | } 268 | }, 269 | "axisTick": { 270 | "show": false, 271 | "lineStyle": { 272 | "color": "#333" 273 | } 274 | }, 275 | "axisLabel": { 276 | "show": true, 277 | "textStyle": { 278 | "color": "#999999" 279 | } 280 | }, 281 | "splitLine": { 282 | "show": true, 283 | "lineStyle": { 284 | "color": [ 285 | "#eeeeee" 286 | ] 287 | } 288 | }, 289 | "splitArea": { 290 | "show": false, 291 | "areaStyle": { 292 | "color": [ 293 | "rgba(250,250,250,0.05)", 294 | "rgba(200,200,200,0.02)" 295 | ] 296 | } 297 | } 298 | }, 299 | "valueAxis": { 300 | "axisLine": { 301 | "show": true, 302 | "lineStyle": { 303 | "color": "#cccccc" 304 | } 305 | }, 306 | "axisTick": { 307 | "show": false, 308 | "lineStyle": { 309 | "color": "#333" 310 | } 311 | }, 312 | "axisLabel": { 313 | "show": true, 314 | "textStyle": { 315 | "color": "#999999" 316 | } 317 | }, 318 | "splitLine": { 319 | "show": true, 320 | "lineStyle": { 321 | "color": [ 322 | "#eeeeee" 323 | ] 324 | } 325 | }, 326 | "splitArea": { 327 | "show": false, 328 | "areaStyle": { 329 | "color": [ 330 | "rgba(250,250,250,0.05)", 331 | "rgba(200,200,200,0.02)" 332 | ] 333 | } 334 | } 335 | }, 336 | "logAxis": { 337 | "axisLine": { 338 | "show": true, 339 | "lineStyle": { 340 | "color": "#cccccc" 341 | } 342 | }, 343 | "axisTick": { 344 | "show": false, 345 | "lineStyle": { 346 | "color": "#333" 347 | } 348 | }, 349 | "axisLabel": { 350 | "show": true, 351 | "textStyle": { 352 | "color": "#999999" 353 | } 354 | }, 355 | "splitLine": { 356 | "show": true, 357 | "lineStyle": { 358 | "color": [ 359 | "#eeeeee" 360 | ] 361 | } 362 | }, 363 | "splitArea": { 364 | "show": false, 365 | "areaStyle": { 366 | "color": [ 367 | "rgba(250,250,250,0.05)", 368 | "rgba(200,200,200,0.02)" 369 | ] 370 | } 371 | } 372 | }, 373 | "timeAxis": { 374 | "axisLine": { 375 | "show": true, 376 | "lineStyle": { 377 | "color": "#cccccc" 378 | } 379 | }, 380 | "axisTick": { 381 | "show": false, 382 | "lineStyle": { 383 | "color": "#333" 384 | } 385 | }, 386 | "axisLabel": { 387 | "show": true, 388 | "textStyle": { 389 | "color": "#999999" 390 | } 391 | }, 392 | "splitLine": { 393 | "show": true, 394 | "lineStyle": { 395 | "color": [ 396 | "#eeeeee" 397 | ] 398 | } 399 | }, 400 | "splitArea": { 401 | "show": false, 402 | "areaStyle": { 403 | "color": [ 404 | "rgba(250,250,250,0.05)", 405 | "rgba(200,200,200,0.02)" 406 | ] 407 | } 408 | } 409 | }, 410 | "toolbox": { 411 | "iconStyle": { 412 | "normal": { 413 | "borderColor": "#999999" 414 | }, 415 | "emphasis": { 416 | "borderColor": "#666666" 417 | } 418 | } 419 | }, 420 | "legend": { 421 | "textStyle": { 422 | "color": "#999999" 423 | } 424 | }, 425 | "tooltip": { 426 | "axisPointer": { 427 | "lineStyle": { 428 | "color": "#cccccc", 429 | "width": 1 430 | }, 431 | "crossStyle": { 432 | "color": "#cccccc", 433 | "width": 1 434 | } 435 | } 436 | }, 437 | "timeline": { 438 | "lineStyle": { 439 | "color": "#626c91", 440 | "width": 1 441 | }, 442 | "itemStyle": { 443 | "normal": { 444 | "color": "#626c91", 445 | "borderWidth": 1 446 | }, 447 | "emphasis": { 448 | "color": "#626c91" 449 | } 450 | }, 451 | "controlStyle": { 452 | "normal": { 453 | "color": "#626c91", 454 | "borderColor": "#626c91", 455 | "borderWidth": 0.5 456 | }, 457 | "emphasis": { 458 | "color": "#626c91", 459 | "borderColor": "#626c91", 460 | "borderWidth": 0.5 461 | } 462 | }, 463 | "checkpointStyle": { 464 | "color": "#3fb1e3", 465 | "borderColor": "rgba(63,177,227,0.15)" 466 | }, 467 | "label": { 468 | "normal": { 469 | "textStyle": { 470 | "color": "#626c91" 471 | } 472 | }, 473 | "emphasis": { 474 | "textStyle": { 475 | "color": "#626c91" 476 | } 477 | } 478 | } 479 | }, 480 | "visualMap": { 481 | "color": [ 482 | "#2a99c9", 483 | "#afe8ff" 484 | ] 485 | }, 486 | "dataZoom": { 487 | "backgroundColor": "rgba(255,255,255,0)", 488 | "dataBackgroundColor": "rgba(222,222,222,1)", 489 | "fillerColor": "rgba(114,230,212,0.25)", 490 | "handleColor": "#cccccc", 491 | "handleSize": "100%", 492 | "textStyle": { 493 | "color": "#999999" 494 | } 495 | }, 496 | "markPoint": { 497 | "label": { 498 | "normal": { 499 | "textStyle": { 500 | "color": "#ffffff" 501 | } 502 | }, 503 | "emphasis": { 504 | "textStyle": { 505 | "color": "#ffffff" 506 | } 507 | } 508 | } 509 | } 510 | }); 511 | })); 512 | -------------------------------------------------------------------------------- /resources/assets/themes/westeros.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('westeros', { 23 | "color": [ 24 | "#516b91", 25 | "#59c4e6", 26 | "#edafda", 27 | "#93b7e3", 28 | "#a5e7f0", 29 | "#cbb0e3" 30 | ], 31 | "backgroundColor": "rgba(0,0,0,0)", 32 | "textStyle": {}, 33 | "title": { 34 | "textStyle": { 35 | "color": "#516b91" 36 | }, 37 | "subtextStyle": { 38 | "color": "#93b7e3" 39 | } 40 | }, 41 | "line": { 42 | "itemStyle": { 43 | "normal": { 44 | "borderWidth": "2" 45 | } 46 | }, 47 | "lineStyle": { 48 | "normal": { 49 | "width": "2" 50 | } 51 | }, 52 | "symbolSize": "6", 53 | "symbol": "emptyCircle", 54 | "smooth": true 55 | }, 56 | "radar": { 57 | "itemStyle": { 58 | "normal": { 59 | "borderWidth": "2" 60 | } 61 | }, 62 | "lineStyle": { 63 | "normal": { 64 | "width": "2" 65 | } 66 | }, 67 | "symbolSize": "6", 68 | "symbol": "emptyCircle", 69 | "smooth": true 70 | }, 71 | "bar": { 72 | "itemStyle": { 73 | "normal": { 74 | "barBorderWidth": 0, 75 | "barBorderColor": "#ccc" 76 | }, 77 | "emphasis": { 78 | "barBorderWidth": 0, 79 | "barBorderColor": "#ccc" 80 | } 81 | } 82 | }, 83 | "pie": { 84 | "itemStyle": { 85 | "normal": { 86 | "borderWidth": 0, 87 | "borderColor": "#ccc" 88 | }, 89 | "emphasis": { 90 | "borderWidth": 0, 91 | "borderColor": "#ccc" 92 | } 93 | } 94 | }, 95 | "scatter": { 96 | "itemStyle": { 97 | "normal": { 98 | "borderWidth": 0, 99 | "borderColor": "#ccc" 100 | }, 101 | "emphasis": { 102 | "borderWidth": 0, 103 | "borderColor": "#ccc" 104 | } 105 | } 106 | }, 107 | "boxplot": { 108 | "itemStyle": { 109 | "normal": { 110 | "borderWidth": 0, 111 | "borderColor": "#ccc" 112 | }, 113 | "emphasis": { 114 | "borderWidth": 0, 115 | "borderColor": "#ccc" 116 | } 117 | } 118 | }, 119 | "parallel": { 120 | "itemStyle": { 121 | "normal": { 122 | "borderWidth": 0, 123 | "borderColor": "#ccc" 124 | }, 125 | "emphasis": { 126 | "borderWidth": 0, 127 | "borderColor": "#ccc" 128 | } 129 | } 130 | }, 131 | "sankey": { 132 | "itemStyle": { 133 | "normal": { 134 | "borderWidth": 0, 135 | "borderColor": "#ccc" 136 | }, 137 | "emphasis": { 138 | "borderWidth": 0, 139 | "borderColor": "#ccc" 140 | } 141 | } 142 | }, 143 | "funnel": { 144 | "itemStyle": { 145 | "normal": { 146 | "borderWidth": 0, 147 | "borderColor": "#ccc" 148 | }, 149 | "emphasis": { 150 | "borderWidth": 0, 151 | "borderColor": "#ccc" 152 | } 153 | } 154 | }, 155 | "gauge": { 156 | "itemStyle": { 157 | "normal": { 158 | "borderWidth": 0, 159 | "borderColor": "#ccc" 160 | }, 161 | "emphasis": { 162 | "borderWidth": 0, 163 | "borderColor": "#ccc" 164 | } 165 | } 166 | }, 167 | "candlestick": { 168 | "itemStyle": { 169 | "normal": { 170 | "color": "#edafda", 171 | "color0": "transparent", 172 | "borderColor": "#d680bc", 173 | "borderColor0": "#8fd3e8", 174 | "borderWidth": "2" 175 | } 176 | } 177 | }, 178 | "graph": { 179 | "itemStyle": { 180 | "normal": { 181 | "borderWidth": 0, 182 | "borderColor": "#ccc" 183 | } 184 | }, 185 | "lineStyle": { 186 | "normal": { 187 | "width": 1, 188 | "color": "#aaaaaa" 189 | } 190 | }, 191 | "symbolSize": "6", 192 | "symbol": "emptyCircle", 193 | "smooth": true, 194 | "color": [ 195 | "#516b91", 196 | "#59c4e6", 197 | "#edafda", 198 | "#93b7e3", 199 | "#a5e7f0", 200 | "#cbb0e3" 201 | ], 202 | "label": { 203 | "normal": { 204 | "textStyle": { 205 | "color": "#eeeeee" 206 | } 207 | } 208 | } 209 | }, 210 | "map": { 211 | "itemStyle": { 212 | "normal": { 213 | "areaColor": "#f3f3f3", 214 | "borderColor": "#516b91", 215 | "borderWidth": 0.5 216 | }, 217 | "emphasis": { 218 | "areaColor": "rgba(165,231,240,1)", 219 | "borderColor": "#516b91", 220 | "borderWidth": 1 221 | } 222 | }, 223 | "label": { 224 | "normal": { 225 | "textStyle": { 226 | "color": "#000000" 227 | } 228 | }, 229 | "emphasis": { 230 | "textStyle": { 231 | "color": "rgb(81,107,145)" 232 | } 233 | } 234 | } 235 | }, 236 | "geo": { 237 | "itemStyle": { 238 | "normal": { 239 | "areaColor": "#f3f3f3", 240 | "borderColor": "#516b91", 241 | "borderWidth": 0.5 242 | }, 243 | "emphasis": { 244 | "areaColor": "rgba(165,231,240,1)", 245 | "borderColor": "#516b91", 246 | "borderWidth": 1 247 | } 248 | }, 249 | "label": { 250 | "normal": { 251 | "textStyle": { 252 | "color": "#000000" 253 | } 254 | }, 255 | "emphasis": { 256 | "textStyle": { 257 | "color": "rgb(81,107,145)" 258 | } 259 | } 260 | } 261 | }, 262 | "categoryAxis": { 263 | "axisLine": { 264 | "show": true, 265 | "lineStyle": { 266 | "color": "#cccccc" 267 | } 268 | }, 269 | "axisTick": { 270 | "show": false, 271 | "lineStyle": { 272 | "color": "#333" 273 | } 274 | }, 275 | "axisLabel": { 276 | "show": true, 277 | "textStyle": { 278 | "color": "#999999" 279 | } 280 | }, 281 | "splitLine": { 282 | "show": true, 283 | "lineStyle": { 284 | "color": [ 285 | "#eeeeee" 286 | ] 287 | } 288 | }, 289 | "splitArea": { 290 | "show": false, 291 | "areaStyle": { 292 | "color": [ 293 | "rgba(250,250,250,0.05)", 294 | "rgba(200,200,200,0.02)" 295 | ] 296 | } 297 | } 298 | }, 299 | "valueAxis": { 300 | "axisLine": { 301 | "show": true, 302 | "lineStyle": { 303 | "color": "#cccccc" 304 | } 305 | }, 306 | "axisTick": { 307 | "show": false, 308 | "lineStyle": { 309 | "color": "#333" 310 | } 311 | }, 312 | "axisLabel": { 313 | "show": true, 314 | "textStyle": { 315 | "color": "#999999" 316 | } 317 | }, 318 | "splitLine": { 319 | "show": true, 320 | "lineStyle": { 321 | "color": [ 322 | "#eeeeee" 323 | ] 324 | } 325 | }, 326 | "splitArea": { 327 | "show": false, 328 | "areaStyle": { 329 | "color": [ 330 | "rgba(250,250,250,0.05)", 331 | "rgba(200,200,200,0.02)" 332 | ] 333 | } 334 | } 335 | }, 336 | "logAxis": { 337 | "axisLine": { 338 | "show": true, 339 | "lineStyle": { 340 | "color": "#cccccc" 341 | } 342 | }, 343 | "axisTick": { 344 | "show": false, 345 | "lineStyle": { 346 | "color": "#333" 347 | } 348 | }, 349 | "axisLabel": { 350 | "show": true, 351 | "textStyle": { 352 | "color": "#999999" 353 | } 354 | }, 355 | "splitLine": { 356 | "show": true, 357 | "lineStyle": { 358 | "color": [ 359 | "#eeeeee" 360 | ] 361 | } 362 | }, 363 | "splitArea": { 364 | "show": false, 365 | "areaStyle": { 366 | "color": [ 367 | "rgba(250,250,250,0.05)", 368 | "rgba(200,200,200,0.02)" 369 | ] 370 | } 371 | } 372 | }, 373 | "timeAxis": { 374 | "axisLine": { 375 | "show": true, 376 | "lineStyle": { 377 | "color": "#cccccc" 378 | } 379 | }, 380 | "axisTick": { 381 | "show": false, 382 | "lineStyle": { 383 | "color": "#333" 384 | } 385 | }, 386 | "axisLabel": { 387 | "show": true, 388 | "textStyle": { 389 | "color": "#999999" 390 | } 391 | }, 392 | "splitLine": { 393 | "show": true, 394 | "lineStyle": { 395 | "color": [ 396 | "#eeeeee" 397 | ] 398 | } 399 | }, 400 | "splitArea": { 401 | "show": false, 402 | "areaStyle": { 403 | "color": [ 404 | "rgba(250,250,250,0.05)", 405 | "rgba(200,200,200,0.02)" 406 | ] 407 | } 408 | } 409 | }, 410 | "toolbox": { 411 | "iconStyle": { 412 | "normal": { 413 | "borderColor": "#999999" 414 | }, 415 | "emphasis": { 416 | "borderColor": "#666666" 417 | } 418 | } 419 | }, 420 | "legend": { 421 | "textStyle": { 422 | "color": "#999999" 423 | } 424 | }, 425 | "tooltip": { 426 | "axisPointer": { 427 | "lineStyle": { 428 | "color": "#cccccc", 429 | "width": 1 430 | }, 431 | "crossStyle": { 432 | "color": "#cccccc", 433 | "width": 1 434 | } 435 | } 436 | }, 437 | "timeline": { 438 | "lineStyle": { 439 | "color": "#8fd3e8", 440 | "width": 1 441 | }, 442 | "itemStyle": { 443 | "normal": { 444 | "color": "#8fd3e8", 445 | "borderWidth": 1 446 | }, 447 | "emphasis": { 448 | "color": "#8fd3e8" 449 | } 450 | }, 451 | "controlStyle": { 452 | "normal": { 453 | "color": "#8fd3e8", 454 | "borderColor": "#8fd3e8", 455 | "borderWidth": 0.5 456 | }, 457 | "emphasis": { 458 | "color": "#8fd3e8", 459 | "borderColor": "#8fd3e8", 460 | "borderWidth": 0.5 461 | } 462 | }, 463 | "checkpointStyle": { 464 | "color": "#8fd3e8", 465 | "borderColor": "rgba(138,124,168,0.37)" 466 | }, 467 | "label": { 468 | "normal": { 469 | "textStyle": { 470 | "color": "#8fd3e8" 471 | } 472 | }, 473 | "emphasis": { 474 | "textStyle": { 475 | "color": "#8fd3e8" 476 | } 477 | } 478 | } 479 | }, 480 | "visualMap": { 481 | "color": [ 482 | "#516b91", 483 | "#59c4e6", 484 | "#a5e7f0" 485 | ] 486 | }, 487 | "dataZoom": { 488 | "backgroundColor": "rgba(0,0,0,0)", 489 | "dataBackgroundColor": "rgba(255,255,255,0.3)", 490 | "fillerColor": "rgba(167,183,204,0.4)", 491 | "handleColor": "#a7b7cc", 492 | "handleSize": "100%", 493 | "textStyle": { 494 | "color": "#333333" 495 | } 496 | }, 497 | "markPoint": { 498 | "label": { 499 | "normal": { 500 | "textStyle": { 501 | "color": "#eeeeee" 502 | } 503 | }, 504 | "emphasis": { 505 | "textStyle": { 506 | "color": "#eeeeee" 507 | } 508 | } 509 | } 510 | } 511 | }); 512 | })); 513 | -------------------------------------------------------------------------------- /resources/assets/themes/wonderland.js: -------------------------------------------------------------------------------- 1 | (function (root, factory) { 2 | if (typeof define === 'function' && define.amd) { 3 | // AMD. Register as an anonymous module. 4 | define(['exports', 'echarts'], factory); 5 | } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { 6 | // CommonJS 7 | factory(exports, require('echarts')); 8 | } else { 9 | // Browser globals 10 | factory({}, root.echarts); 11 | } 12 | }(this, function (exports, echarts) { 13 | var log = function (msg) { 14 | if (typeof console !== 'undefined') { 15 | console && console.error && console.error(msg); 16 | } 17 | }; 18 | if (!echarts) { 19 | log('ECharts is not Loaded'); 20 | return; 21 | } 22 | echarts.registerTheme('wonderland', { 23 | "color": [ 24 | "#4ea397", 25 | "#22c3aa", 26 | "#7bd9a5", 27 | "#d0648a", 28 | "#f58db2", 29 | "#f2b3c9" 30 | ], 31 | "backgroundColor": "rgba(255,255,255,0)", 32 | "textStyle": {}, 33 | "title": { 34 | "textStyle": { 35 | "color": "#666666" 36 | }, 37 | "subtextStyle": { 38 | "color": "#999999" 39 | } 40 | }, 41 | "line": { 42 | "itemStyle": { 43 | "normal": { 44 | "borderWidth": "2" 45 | } 46 | }, 47 | "lineStyle": { 48 | "normal": { 49 | "width": "3" 50 | } 51 | }, 52 | "symbolSize": "8", 53 | "symbol": "emptyCircle", 54 | "smooth": false 55 | }, 56 | "radar": { 57 | "itemStyle": { 58 | "normal": { 59 | "borderWidth": "2" 60 | } 61 | }, 62 | "lineStyle": { 63 | "normal": { 64 | "width": "3" 65 | } 66 | }, 67 | "symbolSize": "8", 68 | "symbol": "emptyCircle", 69 | "smooth": false 70 | }, 71 | "bar": { 72 | "itemStyle": { 73 | "normal": { 74 | "barBorderWidth": 0, 75 | "barBorderColor": "#ccc" 76 | }, 77 | "emphasis": { 78 | "barBorderWidth": 0, 79 | "barBorderColor": "#ccc" 80 | } 81 | } 82 | }, 83 | "pie": { 84 | "itemStyle": { 85 | "normal": { 86 | "borderWidth": 0, 87 | "borderColor": "#ccc" 88 | }, 89 | "emphasis": { 90 | "borderWidth": 0, 91 | "borderColor": "#ccc" 92 | } 93 | } 94 | }, 95 | "scatter": { 96 | "itemStyle": { 97 | "normal": { 98 | "borderWidth": 0, 99 | "borderColor": "#ccc" 100 | }, 101 | "emphasis": { 102 | "borderWidth": 0, 103 | "borderColor": "#ccc" 104 | } 105 | } 106 | }, 107 | "boxplot": { 108 | "itemStyle": { 109 | "normal": { 110 | "borderWidth": 0, 111 | "borderColor": "#ccc" 112 | }, 113 | "emphasis": { 114 | "borderWidth": 0, 115 | "borderColor": "#ccc" 116 | } 117 | } 118 | }, 119 | "parallel": { 120 | "itemStyle": { 121 | "normal": { 122 | "borderWidth": 0, 123 | "borderColor": "#ccc" 124 | }, 125 | "emphasis": { 126 | "borderWidth": 0, 127 | "borderColor": "#ccc" 128 | } 129 | } 130 | }, 131 | "sankey": { 132 | "itemStyle": { 133 | "normal": { 134 | "borderWidth": 0, 135 | "borderColor": "#ccc" 136 | }, 137 | "emphasis": { 138 | "borderWidth": 0, 139 | "borderColor": "#ccc" 140 | } 141 | } 142 | }, 143 | "funnel": { 144 | "itemStyle": { 145 | "normal": { 146 | "borderWidth": 0, 147 | "borderColor": "#ccc" 148 | }, 149 | "emphasis": { 150 | "borderWidth": 0, 151 | "borderColor": "#ccc" 152 | } 153 | } 154 | }, 155 | "gauge": { 156 | "itemStyle": { 157 | "normal": { 158 | "borderWidth": 0, 159 | "borderColor": "#ccc" 160 | }, 161 | "emphasis": { 162 | "borderWidth": 0, 163 | "borderColor": "#ccc" 164 | } 165 | } 166 | }, 167 | "candlestick": { 168 | "itemStyle": { 169 | "normal": { 170 | "color": "#d0648a", 171 | "color0": "transparent", 172 | "borderColor": "#d0648a", 173 | "borderColor0": "#22c3aa", 174 | "borderWidth": "1" 175 | } 176 | } 177 | }, 178 | "graph": { 179 | "itemStyle": { 180 | "normal": { 181 | "borderWidth": 0, 182 | "borderColor": "#ccc" 183 | } 184 | }, 185 | "lineStyle": { 186 | "normal": { 187 | "width": "1", 188 | "color": "#cccccc" 189 | } 190 | }, 191 | "symbolSize": "8", 192 | "symbol": "emptyCircle", 193 | "smooth": false, 194 | "color": [ 195 | "#4ea397", 196 | "#22c3aa", 197 | "#7bd9a5", 198 | "#d0648a", 199 | "#f58db2", 200 | "#f2b3c9" 201 | ], 202 | "label": { 203 | "normal": { 204 | "textStyle": { 205 | "color": "#ffffff" 206 | } 207 | } 208 | } 209 | }, 210 | "map": { 211 | "itemStyle": { 212 | "normal": { 213 | "areaColor": "#eeeeee", 214 | "borderColor": "#999999", 215 | "borderWidth": 0.5 216 | }, 217 | "emphasis": { 218 | "areaColor": "rgba(34,195,170,0.25)", 219 | "borderColor": "#22c3aa", 220 | "borderWidth": 1 221 | } 222 | }, 223 | "label": { 224 | "normal": { 225 | "textStyle": { 226 | "color": "#28544e" 227 | } 228 | }, 229 | "emphasis": { 230 | "textStyle": { 231 | "color": "rgb(52,158,142)" 232 | } 233 | } 234 | } 235 | }, 236 | "geo": { 237 | "itemStyle": { 238 | "normal": { 239 | "areaColor": "#eeeeee", 240 | "borderColor": "#999999", 241 | "borderWidth": 0.5 242 | }, 243 | "emphasis": { 244 | "areaColor": "rgba(34,195,170,0.25)", 245 | "borderColor": "#22c3aa", 246 | "borderWidth": 1 247 | } 248 | }, 249 | "label": { 250 | "normal": { 251 | "textStyle": { 252 | "color": "#28544e" 253 | } 254 | }, 255 | "emphasis": { 256 | "textStyle": { 257 | "color": "rgb(52,158,142)" 258 | } 259 | } 260 | } 261 | }, 262 | "categoryAxis": { 263 | "axisLine": { 264 | "show": true, 265 | "lineStyle": { 266 | "color": "#cccccc" 267 | } 268 | }, 269 | "axisTick": { 270 | "show": false, 271 | "lineStyle": { 272 | "color": "#333" 273 | } 274 | }, 275 | "axisLabel": { 276 | "show": true, 277 | "textStyle": { 278 | "color": "#999999" 279 | } 280 | }, 281 | "splitLine": { 282 | "show": true, 283 | "lineStyle": { 284 | "color": [ 285 | "#eeeeee" 286 | ] 287 | } 288 | }, 289 | "splitArea": { 290 | "show": false, 291 | "areaStyle": { 292 | "color": [ 293 | "rgba(250,250,250,0.05)", 294 | "rgba(200,200,200,0.02)" 295 | ] 296 | } 297 | } 298 | }, 299 | "valueAxis": { 300 | "axisLine": { 301 | "show": true, 302 | "lineStyle": { 303 | "color": "#cccccc" 304 | } 305 | }, 306 | "axisTick": { 307 | "show": false, 308 | "lineStyle": { 309 | "color": "#333" 310 | } 311 | }, 312 | "axisLabel": { 313 | "show": true, 314 | "textStyle": { 315 | "color": "#999999" 316 | } 317 | }, 318 | "splitLine": { 319 | "show": true, 320 | "lineStyle": { 321 | "color": [ 322 | "#eeeeee" 323 | ] 324 | } 325 | }, 326 | "splitArea": { 327 | "show": false, 328 | "areaStyle": { 329 | "color": [ 330 | "rgba(250,250,250,0.05)", 331 | "rgba(200,200,200,0.02)" 332 | ] 333 | } 334 | } 335 | }, 336 | "logAxis": { 337 | "axisLine": { 338 | "show": true, 339 | "lineStyle": { 340 | "color": "#cccccc" 341 | } 342 | }, 343 | "axisTick": { 344 | "show": false, 345 | "lineStyle": { 346 | "color": "#333" 347 | } 348 | }, 349 | "axisLabel": { 350 | "show": true, 351 | "textStyle": { 352 | "color": "#999999" 353 | } 354 | }, 355 | "splitLine": { 356 | "show": true, 357 | "lineStyle": { 358 | "color": [ 359 | "#eeeeee" 360 | ] 361 | } 362 | }, 363 | "splitArea": { 364 | "show": false, 365 | "areaStyle": { 366 | "color": [ 367 | "rgba(250,250,250,0.05)", 368 | "rgba(200,200,200,0.02)" 369 | ] 370 | } 371 | } 372 | }, 373 | "timeAxis": { 374 | "axisLine": { 375 | "show": true, 376 | "lineStyle": { 377 | "color": "#cccccc" 378 | } 379 | }, 380 | "axisTick": { 381 | "show": false, 382 | "lineStyle": { 383 | "color": "#333" 384 | } 385 | }, 386 | "axisLabel": { 387 | "show": true, 388 | "textStyle": { 389 | "color": "#999999" 390 | } 391 | }, 392 | "splitLine": { 393 | "show": true, 394 | "lineStyle": { 395 | "color": [ 396 | "#eeeeee" 397 | ] 398 | } 399 | }, 400 | "splitArea": { 401 | "show": false, 402 | "areaStyle": { 403 | "color": [ 404 | "rgba(250,250,250,0.05)", 405 | "rgba(200,200,200,0.02)" 406 | ] 407 | } 408 | } 409 | }, 410 | "toolbox": { 411 | "iconStyle": { 412 | "normal": { 413 | "borderColor": "#999999" 414 | }, 415 | "emphasis": { 416 | "borderColor": "#666666" 417 | } 418 | } 419 | }, 420 | "legend": { 421 | "textStyle": { 422 | "color": "#999999" 423 | } 424 | }, 425 | "tooltip": { 426 | "axisPointer": { 427 | "lineStyle": { 428 | "color": "#cccccc", 429 | "width": 1 430 | }, 431 | "crossStyle": { 432 | "color": "#cccccc", 433 | "width": 1 434 | } 435 | } 436 | }, 437 | "timeline": { 438 | "lineStyle": { 439 | "color": "#4ea397", 440 | "width": 1 441 | }, 442 | "itemStyle": { 443 | "normal": { 444 | "color": "#4ea397", 445 | "borderWidth": 1 446 | }, 447 | "emphasis": { 448 | "color": "#4ea397" 449 | } 450 | }, 451 | "controlStyle": { 452 | "normal": { 453 | "color": "#4ea397", 454 | "borderColor": "#4ea397", 455 | "borderWidth": 0.5 456 | }, 457 | "emphasis": { 458 | "color": "#4ea397", 459 | "borderColor": "#4ea397", 460 | "borderWidth": 0.5 461 | } 462 | }, 463 | "checkpointStyle": { 464 | "color": "#4ea397", 465 | "borderColor": "rgba(60,235,210,0.3)" 466 | }, 467 | "label": { 468 | "normal": { 469 | "textStyle": { 470 | "color": "#4ea397" 471 | } 472 | }, 473 | "emphasis": { 474 | "textStyle": { 475 | "color": "#4ea397" 476 | } 477 | } 478 | } 479 | }, 480 | "visualMap": { 481 | "color": [ 482 | "#d0648a", 483 | "#22c3aa", 484 | "#adfff1" 485 | ] 486 | }, 487 | "dataZoom": { 488 | "backgroundColor": "rgba(255,255,255,0)", 489 | "dataBackgroundColor": "rgba(222,222,222,1)", 490 | "fillerColor": "rgba(114,230,212,0.25)", 491 | "handleColor": "#cccccc", 492 | "handleSize": "100%", 493 | "textStyle": { 494 | "color": "#999999" 495 | } 496 | }, 497 | "markPoint": { 498 | "label": { 499 | "normal": { 500 | "textStyle": { 501 | "color": "#ffffff" 502 | } 503 | }, 504 | "emphasis": { 505 | "textStyle": { 506 | "color": "#ffffff" 507 | } 508 | } 509 | } 510 | } 511 | }); 512 | })); 513 | -------------------------------------------------------------------------------- /resources/views/index.blade.php: -------------------------------------------------------------------------------- 1 |
2 | -------------------------------------------------------------------------------- /routes/web.php: -------------------------------------------------------------------------------- 1 | 'Echarts', 21 | 'path' => 'echarts', 22 | 'icon' => 'fa-bar-chart', 23 | ]; 24 | 25 | /** 26 | * @var string 27 | */ 28 | protected $view; 29 | 30 | /** 31 | * 图表标题 32 | * @var string 33 | */ 34 | protected $title = ''; 35 | 36 | /** 37 | * 图表子标题 38 | * @var string 39 | */ 40 | protected $subtext = ''; 41 | 42 | /** 43 | * @var array 44 | */ 45 | protected $data; 46 | 47 | /** 48 | * 图表配置 49 | * @var array 50 | */ 51 | protected $series; 52 | 53 | /** 54 | * 折线图是否显示阴影 55 | * @var bool 56 | */ 57 | protected $showShadow = false; 58 | /** 59 | * 工具箱配置 60 | * @var array 61 | */ 62 | protected $toolbox = [ 63 | 'show' => true, 64 | 'feature' => [ 65 | 'magicType' => ['type' => ['line', 'bar', 'stack', 'tiled']], 66 | 'restore' => [], 67 | 'saveAsImage' => [], 68 | ] 69 | ]; 70 | 71 | /** 72 | * 显示工具箱 73 | * @var bool 74 | */ 75 | protected $showToolbox = false; 76 | 77 | /** 78 | * 缩放 79 | * @var bool 80 | */ 81 | protected $dataZoom = false; 82 | 83 | /** 84 | * x轴倾斜角度 85 | * @var int 86 | */ 87 | protected $xAxisRotate; 88 | 89 | // 全局可配置 90 | protected $waterMarkText; 91 | 92 | /** 93 | * 主题 94 | * @var string 95 | */ 96 | protected $theme; 97 | 98 | /** 99 | * 图表样式 100 | * @var string 101 | */ 102 | protected $style = 'height: 350px;width:100%'; 103 | 104 | /** 105 | * @var bool 106 | */ 107 | protected $boundaryGap = false; 108 | 109 | /** 110 | * 数据源 111 | * @var 112 | */ 113 | protected $dataSource; 114 | 115 | /** 116 | * 图表类型 117 | * @var string 118 | */ 119 | protected $seriesType = 'line'; 120 | 121 | /** 122 | * 雷达图配置 123 | * @var array 124 | */ 125 | protected $indicator = []; 126 | 127 | public function __construct($title = '', $subtext = '') 128 | { 129 | $this->title = $title; 130 | $this->subtext = $subtext; 131 | 132 | $this->theme = config('echarts.theme', 'shine');//walden 133 | $this->view = config('echarts.view', 'echarts::index'); 134 | $this->waterMarkText = config('echarts.water_mark_text', 'Cyd622@Laravel-Admin'); 135 | } 136 | 137 | /** 138 | * @return mixed|string 139 | * @throws \Throwable 140 | */ 141 | public function render() 142 | { 143 | if ($this->theme) { 144 | Admin::headerJs("vendor/laravel-admin-ext/echarts/themes/{$this->theme}.js"); 145 | } 146 | 147 | return view($this->view, $this->buildOption())->render(); 148 | } 149 | 150 | /** 151 | * 构建参数 152 | * @return array 153 | */ 154 | private function buildOption() 155 | { 156 | // 全部是折线的 157 | if (!collect($this->series)->pluck('type')->every(function ($item) { 158 | return $item == 'line'; 159 | })) { 160 | $this->boundaryGap = true; 161 | } 162 | 163 | if (!$this->showToolbox) { 164 | data_set($this->toolbox, 'show', false); 165 | } 166 | 167 | $this->dataSource = $this->dataSource ?: $this->data; 168 | 169 | if ($this->showShadow) { 170 | data_set($this->series, '*.areaStyle', '{}'); 171 | } 172 | 173 | return [ 174 | 'title' => $this->title, 175 | 'style' => $this->style, 176 | 'subtext' => $this->subtext, 177 | 'waterMarkText' => $this->waterMarkText, 178 | 'dataZoom' => $this->dataZoom, 179 | 'xAxisRotate' => $this->xAxisRotate, 180 | 'theme' => $this->theme, 181 | 'seriesType' => $this->seriesType, 182 | 'showToolbox' => $this->showToolbox, 183 | 'boundaryGap' => (int)$this->boundaryGap, 184 | 'dataSource' => json_encode($this->dataSource), 185 | 'series' => json_encode($this->series), 186 | 'toolbox' => json_encode($this->toolbox), 187 | 'indicator' => json_encode($this->indicator), 188 | 'domId' => mt_rand(1, 9999), 189 | ]; 190 | } 191 | 192 | /** 193 | * 数据绑定 194 | * @param array $data 195 | * @return $this 196 | */ 197 | public function bindLegend(array $data) 198 | { 199 | $this->dataSource = collect($this->data)->map(function ($item) use ($data) { 200 | $tmp = []; 201 | foreach ($data as $k => $v) { 202 | $tmp[$v] = $item[$k]; 203 | // 如果没有配置图表类型,自动默认折线图 -1是第一个值是x轴的 204 | if (!$this->series || count($this->series) < count($data) - 1) { 205 | $this->series[] = ['type' => $this->seriesType]; 206 | } 207 | } 208 | return $tmp; 209 | })->toArray(); 210 | return $this; 211 | } 212 | 213 | /** 214 | * 数据源 215 | * @param array $data 216 | * @return Echarts 217 | */ 218 | public function setData(array $data) 219 | { 220 | $this->data = $data; 221 | return $this; 222 | } 223 | 224 | /** 225 | * 设置series参数 226 | * @param array $series 227 | * @return $this 228 | */ 229 | public function setSeries(array $series) 230 | { 231 | $this->series = $series; 232 | return $this; 233 | } 234 | 235 | /** 236 | * @param string $subtext 237 | * @return Echarts 238 | */ 239 | public function setSubtext(string $subtext) 240 | { 241 | $this->subtext = $subtext; 242 | return $this; 243 | } 244 | 245 | /** 246 | * @param string $title 247 | * @return Echarts 248 | */ 249 | public function setTitle(string $title) 250 | { 251 | $this->title = $title; 252 | return $this; 253 | } 254 | 255 | /** 256 | * @param string $theme 257 | * @return Echarts 258 | */ 259 | public function setTheme(string $theme) 260 | { 261 | $themeList = [ 262 | 'chalk', 263 | 'dark', 264 | 'halloween', 265 | 'infographic', 266 | 'macarons', 267 | 'purple-passion', 268 | 'roma', 269 | 'shine', 270 | 'vintage', 271 | 'walden', 272 | 'westeros', 273 | 'wonderland', 274 | ]; 275 | if (in_array($theme, $themeList)) { 276 | $this->theme = $theme; 277 | } 278 | return $this; 279 | } 280 | 281 | /** 282 | * @param bool $boundaryGap 283 | * @return Echarts 284 | */ 285 | public function setBoundaryGap(bool $boundaryGap) 286 | { 287 | $this->boundaryGap = $boundaryGap; 288 | return $this; 289 | } 290 | 291 | /** 292 | * @param bool $showToolbox 293 | * @return Echarts 294 | */ 295 | public function setShowToolbox(bool $showToolbox) 296 | { 297 | $this->showToolbox = $showToolbox; 298 | return $this; 299 | } 300 | 301 | /** 302 | * @param array $toolbox 303 | * @return Echarts 304 | */ 305 | public function setToolbox(array $toolbox) 306 | { 307 | $this->toolbox = $toolbox; 308 | return $this; 309 | } 310 | 311 | /** 312 | * @param bool $dataZoom 313 | * @return Echarts 314 | */ 315 | public function setDataZoom(bool $dataZoom) 316 | { 317 | $this->dataZoom = $dataZoom; 318 | return $this; 319 | } 320 | 321 | /** 322 | * @param string $seriesType line|bar|pie|radar 323 | * @return Echarts 324 | */ 325 | public function setSeriesType(string $seriesType) 326 | { 327 | $this->seriesType = $seriesType; 328 | return $this; 329 | } 330 | 331 | /** 332 | * @param array $indicator 333 | * @return Echarts 334 | */ 335 | public function setIndicator(array $indicator) 336 | { 337 | $this->indicator = $indicator; 338 | return $this; 339 | } 340 | 341 | /** 342 | * @param string $style 343 | * @return Echarts 344 | */ 345 | public function setStyle(string $style) 346 | { 347 | $this->style = $style; 348 | return $this; 349 | } 350 | 351 | /** 352 | * 设置视图 353 | * @param string $view 354 | * @return Echarts 355 | */ 356 | public function setView(string $view) 357 | { 358 | $this->view = $view; 359 | return $this; 360 | } 361 | 362 | /** 363 | * @param bool $showShadow 364 | * @return Echarts 365 | */ 366 | public function setShowShadow(bool $showShadow) 367 | { 368 | $this->showShadow = $showShadow; 369 | return $this; 370 | } 371 | } 372 | -------------------------------------------------------------------------------- /src/EchartsServiceProvider.php: -------------------------------------------------------------------------------- 1 | views()) { 21 | $this->loadViewsFrom($views, 'echarts'); 22 | } 23 | 24 | if ($this->app->runningInConsole() && $assets = $extension->assets()) { 25 | $this->publishes( 26 | [$assets => public_path('vendor/laravel-admin-ext/echarts')], 27 | 'echarts' 28 | ); 29 | 30 | $this->publishes([$extension->config => config_path('echarts.php')], 'echarts'); 31 | 32 | $this->publishes([$extension->views => resource_path('views/vendor/admin/echarts')], 'echarts-view'); 33 | } 34 | 35 | 36 | if ($this->app->environment() == 'local') { 37 | $this->app->booted(function () { 38 | Echarts::routes(__DIR__ . '/../routes/web.php'); 39 | }); 40 | } 41 | 42 | 43 | Admin::booting(function () { 44 | Admin::headerJs('vendor/laravel-admin-ext/echarts/echarts.min.js'); 45 | Admin::headerJs('vendor/laravel-admin-ext/echarts/draw.js'); 46 | }); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /src/Http/Controllers/EchartsController.php: -------------------------------------------------------------------------------- 1 | '日期', 22 | 'fans_num' => '粉丝', 23 | 'comment_num' => '评论', 24 | 'article_num' => '文章', 25 | 'forward_num' => '转发', 26 | 'like_num' => '点赞', 27 | ]; 28 | 29 | $echarts = (new Echarts('折线图', '我是堆叠方式')) 30 | ->setData($jsonArr) 31 | ->bindLegend($head) 32 | ->setShowShadow(1) 33 | ->setSeries([ 34 | ['type' => 'line', 'stack' => '总量'], 35 | ['type' => 'line', 'stack' => '总量'], 36 | ['type' => 'line', 'stack' => '总量'], 37 | ['type' => 'line', 'stack' => '总量'], 38 | ['type' => 'line', 'stack' => '总量'], 39 | ]); 40 | 41 | $echarts2 = (new Echarts('柱状图', '数据来自新浪云大数据平台')) 42 | ->setSeriesType('bar') 43 | ->setData($jsonArr) 44 | ->bindLegend($head) 45 | ->setDataZoom(1) 46 | ->setShowToolbox(1); 47 | 48 | 49 | $names = '[{"name":"李花平","value":68900},{"name":"鲍奚汤·马","value":35082},{"name":"成李·苏","value":94194},{"name":"孙计","value":84937},{"name":"滕和伏","value":59329},{"name":"黄孟","value":76689},{"name":"汪苗云","value":46175},{"name":"谈谈褚","value":71813}]'; 50 | 51 | $echarts3 = (new Echarts('饼形图')) 52 | ->setData(json_decode($names, 1)) 53 | ->setSeries([ 54 | ['type' => 'pie', 'name' => '姓名',], 55 | ]) 56 | ->setSeriesType('pie'); 57 | 58 | $echarts4 = (new Echarts('雷达图')) 59 | ->setIndicator([ 60 | ['name' => '销售', 'max' => 100], 61 | ['name' => '管理', 'max' => 100], 62 | ['name' => '信息', 'max' => 100], 63 | ['name' => '客服', 'max' => 100], 64 | ['name' => '研发', 'max' => 100], 65 | ]) 66 | ->setSeries([ 67 | ['type' => 'radar', 68 | 'data' => [ 69 | [ 70 | 'value' => [99, 86.4, 65.2, 82.5, 87], 71 | 'name' => 2017, 72 | ], 73 | [ 74 | 'value' => [75, 76, 98, 72.4, 53.9], 75 | 'name' => 2016, 76 | ] 77 | ], 78 | ], 79 | 80 | ]) 81 | ->setSeriesType('radar'); 82 | 83 | $box = new Box('折线图', $echarts); 84 | $box2 = new Box('柱状图', $echarts2); 85 | $box3 = new Box('饼形图', $echarts3); 86 | $box4 = new Box('雷达图', $echarts4); 87 | 88 | return $content 89 | ->header('Echarts demo') 90 | ->description('百度echarts图表展示') 91 | ->row(function (Row $row) use ($box, $box2, $box3, $box4) { 92 | $row->column(6, function (Column $column) use ($box) { 93 | $column->append($box); 94 | }); 95 | 96 | $row->column(6, function (Column $column) use ($box2) { 97 | $column->append($box2); 98 | }); 99 | 100 | $row->column(6, function (Column $column) use ($box3) { 101 | $column->append($box3); 102 | }); 103 | 104 | $row->column(6, function (Column $column) use ($box4) { 105 | $column->append($box4); 106 | }); 107 | }); 108 | } 109 | } 110 | --------------------------------------------------------------------------------