| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581 |
- /*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
- (function(root, factory) {
- if (typeof define === 'function' && define.amd) {
- // AMD. Register as an anonymous module.
- define(['exports', 'echarts'], factory);
- } else if (
- typeof exports === 'object' &&
- typeof exports.nodeName !== 'string'
- ) {
- // CommonJS
- factory(exports, require('echarts/lib/echarts'));
- } else {
- // Browser globals
- factory({}, root.echarts);
- }
- })(this, function(exports, echarts) {
- var log = function(msg) {
- if (typeof console !== 'undefined') {
- console && console.error && console.error(msg);
- }
- };
- if (!echarts) {
- log('ECharts is not Loaded');
- return;
- }
- var colorPalette = [
- '#5470c6',
- '#91cc75',
- '#fac858',
- '#ee6666',
- '#73c0de',
- '#3ba272',
- '#fc8452',
- '#9a60b4',
- '#ea7ccc'
- ];
- var axisCommon = function() {
- return {
- axisLine: {
- lineStyle: {
- color: '#6E7079'
- }
- },
- axisLabel: {
- color: null
- },
- splitLine: {
- lineStyle: {
- color: ['#E0E6F1']
- }
- },
- splitArea: {
- areaStyle: {
- color: ['rgba(250,250,250,0.2)', 'rgba(210,219,238,0.2)']
- }
- },
- minorSplitLine: {
- color: '#F4F7FD'
- }
- };
- };
- var gradientColor = ['#f6efa6', '#d88273', '#bf444c'];
- echarts.registerTheme('v5', {
- color: colorPalette,
- gradientColor: gradientColor,
- loading: {
- textColor: 'red'
- },
- // Series
- bar: {
- defaultBarGap: '20%',
- select: {
- itemStyle: {
- borderColor: '#212121',
- borderWidth: 1
- }
- }
- },
- boxplot: {
- emphasis: {
- itemStyle: {
- shadowColor: 'rgba(0,0,0,0.2)'
- }
- }
- },
- funnel: {
- bottom: 60,
- select: {
- itemStyle: {
- borderColor: '#212121',
- borderWidth: 1
- }
- },
- label: {
- color: 'inherit'
- }
- },
- gauge: {
- axisLine: {
- lineStyle: {
- color: [[1, '#E6EBF8']]
- }
- },
- splitLine: {
- lineStyle: {
- color: '#63677A'
- }
- },
- axisTick: {
- lineStyle: {
- color: '#63677A'
- }
- },
- axisLabel: {
- color: '#464646'
- },
- anchor: {
- itemStyle: {
- color: '#fff',
- borderColor: '#5470c6'
- }
- },
- title: {
- color: '#464646',
- },
- detail: {
- backgroundColor: 'rgba(0,0,0,0)',
- borderColor: '#ccc',
- color: '#464646'
- }
- },
- graph: {
- lineStyle: {
- color: '#aaa'
- },
- select: {
- itemStyle: {
- borderColor: '#212121'
- }
- }
- },
- heatmap: {
- select: {
- itemStyle: {
- borderColor: '#212121'
- }
- }
- },
- line: {
- symbolSize: 4
- },
- pictorialBar: {
- select: {
- itemStyle: {
- borderColor: '#212121',
- borderWidth: 1
- }
- }
- },
- pie: {
- radius: [0, '75%'],
- labelLine: {
- length2: 15
- }
- },
- map: {
- defaultItemStyleColor: '#eee',
- label: {
- color: '#000'
- },
- itemStyle: {
- borderColor: '#444',
- areaColor: '#eee'
- },
- emphasis: {
- label: {
- color: 'rgb(100,0,0)'
- },
- itemStyle: {
- areaColor: 'rgba(255,215,0,0.8)'
- }
- },
- select: {
- label: {
- color: 'rgb(100,0,0)'
- },
- itemStyle: {
- color: 'rgba(255,215,0,0.8)'
- }
- },
- },
- sankey: {
- lineStyle: {
- color: '#314656'
- },
- select: {
- itemStyle: {
- borderColor: '#212121'
- }
- },
- },
- scatter: {
- select: {
- itemStyle: {
- borderColor: '#212121'
- }
- }
- },
- tree: {
- lineStyle: {
- color: '#ccc'
- }
- },
- treemap: {
- left: 'center',
- top: 'middle',
- width: '80%',
- height: '80%',
- scaleLimit: {
- max: null,
- min: null
- },
- breadcrumb: {
- top: 'bottom',
- bottom: null,
- itemStyle: {
- color: 'rgba(0,0,0,0.7)', // '#5793f3',
- textStyle: {
- color: '#fff'
- }
- },
- emphasis: {
- itemStyle: {
- color: 'rgba(0,0,0,0.9)' // '#5793f3',
- }
- }
- }
- },
- // Components
- timeAxis: axisCommon(),
- logAxis: axisCommon(),
- valueAxis: axisCommon(),
- categoryAxis: (() => {
- const axis = axisCommon();
- axis.axisTick = {
- show: true
- };
- return axis;
- })(),
- axisPointer: {
- lineStyle: {
- color: '#B9BEC9'
- },
- shadowStyle: {
- color: 'rgba(210,219,238,0.2)'
- },
- label: {
- backgroundColor: 'auto',
- color: '#fff'
- },
- handle: {
- color: '#333',
- shadowBlur: 3,
- shadowColor: '#aaa',
- shadowOffsetX: 0,
- shadowOffsetY: 2,
- }
- },
- brush: {
- brushStyle: {
- color: 'rgba(210,219,238,0.3)',
- borderColor: '#D2DBEE'
- },
- defaultOutOfBrushColor: '#ddd'
- },
- calendar: {
- splitLine: {
- lineStyle: {
- color: '#000'
- }
- },
- itemStyle: {
- borderColor: '#ccc'
- },
- dayLabel: {
- margin: '50%',
- color: '#000'
- },
- monthLabel: {
- margin: 5,
- color: '#000'
- },
- yearLabel: {
- margin: 30,
- color: '#ccc'
- }
- },
- dataZoom: {
- borderColor: '#d2dbee',
- borderRadius: 3,
- backgroundColor: 'rgba(47,69,84,0)',
- dataBackground: {
- lineStyle: {
- color: '#d2dbee',
- width: 0.5
- },
- areaStyle: {
- color: '#d2dbee',
- opacity: 0.2
- }
- },
- selectedDataBackground: {
- lineStyle: {
- color: '#8fb0f7',
- width: 0.5
- },
- areaStyle: {
- color: '#8fb0f7',
- opacity: 0.2
- }
- },
- handleStyle: {
- color: '#fff',
- borderColor: '#ACB8D1'
- },
- moveHandleStyle: {
- color: '#D2DBEE',
- opacity: 0.7
- },
- textStyle: {
- color: '#6E7079'
- },
- brushStyle: {
- color: 'rgba(135,175,274,0.15)'
- },
- emphasis: {
- handleStyle: {
- borderColor: '#8FB0F7'
- },
- moveHandleStyle: {
- color: '#8FB0F7',
- opacity: 0.7
- }
- },
- defaultLocationEdgeGap: 7
- },
- geo: {
- defaultItemStyleColor: '#eee',
- label: {
- color: '#000'
- },
- itemStyle: {
- borderColor: '#444'
- },
- emphasis: {
- label: {
- color: 'rgb(100,0,0)'
- },
- itemStyle: {
- color: 'rgba(255,215,0,0.8)'
- }
- },
- select: {
- label: {
- color: 'rgb(100,0,0)'
- },
- itemStyle: {
- color: 'rgba(255,215,0,0.8)'
- }
- }
- },
- grid: {
- left: '10%',
- top: 60,
- bottom: 70,
- borderColor: '#ccc'
- },
- legend: {
- top: 0,
- bottom: null,
- backgroundColor: 'rgba(0,0,0,0)',
- borderColor: '#ccc',
- itemGap: 10,
- inactiveColor: '#ccc',
- inactiveBorderColor: '#ccc',
- lineStyle: {
- inactiveColor: '#ccc',
- },
- textStyle: {
- color: '#333'
- },
- selectorLabel: {
- color: '#666',
- borderColor: '#666'
- },
- emphasis: {
- selectorLabel: {
- color: '#eee',
- backgroundColor: '#666'
- }
- },
- pageIconColor: '#2f4554',
- pageIconInactiveColor: '#aaa',
- pageTextStyle: {
- color: '#333'
- }
- },
- radar: (() => {
- const radar = axisCommon();
- radar.radius = '75%';
- radar.axisName = {
- color: '#bbb'
- };
- radar.axisLine.lineStyle.color = '#bbb';
- return radar;
- })(),
- timeline: {
- padding: 5,
- borderColor: '#ccc',
- lineStyle: {
- color: '#DAE1F5'
- },
- label: {
- color: '#A4B1D7'
- },
- itemStyle: {
- color: '#A4B1D7',
- borderWidth: 1
- },
- checkpointStyle: {
- color: '#316bf3',
- borderColor: '#fff',
- borderWidth: 2,
- shadowBlur: 2,
- shadowOffsetX: 1,
- shadowOffsetY: 1,
- shadowColor: 'rgba(0, 0, 0, 0.3)',
- },
- controlStyle: {
- playIcon: 'path://M31.6,53C17.5,53,6,41.5,6,27.4S17.5,1.8,31.6,1.8C45.7,1.8,57.2,13.3,57.2,27.4S45.7,53,31.6,53z M31.6,3.3 C18.4,3.3,7.5,14.1,7.5,27.4c0,13.3,10.8,24.1,24.1,24.1C44.9,51.5,55.7,40.7,55.7,27.4C55.7,14.1,44.9,3.3,31.6,3.3z M24.9,21.3 c0-2.2,1.6-3.1,3.5-2l10.5,6.1c1.899,1.1,1.899,2.9,0,4l-10.5,6.1c-1.9,1.1-3.5,0.2-3.5-2V21.3z', // jshint ignore:line
- stopIcon: 'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z', // jshint ignore:line
- // eslint-disable-next-line max-len
- nextIcon: 'M2,18.5A1.52,1.52,0,0,1,.92,18a1.49,1.49,0,0,1,0-2.12L7.81,9.36,1,3.11A1.5,1.5,0,1,1,3,.89l8,7.34a1.48,1.48,0,0,1,.49,1.09,1.51,1.51,0,0,1-.46,1.1L3,18.08A1.5,1.5,0,0,1,2,18.5Z', // jshint ignore:line
- // eslint-disable-next-line max-len
- prevIcon: 'M10,.5A1.52,1.52,0,0,1,11.08,1a1.49,1.49,0,0,1,0,2.12L4.19,9.64,11,15.89a1.5,1.5,0,1,1-2,2.22L1,10.77A1.48,1.48,0,0,1,.5,9.68,1.51,1.51,0,0,1,1,8.58L9,.92A1.5,1.5,0,0,1,10,.5Z', // jshint ignore:line
- color: '#A4B1D7',
- borderColor: '#A4B1D7',
- borderWidth: 1
- },
- emphasis: {
- label: {
- color: '#6f778d'
- },
- itemStyle: {
- color: '#316BF3'
- },
- controlStyle: {
- color: '#316BF3',
- borderColor: '#316BF3',
- borderWidth: 2
- }
- },
- progress: {
- lineStyle: {
- color: '#316BF3'
- },
- itemStyle: {
- color: '#316BF3'
- },
- label: {
- color: '#6f778d'
- }
- },
- },
- title: {
- left: 0,
- top: 0,
- backgroundColor: 'rgba(0,0,0,0)',
- borderColor: '#ccc',
- textStyle: {
- color: '#464646'
- },
- subtextStyle: {
- color: '#6E7079'
- }
- },
- toolbox: {
- borderColor: '#ccc',
- padding: 5,
- itemGap: 8,
- iconStyle: {
- borderColor: '#666',
- },
- emphasis: {
- iconStyle: {
- borderColor: '#3E98C5'
- }
- }
- },
- tooltip: {
- axisPointer: {
- crossStyle: {
- color: '#999'
- }
- },
- textStyle: {
- color: '#666'
- },
- backgroundColor: '#fff',
- borderWidth: 1,
- defaultBorderColor: '#fff'
- },
- visualMap: {
- color: [gradientColor[2], gradientColor[1], gradientColor[0]],
- inactive: ['rgba(0,0,0,0)'],
- indicatorStyle: {
- shadowColor: 'rgba(0,0,0,0.2)'
- },
- backgroundColor: 'rgba(0,0,0,0)',
- borderColor: '#ccc',
- contentColor: '#5793f3',
- inactiveColor: '#aaa',
- padding: 5,
- textStyle: {
- color: '#333'
- }
- }
- });
- });
|