mirror of
https://github.com/dillonzq/LoveIt.git
synced 2024-11-13 02:16:19 +01:00
feat: update echarts theme config
This commit is contained in:
parent
a19e0ed1ac
commit
9cac6b4ffe
7 changed files with 623 additions and 901 deletions
|
@ -666,36 +666,41 @@ var Theme = /*#__PURE__*/function () {
|
|||
value: function initEcharts() {
|
||||
var _this8 = this;
|
||||
|
||||
this._echartsOnSwitchTheme = this._echartsOnSwitchTheme || function () {
|
||||
_this8._echartsArr = _this8._echartsArr || [];
|
||||
if (this.config.echarts) {
|
||||
echarts.registerTheme('light', this.config.echarts.lightTheme);
|
||||
echarts.registerTheme('dark', this.config.echarts.darkTheme);
|
||||
|
||||
for (var i = 0; i < _this8._echartsArr.length; i++) {
|
||||
_this8._echartsArr[i].dispose();
|
||||
}
|
||||
this._echartsOnSwitchTheme = this._echartsOnSwitchTheme || function () {
|
||||
_this8._echartsArr = _this8._echartsArr || [];
|
||||
|
||||
_this8._echartsArr = [];
|
||||
for (var i = 0; i < _this8._echartsArr.length; i++) {
|
||||
_this8._echartsArr[i].dispose();
|
||||
}
|
||||
|
||||
_this8.util.forEach(document.getElementsByClassName('echarts'), function ($echarts) {
|
||||
var chart = echarts.init($echarts, _this8.isDark ? 'chalk' : 'macarons', {
|
||||
renderer: 'svg'
|
||||
_this8._echartsArr = [];
|
||||
|
||||
_this8.util.forEach(document.getElementsByClassName('echarts'), function ($echarts) {
|
||||
var chart = echarts.init($echarts, _this8.isDark ? 'dark' : 'light', {
|
||||
renderer: 'svg'
|
||||
});
|
||||
chart.setOption(JSON.parse(_this8.data[$echarts.id]));
|
||||
|
||||
_this8._echartsArr.push(chart);
|
||||
});
|
||||
chart.setOption(JSON.parse(_this8.data[$echarts.id]));
|
||||
};
|
||||
|
||||
_this8._echartsArr.push(chart);
|
||||
});
|
||||
};
|
||||
this.switchThemeEventSet.add(this._echartsOnSwitchTheme);
|
||||
|
||||
this.switchThemeEventSet.add(this._echartsOnSwitchTheme);
|
||||
this._echartsOnSwitchTheme();
|
||||
|
||||
this._echartsOnSwitchTheme();
|
||||
this._echartsOnResize = this._echartsOnResize || function () {
|
||||
for (var i = 0; i < _this8._echartsArr.length; i++) {
|
||||
_this8._echartsArr[i].resize();
|
||||
}
|
||||
};
|
||||
|
||||
this._echartsOnResize = this._echartsOnResize || function () {
|
||||
for (var i = 0; i < _this8._echartsArr.length; i++) {
|
||||
_this8._echartsArr[i].resize();
|
||||
}
|
||||
};
|
||||
|
||||
this.resizeEventSet.add(this._echartsOnResize);
|
||||
this.resizeEventSet.add(this._echartsOnResize);
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: "initMapbox",
|
||||
|
|
|
@ -1,417 +0,0 @@
|
|||
(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'));
|
||||
} 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;
|
||||
}
|
||||
echarts.registerTheme('chalk', {
|
||||
"color": [
|
||||
"#fc97af",
|
||||
"#87f7cf",
|
||||
"#f7f494",
|
||||
"#72ccff",
|
||||
"#f7c5a0",
|
||||
"#d4a4eb",
|
||||
"#d2f5a6",
|
||||
"#76f2f2"
|
||||
],
|
||||
"backgroundColor": "rgba(41,52,65,1)",
|
||||
"textStyle": {},
|
||||
"title": {
|
||||
"textStyle": {
|
||||
"color": "#ffffff"
|
||||
},
|
||||
"subtextStyle": {
|
||||
"color": "#dddddd"
|
||||
}
|
||||
},
|
||||
"line": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 1
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": 2
|
||||
},
|
||||
"symbolSize": 6,
|
||||
"symbol": "circle",
|
||||
"smooth": true
|
||||
},
|
||||
"radar": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 1
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": 2
|
||||
},
|
||||
"symbolSize": 3,
|
||||
"symbol": "circle",
|
||||
"smooth": true
|
||||
},
|
||||
"bar": {
|
||||
"itemStyle": {
|
||||
"barBorderWidth": 0,
|
||||
"barBorderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"pie": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"scatter": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"boxplot": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"parallel": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"sankey": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"funnel": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"gauge": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"candlestick": {
|
||||
"itemStyle": {
|
||||
"color": "#fc97af",
|
||||
"color0": "transparent",
|
||||
"borderColor": "#fc97af",
|
||||
"borderColor0": "#87f7cf",
|
||||
"borderWidth": 1
|
||||
}
|
||||
},
|
||||
"graph": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": 1,
|
||||
"color": "#ffffff"
|
||||
},
|
||||
"symbolSize": 3,
|
||||
"symbol": "emptyCircle",
|
||||
"smooth": true,
|
||||
"color": [
|
||||
"#fc97af",
|
||||
"#87f7cf",
|
||||
"#f7f494",
|
||||
"#72ccff",
|
||||
"#f7c5a0",
|
||||
"#d4a4eb",
|
||||
"#d2f5a6",
|
||||
"#76f2f2"
|
||||
],
|
||||
"label": {
|
||||
"color": "#293441"
|
||||
}
|
||||
},
|
||||
"map": {
|
||||
"itemStyle": {
|
||||
"areaColor": "#f3f3f3",
|
||||
"borderColor": "#999999",
|
||||
"borderWidth": 0.5
|
||||
},
|
||||
"label": {
|
||||
"color": "#893448"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"areaColor": "rgba(255,178,72,1)",
|
||||
"borderColor": "#eb8146",
|
||||
"borderWidth": 1
|
||||
},
|
||||
"label": {
|
||||
"color": "rgb(137,52,72)"
|
||||
}
|
||||
}
|
||||
},
|
||||
"geo": {
|
||||
"itemStyle": {
|
||||
"areaColor": "#f3f3f3",
|
||||
"borderColor": "#999999",
|
||||
"borderWidth": 0.5
|
||||
},
|
||||
"label": {
|
||||
"color": "#893448"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"areaColor": "rgba(255,178,72,1)",
|
||||
"borderColor": "#eb8146",
|
||||
"borderWidth": 1
|
||||
},
|
||||
"label": {
|
||||
"color": "rgb(137,52,72)"
|
||||
}
|
||||
}
|
||||
},
|
||||
"categoryAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#666666"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#aaaaaa"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": false,
|
||||
"lineStyle": {
|
||||
"color": [
|
||||
"#e6e6e6"
|
||||
]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": [
|
||||
"rgba(250,250,250,0.05)",
|
||||
"rgba(200,200,200,0.02)"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"valueAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#666666"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#aaaaaa"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": [
|
||||
"#e6e6e6"
|
||||
]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": [
|
||||
"rgba(250,250,250,0.05)",
|
||||
"rgba(200,200,200,0.02)"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"logAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#666666"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#aaaaaa"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": [
|
||||
"#e6e6e6"
|
||||
]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": true,
|
||||
"areaStyle": {
|
||||
"color": [
|
||||
"rgba(250,250,250,0.05)",
|
||||
"rgba(200,200,200,0.02)"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"timeAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#666666"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#aaaaaa"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": [
|
||||
"#e6e6e6"
|
||||
]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": [
|
||||
"rgba(250,250,250,0.05)",
|
||||
"rgba(200,200,200,0.02)"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"toolbox": {
|
||||
"iconStyle": {
|
||||
"borderColor": "#999999"
|
||||
},
|
||||
"emphasis": {
|
||||
"iconStyle": {
|
||||
"borderColor": "#666666"
|
||||
}
|
||||
}
|
||||
},
|
||||
"legend": {
|
||||
"textStyle": {
|
||||
"color": "#999999"
|
||||
}
|
||||
},
|
||||
"tooltip": {
|
||||
"axisPointer": {
|
||||
"lineStyle": {
|
||||
"color": "#cccccc",
|
||||
"width": 1
|
||||
},
|
||||
"crossStyle": {
|
||||
"color": "#cccccc",
|
||||
"width": 1
|
||||
}
|
||||
}
|
||||
},
|
||||
"timeline": {
|
||||
"lineStyle": {
|
||||
"color": "#87f7cf",
|
||||
"width": 1
|
||||
},
|
||||
"itemStyle": {
|
||||
"color": "#87f7cf",
|
||||
"borderWidth": 1
|
||||
},
|
||||
"controlStyle": {
|
||||
"color": "#87f7cf",
|
||||
"borderColor": "#87f7cf",
|
||||
"borderWidth": 0.5
|
||||
},
|
||||
"checkpointStyle": {
|
||||
"color": "#fc97af",
|
||||
"borderColor": "#fc97af"
|
||||
},
|
||||
"label": {
|
||||
"color": "#87f7cf"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"color": "#f7f494"
|
||||
},
|
||||
"controlStyle": {
|
||||
"color": "#87f7cf",
|
||||
"borderColor": "#87f7cf",
|
||||
"borderWidth": 0.5
|
||||
},
|
||||
"label": {
|
||||
"color": "#87f7cf"
|
||||
}
|
||||
}
|
||||
},
|
||||
"visualMap": {
|
||||
"color": [
|
||||
"#fc97af",
|
||||
"#87f7cf"
|
||||
]
|
||||
},
|
||||
"dataZoom": {
|
||||
"backgroundColor": "rgba(255,255,255,0)",
|
||||
"dataBackgroundColor": "rgba(114,204,255,1)",
|
||||
"fillerColor": "rgba(114,204,255,0.2)",
|
||||
"handleColor": "#72ccff",
|
||||
"handleSize": "100%",
|
||||
"textStyle": {
|
||||
"color": "#333333"
|
||||
}
|
||||
},
|
||||
"markPoint": {
|
||||
"label": {
|
||||
"color": "#293441"
|
||||
},
|
||||
"emphasis": {
|
||||
"label": {
|
||||
"color": "#293441"
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}));
|
273
assets/lib/echarts/theme/dark.yml
Normal file
273
assets/lib/echarts/theme/dark.yml
Normal file
|
@ -0,0 +1,273 @@
|
|||
# dark theme based on chalk theme
|
||||
color:
|
||||
- '#fc97af'
|
||||
- '#87f7cf'
|
||||
- '#f7f494'
|
||||
- '#72ccff'
|
||||
- '#f7c5a0'
|
||||
- '#d4a4eb'
|
||||
- '#d2f5a6'
|
||||
- '#76f2f2'
|
||||
backgroundColor: rgba(41,52,65,1)
|
||||
textStyle: {}
|
||||
title:
|
||||
textStyle:
|
||||
color: '#ffffff'
|
||||
subtextStyle:
|
||||
color: '#dddddd'
|
||||
line:
|
||||
itemStyle:
|
||||
borderWidth: 1
|
||||
lineStyle:
|
||||
width: 2
|
||||
symbolSize: 6
|
||||
symbol: circle
|
||||
smooth: true
|
||||
radar:
|
||||
itemStyle:
|
||||
borderWidth: 1
|
||||
lineStyle:
|
||||
width: 2
|
||||
symbolSize: 3
|
||||
symbol: circle
|
||||
smooth: true
|
||||
bar:
|
||||
itemStyle:
|
||||
barBorderWidth: 0
|
||||
barBorderColor: '#ccc'
|
||||
pie:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
scatter:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
boxplot:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
parallel:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
sankey:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
funnel:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
gauge:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
candlestick:
|
||||
itemStyle:
|
||||
color: '#fc97af'
|
||||
color0: transparent
|
||||
borderColor: '#fc97af'
|
||||
borderColor0: '#87f7cf'
|
||||
borderWidth: 1
|
||||
graph:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
lineStyle:
|
||||
width: 1
|
||||
color: '#ffffff'
|
||||
symbolSize: 3
|
||||
symbol: emptyCircle
|
||||
smooth: true
|
||||
color:
|
||||
- '#fc97af'
|
||||
- '#87f7cf'
|
||||
- '#f7f494'
|
||||
- '#72ccff'
|
||||
- '#f7c5a0'
|
||||
- '#d4a4eb'
|
||||
- '#d2f5a6'
|
||||
- '#76f2f2'
|
||||
label:
|
||||
color: '#293441'
|
||||
map:
|
||||
itemStyle:
|
||||
areaColor: '#f3f3f3'
|
||||
borderColor: '#999999'
|
||||
borderWidth: 0.5
|
||||
label:
|
||||
color: '#893448'
|
||||
emphasis:
|
||||
itemStyle:
|
||||
areaColor: rgba(255,178,72,1)
|
||||
borderColor: '#eb8146'
|
||||
borderWidth: 1
|
||||
label:
|
||||
color: rgb(137,52,72)
|
||||
geo:
|
||||
itemStyle:
|
||||
areaColor: '#f3f3f3'
|
||||
borderColor: '#999999'
|
||||
borderWidth: 0.5
|
||||
label:
|
||||
color: '#893448'
|
||||
emphasis:
|
||||
itemStyle:
|
||||
areaColor: rgba(255,178,72,1)
|
||||
borderColor: '#eb8146'
|
||||
borderWidth: 1
|
||||
label:
|
||||
color: rgb(137,52,72)
|
||||
categoryAxis:
|
||||
axisLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#666666'
|
||||
axisTick:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#333'
|
||||
axisLabel:
|
||||
show: true
|
||||
color: '#aaaaaa'
|
||||
splitLine:
|
||||
show: false
|
||||
lineStyle:
|
||||
color:
|
||||
- '#e6e6e6'
|
||||
splitArea:
|
||||
show: false
|
||||
areaStyle:
|
||||
color:
|
||||
- rgba(250,250,250,0.05)
|
||||
- rgba(200,200,200,0.02)
|
||||
valueAxis:
|
||||
axisLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#666666'
|
||||
axisTick:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#333'
|
||||
axisLabel:
|
||||
show: true
|
||||
color: '#aaaaaa'
|
||||
splitLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color:
|
||||
- '#e6e6e6'
|
||||
splitArea:
|
||||
show: false
|
||||
areaStyle:
|
||||
color:
|
||||
- rgba(250,250,250,0.05)
|
||||
- rgba(200,200,200,0.02)
|
||||
logAxis:
|
||||
axisLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#666666'
|
||||
axisTick:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#333'
|
||||
axisLabel:
|
||||
show: true
|
||||
color: '#aaaaaa'
|
||||
splitLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color:
|
||||
- '#e6e6e6'
|
||||
splitArea:
|
||||
show: true
|
||||
areaStyle:
|
||||
color:
|
||||
- rgba(250,250,250,0.05)
|
||||
- rgba(200,200,200,0.02)
|
||||
timeAxis:
|
||||
axisLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#666666'
|
||||
axisTick:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#333'
|
||||
axisLabel:
|
||||
show: true
|
||||
color: '#aaaaaa'
|
||||
splitLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color:
|
||||
- '#e6e6e6'
|
||||
splitArea:
|
||||
show: false
|
||||
areaStyle:
|
||||
color:
|
||||
- rgba(250,250,250,0.05)
|
||||
- rgba(200,200,200,0.02)
|
||||
toolbox:
|
||||
iconStyle:
|
||||
borderColor: '#999999'
|
||||
emphasis:
|
||||
iconStyle:
|
||||
borderColor: '#666666'
|
||||
legend:
|
||||
textStyle:
|
||||
color: '#999999'
|
||||
tooltip:
|
||||
axisPointer:
|
||||
lineStyle:
|
||||
color: '#cccccc'
|
||||
width: 1
|
||||
crossStyle:
|
||||
color: '#cccccc'
|
||||
width: 1
|
||||
timeline:
|
||||
lineStyle:
|
||||
color: '#87f7cf'
|
||||
width: 1
|
||||
itemStyle:
|
||||
color: '#87f7cf'
|
||||
borderWidth: 1
|
||||
controlStyle:
|
||||
color: '#87f7cf'
|
||||
borderColor: '#87f7cf'
|
||||
borderWidth: 0.5
|
||||
checkpointStyle:
|
||||
color: '#fc97af'
|
||||
borderColor: '#fc97af'
|
||||
label:
|
||||
color: '#87f7cf'
|
||||
emphasis:
|
||||
itemStyle:
|
||||
color: '#f7f494'
|
||||
controlStyle:
|
||||
color: '#87f7cf'
|
||||
borderColor: '#87f7cf'
|
||||
borderWidth: 0.5
|
||||
label:
|
||||
color: '#87f7cf'
|
||||
visualMap:
|
||||
color:
|
||||
- '#fc97af'
|
||||
- '#87f7cf'
|
||||
dataZoom:
|
||||
backgroundColor: rgba(255,255,255,0)
|
||||
dataBackgroundColor: rgba(114,204,255,1)
|
||||
fillerColor: rgba(114,204,255,0.2)
|
||||
handleColor: '#72ccff'
|
||||
handleSize: 100%
|
||||
textStyle:
|
||||
color: '#333333'
|
||||
markPoint:
|
||||
label:
|
||||
color: '#293441'
|
||||
emphasis:
|
||||
label:
|
||||
color: '#293441'
|
297
assets/lib/echarts/theme/light.yml
Normal file
297
assets/lib/echarts/theme/light.yml
Normal file
|
@ -0,0 +1,297 @@
|
|||
# light theme based on macarons theme
|
||||
color:
|
||||
- '#2ec7c9'
|
||||
- '#b6a2de'
|
||||
- '#5ab1ef'
|
||||
- '#ffb980'
|
||||
- '#d87a80'
|
||||
- '#8d98b3'
|
||||
- '#e5cf0d'
|
||||
- '#97b552'
|
||||
- '#95706d'
|
||||
- '#dc69aa'
|
||||
- '#07a2a4'
|
||||
- '#9a7fd1'
|
||||
- '#588dd5'
|
||||
- '#f5994e'
|
||||
- '#c05050'
|
||||
- '#59678c'
|
||||
- '#c9ab00'
|
||||
- '#7eb00a'
|
||||
- '#6f5553'
|
||||
- '#c14089'
|
||||
backgroundColor: rgba(0,0,0,0)
|
||||
textStyle: {}
|
||||
title:
|
||||
textStyle:
|
||||
color: '#008acd'
|
||||
subtextStyle:
|
||||
color: '#aaaaaa'
|
||||
line:
|
||||
itemStyle:
|
||||
borderWidth: 1
|
||||
lineStyle:
|
||||
width: 2
|
||||
symbolSize: 5
|
||||
symbol: emptyCircle
|
||||
smooth: true
|
||||
radar:
|
||||
itemStyle:
|
||||
borderWidth: 1
|
||||
lineStyle:
|
||||
width: 2
|
||||
symbolSize: 3
|
||||
symbol: emptyCircle
|
||||
smooth: true
|
||||
bar:
|
||||
itemStyle:
|
||||
barBorderWidth: 0
|
||||
barBorderColor: '#ccc'
|
||||
pie:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
scatter:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
boxplot:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
parallel:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
sankey:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
funnel:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
gauge:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
candlestick:
|
||||
itemStyle:
|
||||
color: '#d87a80'
|
||||
color0: '#2ec7c9'
|
||||
borderColor: '#d87a80'
|
||||
borderColor0: '#2ec7c9'
|
||||
borderWidth: 1
|
||||
graph:
|
||||
itemStyle:
|
||||
borderWidth: 0
|
||||
borderColor: '#ccc'
|
||||
lineStyle:
|
||||
width: 1
|
||||
color: '#aaaaaa'
|
||||
symbolSize: 3
|
||||
symbol: emptyCircle
|
||||
smooth: true
|
||||
color:
|
||||
- '#2ec7c9'
|
||||
- '#b6a2de'
|
||||
- '#5ab1ef'
|
||||
- '#ffb980'
|
||||
- '#d87a80'
|
||||
- '#8d98b3'
|
||||
- '#e5cf0d'
|
||||
- '#97b552'
|
||||
- '#95706d'
|
||||
- '#dc69aa'
|
||||
- '#07a2a4'
|
||||
- '#9a7fd1'
|
||||
- '#588dd5'
|
||||
- '#f5994e'
|
||||
- '#c05050'
|
||||
- '#59678c'
|
||||
- '#c9ab00'
|
||||
- '#7eb00a'
|
||||
- '#6f5553'
|
||||
- '#c14089'
|
||||
label:
|
||||
color: '#eeeeee'
|
||||
map:
|
||||
itemStyle:
|
||||
areaColor: '#dddddd'
|
||||
borderColor: '#eeeeee'
|
||||
borderWidth: 0.5
|
||||
label:
|
||||
color: '#d87a80'
|
||||
emphasis:
|
||||
itemStyle:
|
||||
areaColor: rgba(254,153,78,1)
|
||||
borderColor: '#444'
|
||||
borderWidth: 1
|
||||
label:
|
||||
color: rgb(100,0,0)
|
||||
geo:
|
||||
itemStyle:
|
||||
areaColor: '#dddddd'
|
||||
borderColor: '#eeeeee'
|
||||
borderWidth: 0.5
|
||||
label:
|
||||
color: '#d87a80'
|
||||
emphasis:
|
||||
itemStyle:
|
||||
areaColor: rgba(254,153,78,1)
|
||||
borderColor: '#444'
|
||||
borderWidth: 1
|
||||
label:
|
||||
color: rgb(100,0,0)
|
||||
categoryAxis:
|
||||
axisLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#008acd'
|
||||
axisTick:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#333'
|
||||
axisLabel:
|
||||
show: true
|
||||
color: '#333'
|
||||
splitLine:
|
||||
show: false
|
||||
lineStyle:
|
||||
color:
|
||||
- '#eee'
|
||||
splitArea:
|
||||
show: false
|
||||
areaStyle:
|
||||
color:
|
||||
- rgba(250,250,250,0.3)
|
||||
- rgba(200,200,200,0.3)
|
||||
valueAxis:
|
||||
axisLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#008acd'
|
||||
axisTick:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#333'
|
||||
axisLabel:
|
||||
show: true
|
||||
color: '#333'
|
||||
splitLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color:
|
||||
- '#eee'
|
||||
splitArea:
|
||||
show: true
|
||||
areaStyle:
|
||||
color:
|
||||
- rgba(250,250,250,0.3)
|
||||
- rgba(200,200,200,0.3)
|
||||
logAxis:
|
||||
axisLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#008acd'
|
||||
axisTick:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#333'
|
||||
axisLabel:
|
||||
show: true
|
||||
color: '#333'
|
||||
splitLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color:
|
||||
- '#eee'
|
||||
splitArea:
|
||||
show: true
|
||||
areaStyle:
|
||||
color:
|
||||
- rgba(250,250,250,0.3)
|
||||
- rgba(200,200,200,0.3)
|
||||
timeAxis:
|
||||
axisLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#008acd'
|
||||
axisTick:
|
||||
show: true
|
||||
lineStyle:
|
||||
color: '#333'
|
||||
axisLabel:
|
||||
show: true
|
||||
color: '#333'
|
||||
splitLine:
|
||||
show: true
|
||||
lineStyle:
|
||||
color:
|
||||
- '#eee'
|
||||
splitArea:
|
||||
show: false
|
||||
areaStyle:
|
||||
color:
|
||||
- rgba(250,250,250,0.3)
|
||||
- rgba(200,200,200,0.3)
|
||||
toolbox:
|
||||
iconStyle:
|
||||
borderColor: '#2ec7c9'
|
||||
emphasis:
|
||||
iconStyle:
|
||||
borderColor: '#18a4a6'
|
||||
legend:
|
||||
textStyle:
|
||||
color: '#333333'
|
||||
tooltip:
|
||||
axisPointer:
|
||||
lineStyle:
|
||||
color: '#008acd'
|
||||
width: 1
|
||||
crossStyle:
|
||||
color: '#008acd'
|
||||
width: 1
|
||||
timeline:
|
||||
lineStyle:
|
||||
color: '#008acd'
|
||||
width: 1
|
||||
itemStyle:
|
||||
color: '#008acd'
|
||||
borderWidth: 1
|
||||
controlStyle:
|
||||
color: '#008acd'
|
||||
borderColor: '#008acd'
|
||||
borderWidth: 0.5
|
||||
checkpointStyle:
|
||||
color: '#2ec7c9'
|
||||
borderColor: '#2ec7c9'
|
||||
label:
|
||||
color: '#008acd'
|
||||
emphasis:
|
||||
itemStyle:
|
||||
color: '#a9334c'
|
||||
controlStyle:
|
||||
color: '#008acd'
|
||||
borderColor: '#008acd'
|
||||
borderWidth: 0.5
|
||||
label:
|
||||
color: '#008acd'
|
||||
visualMap:
|
||||
color:
|
||||
- '#5ab1ef'
|
||||
- '#e0ffff'
|
||||
dataZoom:
|
||||
backgroundColor: rgba(47,69,84,0)
|
||||
dataBackgroundColor: '#efefff'
|
||||
fillerColor: rgba(182,162,222,0.2)
|
||||
handleColor: '#008acd'
|
||||
handleSize: 100%
|
||||
textStyle:
|
||||
color: '#333333'
|
||||
markPoint:
|
||||
label:
|
||||
color: '#eeeeee'
|
||||
emphasis:
|
||||
label:
|
||||
color: '#eeeeee'
|
|
@ -1,441 +0,0 @@
|
|||
(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'));
|
||||
} 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;
|
||||
}
|
||||
echarts.registerTheme('macarons', {
|
||||
"color": [
|
||||
"#2ec7c9",
|
||||
"#b6a2de",
|
||||
"#5ab1ef",
|
||||
"#ffb980",
|
||||
"#d87a80",
|
||||
"#8d98b3",
|
||||
"#e5cf0d",
|
||||
"#97b552",
|
||||
"#95706d",
|
||||
"#dc69aa",
|
||||
"#07a2a4",
|
||||
"#9a7fd1",
|
||||
"#588dd5",
|
||||
"#f5994e",
|
||||
"#c05050",
|
||||
"#59678c",
|
||||
"#c9ab00",
|
||||
"#7eb00a",
|
||||
"#6f5553",
|
||||
"#c14089"
|
||||
],
|
||||
"backgroundColor": "rgba(0,0,0,0)",
|
||||
"textStyle": {},
|
||||
"title": {
|
||||
"textStyle": {
|
||||
"color": "#008acd"
|
||||
},
|
||||
"subtextStyle": {
|
||||
"color": "#aaaaaa"
|
||||
}
|
||||
},
|
||||
"line": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 1
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": 2
|
||||
},
|
||||
"symbolSize": 5,
|
||||
"symbol": "emptyCircle",
|
||||
"smooth": true
|
||||
},
|
||||
"radar": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 1
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": 2
|
||||
},
|
||||
"symbolSize": 3,
|
||||
"symbol": "emptyCircle",
|
||||
"smooth": true
|
||||
},
|
||||
"bar": {
|
||||
"itemStyle": {
|
||||
"barBorderWidth": 0,
|
||||
"barBorderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"pie": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"scatter": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"boxplot": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"parallel": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"sankey": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"funnel": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"gauge": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
}
|
||||
},
|
||||
"candlestick": {
|
||||
"itemStyle": {
|
||||
"color": "#d87a80",
|
||||
"color0": "#2ec7c9",
|
||||
"borderColor": "#d87a80",
|
||||
"borderColor0": "#2ec7c9",
|
||||
"borderWidth": 1
|
||||
}
|
||||
},
|
||||
"graph": {
|
||||
"itemStyle": {
|
||||
"borderWidth": 0,
|
||||
"borderColor": "#ccc"
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": 1,
|
||||
"color": "#aaaaaa"
|
||||
},
|
||||
"symbolSize": 3,
|
||||
"symbol": "emptyCircle",
|
||||
"smooth": true,
|
||||
"color": [
|
||||
"#2ec7c9",
|
||||
"#b6a2de",
|
||||
"#5ab1ef",
|
||||
"#ffb980",
|
||||
"#d87a80",
|
||||
"#8d98b3",
|
||||
"#e5cf0d",
|
||||
"#97b552",
|
||||
"#95706d",
|
||||
"#dc69aa",
|
||||
"#07a2a4",
|
||||
"#9a7fd1",
|
||||
"#588dd5",
|
||||
"#f5994e",
|
||||
"#c05050",
|
||||
"#59678c",
|
||||
"#c9ab00",
|
||||
"#7eb00a",
|
||||
"#6f5553",
|
||||
"#c14089"
|
||||
],
|
||||
"label": {
|
||||
"color": "#eeeeee"
|
||||
}
|
||||
},
|
||||
"map": {
|
||||
"itemStyle": {
|
||||
"areaColor": "#dddddd",
|
||||
"borderColor": "#eeeeee",
|
||||
"borderWidth": 0.5
|
||||
},
|
||||
"label": {
|
||||
"color": "#d87a80"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"areaColor": "rgba(254,153,78,1)",
|
||||
"borderColor": "#444",
|
||||
"borderWidth": 1
|
||||
},
|
||||
"label": {
|
||||
"color": "rgb(100,0,0)"
|
||||
}
|
||||
}
|
||||
},
|
||||
"geo": {
|
||||
"itemStyle": {
|
||||
"areaColor": "#dddddd",
|
||||
"borderColor": "#eeeeee",
|
||||
"borderWidth": 0.5
|
||||
},
|
||||
"label": {
|
||||
"color": "#d87a80"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"areaColor": "rgba(254,153,78,1)",
|
||||
"borderColor": "#444",
|
||||
"borderWidth": 1
|
||||
},
|
||||
"label": {
|
||||
"color": "rgb(100,0,0)"
|
||||
}
|
||||
}
|
||||
},
|
||||
"categoryAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#008acd"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#333"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": false,
|
||||
"lineStyle": {
|
||||
"color": [
|
||||
"#eee"
|
||||
]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": [
|
||||
"rgba(250,250,250,0.3)",
|
||||
"rgba(200,200,200,0.3)"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"valueAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#008acd"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#333"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": [
|
||||
"#eee"
|
||||
]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": true,
|
||||
"areaStyle": {
|
||||
"color": [
|
||||
"rgba(250,250,250,0.3)",
|
||||
"rgba(200,200,200,0.3)"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"logAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#008acd"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#333"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": [
|
||||
"#eee"
|
||||
]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": true,
|
||||
"areaStyle": {
|
||||
"color": [
|
||||
"rgba(250,250,250,0.3)",
|
||||
"rgba(200,200,200,0.3)"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"timeAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#008acd"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#333"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": [
|
||||
"#eee"
|
||||
]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": [
|
||||
"rgba(250,250,250,0.3)",
|
||||
"rgba(200,200,200,0.3)"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"toolbox": {
|
||||
"iconStyle": {
|
||||
"borderColor": "#2ec7c9"
|
||||
},
|
||||
"emphasis": {
|
||||
"iconStyle": {
|
||||
"borderColor": "#18a4a6"
|
||||
}
|
||||
}
|
||||
},
|
||||
"legend": {
|
||||
"textStyle": {
|
||||
"color": "#333333"
|
||||
}
|
||||
},
|
||||
"tooltip": {
|
||||
"axisPointer": {
|
||||
"lineStyle": {
|
||||
"color": "#008acd",
|
||||
"width": 1
|
||||
},
|
||||
"crossStyle": {
|
||||
"color": "#008acd",
|
||||
"width": 1
|
||||
}
|
||||
}
|
||||
},
|
||||
"timeline": {
|
||||
"lineStyle": {
|
||||
"color": "#008acd",
|
||||
"width": 1
|
||||
},
|
||||
"itemStyle": {
|
||||
"color": "#008acd",
|
||||
"borderWidth": 1
|
||||
},
|
||||
"controlStyle": {
|
||||
"color": "#008acd",
|
||||
"borderColor": "#008acd",
|
||||
"borderWidth": 0.5
|
||||
},
|
||||
"checkpointStyle": {
|
||||
"color": "#2ec7c9",
|
||||
"borderColor": "#2ec7c9"
|
||||
},
|
||||
"label": {
|
||||
"color": "#008acd"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"color": "#a9334c"
|
||||
},
|
||||
"controlStyle": {
|
||||
"color": "#008acd",
|
||||
"borderColor": "#008acd",
|
||||
"borderWidth": 0.5
|
||||
},
|
||||
"label": {
|
||||
"color": "#008acd"
|
||||
}
|
||||
}
|
||||
},
|
||||
"visualMap": {
|
||||
"color": [
|
||||
"#5ab1ef",
|
||||
"#e0ffff"
|
||||
]
|
||||
},
|
||||
"dataZoom": {
|
||||
"backgroundColor": "rgba(47,69,84,0)",
|
||||
"dataBackgroundColor": "#efefff",
|
||||
"fillerColor": "rgba(182,162,222,0.2)",
|
||||
"handleColor": "#008acd",
|
||||
"handleSize": "100%",
|
||||
"textStyle": {
|
||||
"color": "#333333"
|
||||
}
|
||||
},
|
||||
"markPoint": {
|
||||
"label": {
|
||||
"color": "#eeeeee"
|
||||
},
|
||||
"emphasis": {
|
||||
"label": {
|
||||
"color": "#eeeeee"
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}));
|
|
@ -136,8 +136,9 @@
|
|||
{{- if (.Scratch.Get "this").echarts -}}
|
||||
{{- $source := $cdn.echartsJS | default "lib/echarts/echarts.min.js" -}}
|
||||
{{- dict "Source" $source "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
|
||||
{{- dict "Source" "lib/echarts/theme/macarons.js" "Minify" true "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
|
||||
{{- dict "Source" "lib/echarts/theme/chalk.js" "Minify" true "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
|
||||
{{- $lightTheme := resources.Get "lib/echarts/theme/light.yml" | transform.Unmarshal -}}
|
||||
{{- $darkTheme := resources.Get "lib/echarts/theme/dark.yml" | transform.Unmarshal -}}
|
||||
{{- $config = dict "lightTheme" $lightTheme "darkTheme" $darkTheme | dict "echarts" | merge $config -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- /* Mapbox GL */ -}}
|
||||
|
|
|
@ -493,26 +493,30 @@ class Theme {
|
|||
}
|
||||
|
||||
initEcharts() {
|
||||
this._echartsOnSwitchTheme = this._echartsOnSwitchTheme || (() => {
|
||||
this._echartsArr = this._echartsArr || [];
|
||||
for (let i = 0; i < this._echartsArr.length; i++) {
|
||||
this._echartsArr[i].dispose();
|
||||
}
|
||||
this._echartsArr = [];
|
||||
this.util.forEach(document.getElementsByClassName('echarts'), $echarts => {
|
||||
const chart = echarts.init($echarts, this.isDark ? 'chalk' : 'macarons', {renderer: 'svg'});
|
||||
chart.setOption(JSON.parse(this.data[$echarts.id]));
|
||||
this._echartsArr.push(chart);
|
||||
if (this.config.echarts) {
|
||||
echarts.registerTheme('light', this.config.echarts.lightTheme);
|
||||
echarts.registerTheme('dark', this.config.echarts.darkTheme);
|
||||
this._echartsOnSwitchTheme = this._echartsOnSwitchTheme || (() => {
|
||||
this._echartsArr = this._echartsArr || [];
|
||||
for (let i = 0; i < this._echartsArr.length; i++) {
|
||||
this._echartsArr[i].dispose();
|
||||
}
|
||||
this._echartsArr = [];
|
||||
this.util.forEach(document.getElementsByClassName('echarts'), $echarts => {
|
||||
const chart = echarts.init($echarts, this.isDark ? 'dark' : 'light', {renderer: 'svg'});
|
||||
chart.setOption(JSON.parse(this.data[$echarts.id]));
|
||||
this._echartsArr.push(chart);
|
||||
});
|
||||
});
|
||||
});
|
||||
this.switchThemeEventSet.add(this._echartsOnSwitchTheme);
|
||||
this._echartsOnSwitchTheme();
|
||||
this._echartsOnResize = this._echartsOnResize || (() => {
|
||||
for (let i = 0; i < this._echartsArr.length; i++) {
|
||||
this._echartsArr[i].resize();
|
||||
}
|
||||
});
|
||||
this.resizeEventSet.add(this._echartsOnResize);
|
||||
this.switchThemeEventSet.add(this._echartsOnSwitchTheme);
|
||||
this._echartsOnSwitchTheme();
|
||||
this._echartsOnResize = this._echartsOnResize || (() => {
|
||||
for (let i = 0; i < this._echartsArr.length; i++) {
|
||||
this._echartsArr[i].resize();
|
||||
}
|
||||
});
|
||||
this.resizeEventSet.add(this._echartsOnResize);
|
||||
}
|
||||
}
|
||||
|
||||
initMapbox() {
|
||||
|
|
Loading…
Reference in a new issue