diff --git a/src/views/cultrue/index.vue b/src/views/cultrue/index.vue
index 85771cf..1e3b035 100644
--- a/src/views/cultrue/index.vue
+++ b/src/views/cultrue/index.vue
@@ -592,7 +592,7 @@ export default {
return arr;
}
- console.log(getSymbolData(data), '-----');
+ // console.log(getSymbolData(data), '-----');
option = {
// backgroundColor: '#000000',
grid: {
diff --git a/src/views/index.vue b/src/views/index.vue
index e0e59a6..6472f8a 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -502,164 +502,6 @@ export default {
var chartDom = document.getElementById("kl-line");
var option;
- var xData = this.rsqsXData;
- var gcolor = ['#ff9acc', '#6666FF', '#FF6600', '#02ff00', '#00ffff', '#fdff00']
-
- var data = this.rsqsData_z;
-
- var series = [];
- for (var i = 0; i < data.length; i++) {
- // console.log(gcolor[i])
-
- series.push({
- name: this.rsqsDataName[i],
- type: "line",
- symbolSize: 3,//标记的大小，可以设置成诸如 10 这样单一的数字，也可以用数组分开表示宽和高，例如 [20, 10] 表示标记宽为20，高为10[ default: 4 ]
- symbol: 'circle',//标记的图形。ECharts 提供的标记类型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
- smooth: true, //是否平滑曲线显示
- showSymbol: false, //是否显示 symbol, 如果 false 则只有在 tooltip hover 的时候显示
- areaStyle: {
- normal: {
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- offset: 0,
- color: gcolor[i]
- }, {
- offset: 0.8,
- color: '#fff',
- }], false),
- // shadowColor: 'rgba(255,255,255, 0.1)',
- shadowBlur: 10,
- opacity: 0.3,
- }
- },
- itemStyle: {
- normal: {
- color: gcolor[i],
- lineStyle: {
- width: 1,
- type: 'solid' //'dotted'虚线 'solid'实线
- },
- borderColor: gcolor[i], //图形的描边颜色。支持的格式同 color
- borderWidth: 8,//描边线宽。为 0 时无描边。[ default: 0 ]
- barBorderRadius: 0,
- label: {
- show: false,
- },
- opacity: 0.5,
- }
- },
- data: data[i],
-
- })
- }
-
- // setting option
- option = {
- // backgroundColor: "#141f56",
- legend: {
- top: 0,
- right: 0,
- bottom: 0,
- itemGap: 15,
- itemWidth: 15,
- textStyle: {
- color: '#fff',
- fontSize: '14'
- },
- data: name
- },
- title: {
- // text: "负面言论分领域趋势",
- textStyle: {
- color: '#fff',
- fontSize: '22',
- fontWeight: 'normal',
- },
- subtextStyle: {
- color: '#90979c',
- fontSize: '16',
-
- },
- },
- tooltip: {
- trigger: "axis",
- axisPointer: { // 坐标轴指示器，坐标轴触发有效
- type: 'line', // 默认为直线，可选为：'line' | 'shadow'
- lineStyle: {
- color: '#57617B'
- }
- },
- formatter: '{b}
{a0}: {c0}
{a1}: {c1}
{a2}: {c2}
{a3}: {c3}
{a4}: {c4}
{a5}: {c5}',
- backgroundColor: '#000', // 背景
- padding: [8, 10], //内边距
- extraCssText: 'box-shadow: 0 0 3px #fffff;', //添加阴影
- },
- grid: {
- borderWidth: 0,
- top: 10,
- bottom: 20,
- right: 0,
- left: 50,
- textStyle: {
- color: "#fff"
- }
- },
- xAxis: [{
- type: "category",
- axisLine: {
- show: false,
- },
- splitLine: {
- show: true,
- lineStyle: {
- color: '#0B0765',
- }
- },
- boundaryGap: false, //坐标轴两边留白策略，类目轴和非类目轴的设置和表现不一样
- axisTick: {
- show: false
- },
- splitArea: {
- show: false
- },
- axisLabel: {
- inside: false,
- textStyle: {
- color: '#FFFFFF',
- fontWeight: 'normal',
- fontSize: '12',
- },
- },
- data: xData,
- }],
- yAxis: {
- type: 'value',
- axisTick: {
- show: false
- },
- axisLine: {
- show: true,
- lineStyle: {
- color: '#0B0765',
- }
- },
- splitLine: {
- show: true,
- lineStyle: {
- color: '#0B0765',
- }
- },
- axisLabel: {
- textStyle: {
- color: '#0095FF',
- fontWeight: 'normal',
- fontSize: '12',
- },
- formatter: '{value}',
- },
- },
- series: series,
- }
function run(myChart){
// 获取新数据-处理
that.getGcgNumDatas();
@@ -671,8 +513,6 @@ export default {
var series = [];
for (var i = 0; i < data.length; i++) {
- // console.log(gcolor[i])
-
series.push({
name: that.rsqsDataName[i],
type: "line",
@@ -714,18 +554,121 @@ export default {
})
}
- myChart.setOption({
- xAxis: [{data: xData}],
- series: series
- });
- }, 2000);
+ // setting option
+ option = {
+ // backgroundColor: "#141f56",
+ legend: {
+ top: 0,
+ right: 0,
+ bottom: 0,
+ itemGap: 15,
+ itemWidth: 15,
+ textStyle: {
+ color: '#fff',
+ fontSize: '14'
+ },
+ data: name
+ },
+ title: {
+ // text: "负面言论分领域趋势",
+ textStyle: {
+ color: '#fff',
+ fontSize: '22',
+ fontWeight: 'normal',
+ },
+ subtextStyle: {
+ color: '#90979c',
+ fontSize: '16',
+
+ },
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: { // 坐标轴指示器，坐标轴触发有效
+ type: 'line', // 默认为直线，可选为：'line' | 'shadow'
+ lineStyle: {
+ color: '#57617B'
+ }
+ },
+ formatter: '{b}
{a0}: {c0}
{a1}: {c1}
{a2}: {c2}
{a3}: {c3}
{a4}: {c4}
{a5}: {c5}',
+ backgroundColor: '#000', // 背景
+ padding: [8, 10], //内边距
+ extraCssText: 'box-shadow: 0 0 3px #fffff;', //添加阴影
+ },
+ grid: {
+ borderWidth: 0,
+ top: 10,
+ bottom: 20,
+ right: 0,
+ left: 50,
+ textStyle: {
+ color: "#fff"
+ }
+ },
+ xAxis: [{
+ type: "category",
+ axisLine: {
+ show: false,
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: '#0B0765',
+ }
+ },
+ boundaryGap: false, //坐标轴两边留白策略，类目轴和非类目轴的设置和表现不一样
+ axisTick: {
+ show: false
+ },
+ splitArea: {
+ show: false
+ },
+ axisLabel: {
+ inside: false,
+ textStyle: {
+ color: '#FFFFFF',
+ fontWeight: 'normal',
+ fontSize: '12',
+ },
+ },
+ data: xData,
+ }],
+ yAxis: {
+ type: 'value',
+ axisTick: {
+ show: false
+ },
+ axisLine: {
+ show: true,
+ lineStyle: {
+ color: '#0B0765',
+ }
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: '#0B0765',
+ }
+ },
+ axisLabel: {
+ textStyle: {
+ color: '#0095FF',
+ fontWeight: 'normal',
+ fontSize: '12',
+ },
+ formatter: '{value}',
+ },
+ },
+ series: series,
+ }
+ option && myChart.setOption(option);
+ }, 200);
}
setTimeout(()=>{
var myChart = echarts.init(chartDom);
- option && myChart.setOption(option);
+ run(myChart);
setInterval(function () {
myChart.clear();
- option && myChart.setOption(option);
run(myChart);
}, 3000);
}, 200)
@@ -786,19 +729,19 @@ export default {
let that = this
homeApi.allInfoDatas().then(res => {
// return;//Cannot read properties of undefined (reading 'returnData')
- that.ssjgNumDatas = res.data.returnData
- console.log(that.ssjgNumDatas, 'that.ssjgNumDatas')
- that.ssjgNumDatas.forEach(item => {
- let proportion = parseInt(item.proportion)
- if (proportion >= 80 && proportion <= 90) {
- this.$refs.proportionbox.addClass('rbrate2')
- }
- if (proportion > 90) {
- this.$refs.proportionbox.addClass('rbrate3')
- }
- })
-
-
+ if(res.data){
+ that.ssjgNumDatas = res.data.returnData
+ console.log(that.ssjgNumDatas, 'that.ssjgNumDatas')
+ that.ssjgNumDatas.forEach(item => {
+ let proportion = parseInt(item.proportion)
+ if (proportion >= 80 && proportion <= 90) {
+ this.$refs.proportionbox.addClass('rbrate2')
+ }
+ if (proportion > 90) {
+ this.$refs.proportionbox.addClass('rbrate3')
+ }
+ })
+ }
});
},
diff --git a/src/views/ty/index.vue b/src/views/ty/index.vue
index 86f4c3a..71c904b 100644
--- a/src/views/ty/index.vue
+++ b/src/views/ty/index.vue
@@ -62,11 +62,11 @@
24小时进馆人数
- {{ cgdata[0].gval }}
+ {{ cgdata[0]&&cgdata[0].gval }}
体育场
- {{ cgdata[1].gval }}
+ {{ cgdata[1]&&cgdata[1].gval }}
体育馆
- {{ cgdata[2].gval }}
+ {{ cgdata[2]&&cgdata[2].gval }}
游泳场馆
@@ -96,7 +96,7 @@
- {{ cgdata[0].gname }}
+ {{ cgdata[0]&&cgdata[0].gname }}
@@ -111,7 +111,7 @@
- {{ cgdata[1].gname }}
+ {{ cgdata[1]&&cgdata[1].gname }}
@@ -126,7 +126,7 @@
- {{ cgdata[2].gname }}
+ {{ cgdata[2]&&cgdata[2].gname }}
@@ -441,17 +441,18 @@ export default {
},
ty_bar3() {
+ let that = this;
var chartDom = document.getElementById("pcgchart2");
var option
- var xData = this.rsqsXData;
+ var xData = that.rsqsXData;
var color = ['#FF99CC', '#6666FF', '#FF6600', '#7049f0', '#fa704d', '#01babc',]
- var name = this.rsqsDataName
- // console.log(this.rsqsDataName, 'this.rsqsDataName')
+ var name = that.rsqsDataName
+ // console.log(that.rsqsDataName, 'that.rsqsDataName')
// = ['体育场', '体育馆', '游泳场馆'];
- var data = this.rsqsDataAll;
+ var data = that.rsqsDataAll;
let iconData = [];
- this.rsqsDataName.forEach((item, index)=>{
+ that.rsqsDataName.forEach((item, index)=>{
if(index==0){
iconData.push({icon: 'image://img/tyc_icon.png', name: name[0]})
}else if(index==1){
@@ -619,12 +620,11 @@ export default {
series: series,
}
function run(myChart){
- let that = this;
// 获取新数据-处理
// that.getGcgNumDatas();
setTimeout(() => {
// var xData = this.rsqsXData;
- var data = this.rsqsDataAll;
+ var data = that.rsqsDataAll;
var series = [];
for (var i = 0; i < data.length; i++) {