|
@@ -38,6 +38,7 @@
|
|
|
return {
|
|
|
id: "",
|
|
|
chart: null,
|
|
|
+ statemoreSty: 1
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
@@ -112,16 +113,8 @@
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
// color: "rgb(81, 81, 81)",
|
|
|
- color: function(params) {
|
|
|
- var colorList = [
|
|
|
- new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
|
|
- offset: 0, color: 'rgb(33, 107, 214)' // 颜色渐变
|
|
|
- }, {
|
|
|
- offset: 1, color: 'rgb(110, 205, 243)' // 颜色渐变
|
|
|
- }]),
|
|
|
- // ... 可以定义更多的颜色渐变
|
|
|
- ];
|
|
|
- return colorList[params.dataIndex % colorList.length];
|
|
|
+ color: (params) => {
|
|
|
+ return this.getLineare(params)
|
|
|
}
|
|
|
},
|
|
|
},
|
|
@@ -137,7 +130,9 @@
|
|
|
name: "",
|
|
|
itemStyle: {
|
|
|
// color: "rgb(33, 105, 195)",
|
|
|
- background: "linear-gradient(rgb(33, 107, 214), rgb(110, 205, 243))",
|
|
|
+ background: this.$store.state.moreSty === 'greenSty' ?
|
|
|
+ "linear-gradient(rgb(33, 107, 214), rgb(110, 205, 243))" :
|
|
|
+ "linear-gradient(rgb(81, 232, 166), rgb(36, 215, 129))",
|
|
|
},
|
|
|
label: {
|
|
|
show: false,
|
|
@@ -177,6 +172,30 @@
|
|
|
|
|
|
chart.setOption(option);
|
|
|
},
|
|
|
+ getLineare(params) {
|
|
|
+ let that = this
|
|
|
+ var colorList = []
|
|
|
+ if (that.statemoreSty !== 1) {
|
|
|
+ colorList = [
|
|
|
+ new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
|
|
+ offset: 0, color: 'rgb(33, 107, 214)' // 颜色渐变
|
|
|
+ }, {
|
|
|
+ offset: 1, color: 'rgb(110, 205, 243)' // 颜色渐变
|
|
|
+ }]),
|
|
|
+ // ... 可以定义更多的颜色渐变
|
|
|
+ ];
|
|
|
+ } else {
|
|
|
+ colorList = [
|
|
|
+ new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
|
|
+ offset: 0, color: 'rgb(81, 232, 166)' // 颜色渐变
|
|
|
+ }, {
|
|
|
+ offset: 1, color: 'rgb(36, 215, 129)' // 颜色渐变rgb(36, 215, 129)
|
|
|
+ }]),
|
|
|
+ // ... 可以定义更多的颜色渐变
|
|
|
+ ];
|
|
|
+ }
|
|
|
+ return colorList[params.dataIndex % colorList.length];
|
|
|
+ }
|
|
|
},
|
|
|
mounted() {
|
|
|
this.$nextTick(() => {
|
|
@@ -191,7 +210,12 @@
|
|
|
});
|
|
|
},
|
|
|
watch: {
|
|
|
- "$store.state.themeName"() {
|
|
|
+ "$store.state.moreSty"(val) {
|
|
|
+ if (val === 'greenSty') {
|
|
|
+ this.statemoreSty = 1
|
|
|
+ } else {
|
|
|
+ this.statemoreSty = 2
|
|
|
+ }
|
|
|
this.initChart();
|
|
|
},
|
|
|
},
|