|
@@ -413,8 +413,6 @@ let app = new Vue({
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
initChartR1() {
|
|
initChartR1() {
|
|
- let that = this;
|
|
|
|
- let sumA = 42;
|
|
|
|
let right5 = [
|
|
let right5 = [
|
|
[
|
|
[
|
|
["山西焦煤", 43.8],
|
|
["山西焦煤", 43.8],
|
|
@@ -477,24 +475,7 @@ let app = new Vue({
|
|
["神农科技", 15.6],
|
|
["神农科技", 15.6],
|
|
],
|
|
],
|
|
];
|
|
];
|
|
- // 所有在100范围外的全部变成0,其他值相应增加/减少sumA
|
|
|
|
- right5.forEach((item) => {
|
|
|
|
- item.forEach((item2) => {
|
|
|
|
- if (Number(item2[1]) < 0) {
|
|
|
|
- item2[1] = that.$set(item2, 1, Number(that.numSub(item2[1], sumA)));
|
|
|
|
- } else if (Number(item2[1]) > 0) {
|
|
|
|
- item2[1] = that.$set(item2, 1, Number(item2[1]) + sumA);
|
|
|
|
- }
|
|
|
|
- if (Number(item2[1]) < -100 - sumA) {
|
|
|
|
- item2[1] = that.$set(item2, 1, 0);
|
|
|
|
- item2[1] = that.$set(item2, 2, 0);
|
|
|
|
- } else if (Number(item2[1]) > 100 + sumA) {
|
|
|
|
- item2[1] = that.$set(item2, 1, 0);
|
|
|
|
- item2[1] = that.$set(item2, 2, 0);
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
- });
|
|
|
|
-
|
|
|
|
|
|
+ let that = this;
|
|
const itemStyle = {
|
|
const itemStyle = {
|
|
// opacity: 0.8,
|
|
// opacity: 0.8,
|
|
shadowBlur: 10,
|
|
shadowBlur: 10,
|
|
@@ -502,9 +483,8 @@ let app = new Vue({
|
|
shadowOffsetY: 0,
|
|
shadowOffsetY: 0,
|
|
shadowColor: "rgba(0,0,0,0.3)",
|
|
shadowColor: "rgba(0,0,0,0.3)",
|
|
};
|
|
};
|
|
- that.right2Chart = echarts.init(this.$refs["echartR1"]);
|
|
|
|
- that.right2Chart.on("showTip", (params) => {
|
|
|
|
- console.log(params);
|
|
|
|
|
|
+ let myChart = echarts.init(this.$refs["echartR1"]);
|
|
|
|
+ myChart.on("showTip", (params) => {
|
|
// 如果是7或者15并且满足防抖则切换
|
|
// 如果是7或者15并且满足防抖则切换
|
|
if (
|
|
if (
|
|
(params.dataIndex == 5 || params.dataIndex == 11) &&
|
|
(params.dataIndex == 5 || params.dataIndex == 11) &&
|
|
@@ -514,7 +494,7 @@ let app = new Vue({
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6;
|
|
option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6;
|
|
option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6;
|
|
option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6;
|
|
- that.right2Chart.setOption(option);
|
|
|
|
|
|
+ myChart.setOption(option);
|
|
// 防止勿刷新做的防抖
|
|
// 防止勿刷新做的防抖
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
that.echartR2Fd = true;
|
|
that.echartR2Fd = true;
|
|
@@ -526,7 +506,7 @@ let app = new Vue({
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
option.dataZoom[0].endValue = 0;
|
|
option.dataZoom[0].endValue = 0;
|
|
option.dataZoom[0].startValue = 5;
|
|
option.dataZoom[0].startValue = 5;
|
|
- that.right2Chart.setOption(option);
|
|
|
|
|
|
+ myChart.setOption(option);
|
|
// 防止勿刷新做的防抖
|
|
// 防止勿刷新做的防抖
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
that.echartR2Fd = true;
|
|
that.echartR2Fd = true;
|
|
@@ -535,7 +515,7 @@ let app = new Vue({
|
|
}
|
|
}
|
|
});
|
|
});
|
|
let option = {
|
|
let option = {
|
|
- color: ["#04635E", "#697143", "#4A3042"],
|
|
|
|
|
|
+ color: ["#74a55d", "#cea446", "#b84b4b"],
|
|
dataZoom: [
|
|
dataZoom: [
|
|
{
|
|
{
|
|
// start: 9,//默认为@
|
|
// start: 9,//默认为@
|
|
@@ -569,9 +549,7 @@ let app = new Vue({
|
|
},
|
|
},
|
|
],
|
|
],
|
|
legend: {
|
|
legend: {
|
|
- selectedMode: false,
|
|
|
|
top: 10,
|
|
top: 10,
|
|
- right: "6%",
|
|
|
|
data: ["正偏差", "容差", "负偏差"],
|
|
data: ["正偏差", "容差", "负偏差"],
|
|
textStyle: {
|
|
textStyle: {
|
|
fontSize: 20,
|
|
fontSize: 20,
|
|
@@ -591,21 +569,7 @@ let app = new Vue({
|
|
// fontFamily: "Microsoft YaHei",
|
|
// fontFamily: "Microsoft YaHei",
|
|
// },
|
|
// },
|
|
// formatter: (data) => {
|
|
// formatter: (data) => {
|
|
- // return `${
|
|
|
|
- // data[0].value[0]
|
|
|
|
- // }<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${
|
|
|
|
- // data[0].color
|
|
|
|
- // }"></span> ${data[0].seriesName}:${that.numFormat(
|
|
|
|
- // data[0].data[2]
|
|
|
|
- // )}亿<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${
|
|
|
|
- // data[1].color
|
|
|
|
- // }"></span> ${data[1].seriesName}:${that.numFormat(
|
|
|
|
- // data[1].data[2]
|
|
|
|
- // )}亿<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${
|
|
|
|
- // data[2].color
|
|
|
|
- // }"></span> ${data[2].seriesName}:${that.numFormat(
|
|
|
|
- // data[2].data[2]
|
|
|
|
- // )}亿`;
|
|
|
|
|
|
+ // return `${data[0].value[0]}<br /><span style="display:inline-block;border-radius:50%; width:14px;height:14px;background-color:${data[0].color}"></span> ${data[0].seriesName}:${data[0].data[1]}亿<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[1].color}"></span> ${data[1].seriesName}:${data[1].data[1]}亿<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[2].color}"></span> ${data[2].seriesName}:${data[2].data[1]}亿`;
|
|
// },
|
|
// },
|
|
// axisPointer: {
|
|
// axisPointer: {
|
|
// // // type: 'cross',',
|
|
// // // type: 'cross',',
|
|
@@ -613,17 +577,14 @@ let app = new Vue({
|
|
// },
|
|
// },
|
|
grid: {
|
|
grid: {
|
|
top: "10%",
|
|
top: "10%",
|
|
- right: "7%",
|
|
|
|
- left: "7%",
|
|
|
|
- bottom: "6%",
|
|
|
|
|
|
+ right: "4%",
|
|
|
|
+ left: "5%",
|
|
|
|
+ bottom: "5%",
|
|
},
|
|
},
|
|
yAxis: {
|
|
yAxis: {
|
|
- min: -101 - sumA,
|
|
|
|
- max: 101 + sumA,
|
|
|
|
- maxInterval: 1,
|
|
|
|
|
|
+ name: "亿元",
|
|
splitLine: {
|
|
splitLine: {
|
|
- show: false,
|
|
|
|
- // interval:,
|
|
|
|
|
|
+ show: true,
|
|
lineStyle: {
|
|
lineStyle: {
|
|
color: "#68b4dd66",
|
|
color: "#68b4dd66",
|
|
type: "dashed",
|
|
type: "dashed",
|
|
@@ -632,23 +593,9 @@ let app = new Vue({
|
|
axisLine: {
|
|
axisLine: {
|
|
show: false,
|
|
show: false,
|
|
},
|
|
},
|
|
- axisTick: {
|
|
|
|
- show: false,
|
|
|
|
- },
|
|
|
|
axisLabel: {
|
|
axisLabel: {
|
|
show: true,
|
|
show: true,
|
|
- // formatter: '{value}',
|
|
|
|
- formatter(data) {
|
|
|
|
- if (data == 100 + sumA) {
|
|
|
|
- return "100%";
|
|
|
|
- } else if (data == -100 - sumA) {
|
|
|
|
- return "-100%";
|
|
|
|
- } else if (data == -5 - sumA) {
|
|
|
|
- return "-5%";
|
|
|
|
- } else if (data == 5 + sumA) {
|
|
|
|
- return "5%";
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
|
|
+ formatter: "{value}",
|
|
textStyle: {
|
|
textStyle: {
|
|
color: "#fff",
|
|
color: "#fff",
|
|
fontSize: "20",
|
|
fontSize: "20",
|
|
@@ -664,7 +611,7 @@ let app = new Vue({
|
|
xAxis: {
|
|
xAxis: {
|
|
data: right5[0].map((item) => item[0]),
|
|
data: right5[0].map((item) => item[0]),
|
|
axisLine: {
|
|
axisLine: {
|
|
- show: false, //隐藏X轴轴线
|
|
|
|
|
|
+ show: true, //隐藏X轴轴线
|
|
lineStyle: {
|
|
lineStyle: {
|
|
color: "#005094",
|
|
color: "#005094",
|
|
width: 1,
|
|
width: 1,
|
|
@@ -678,15 +625,15 @@ let app = new Vue({
|
|
},
|
|
},
|
|
},
|
|
},
|
|
axisTick: {
|
|
axisTick: {
|
|
- show: true, //隐藏X轴刻度
|
|
|
|
|
|
+ show: false, //隐藏X轴刻度
|
|
},
|
|
},
|
|
axisLabel: {
|
|
axisLabel: {
|
|
show: true,
|
|
show: true,
|
|
- rotate: 20,
|
|
|
|
|
|
+ // rotate: 40,
|
|
padding: [0, 0, 0, 0],
|
|
padding: [0, 0, 0, 0],
|
|
textStyle: {
|
|
textStyle: {
|
|
color: "#fff", //X轴文字颜色
|
|
color: "#fff", //X轴文字颜色
|
|
- fontSize: 22,
|
|
|
|
|
|
+ fontSize: 20,
|
|
fontFamily: "Microsoft YaHei",
|
|
fontFamily: "Microsoft YaHei",
|
|
},
|
|
},
|
|
},
|
|
},
|
|
@@ -698,77 +645,7 @@ let app = new Vue({
|
|
itemStyle: itemStyle,
|
|
itemStyle: itemStyle,
|
|
data: right5[0],
|
|
data: right5[0],
|
|
symbolSize: function (data) {
|
|
symbolSize: function (data) {
|
|
- if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
|
|
|
|
- return 40;
|
|
|
|
- } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
|
|
|
|
- return 70;
|
|
|
|
- } else if (data[2] > 100) {
|
|
|
|
- return 100;
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- markLine: {
|
|
|
|
- symbol: "none",
|
|
|
|
- data: [
|
|
|
|
- {
|
|
|
|
- name: "100%",
|
|
|
|
- yAxis: 100 + sumA,
|
|
|
|
- lineStyle: {
|
|
|
|
- // color: '#fff',
|
|
|
|
- },
|
|
|
|
- label: {
|
|
|
|
- show: false,
|
|
|
|
- formatter: "{b}",
|
|
|
|
- position: "right",
|
|
|
|
- color: "#fff",
|
|
|
|
- fontSize: 20,
|
|
|
|
- label: {
|
|
|
|
- show: false,
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- name: "5%",
|
|
|
|
- yAxis: 5 + sumA,
|
|
|
|
- lineStyle: {
|
|
|
|
- // color: '#fff',
|
|
|
|
- },
|
|
|
|
- label: {
|
|
|
|
- show: false,
|
|
|
|
- formatter: "{b}",
|
|
|
|
- position: "right",
|
|
|
|
- color: "#fff",
|
|
|
|
- fontSize: 20,
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- name: "-5%",
|
|
|
|
- yAxis: -5 - sumA,
|
|
|
|
- lineStyle: {
|
|
|
|
- // color: '#fff',
|
|
|
|
- },
|
|
|
|
- label: {
|
|
|
|
- show: false,
|
|
|
|
- formatter: "{b}",
|
|
|
|
- position: "right",
|
|
|
|
- color: "#fff",
|
|
|
|
- fontSize: 20,
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- name: "100%",
|
|
|
|
- yAxis: -100 - sumA,
|
|
|
|
- lineStyle: {
|
|
|
|
- // color: '#fff',
|
|
|
|
- },
|
|
|
|
- label: {
|
|
|
|
- show: false,
|
|
|
|
- formatter: "{b}",
|
|
|
|
- position: "right",
|
|
|
|
- color: "#fff",
|
|
|
|
- fontSize: 20,
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- ],
|
|
|
|
|
|
+ return Math.sqrt(data[1]) * 9;
|
|
},
|
|
},
|
|
},
|
|
},
|
|
{
|
|
{
|
|
@@ -777,13 +654,7 @@ let app = new Vue({
|
|
itemStyle: itemStyle,
|
|
itemStyle: itemStyle,
|
|
data: right5[1],
|
|
data: right5[1],
|
|
symbolSize: function (data) {
|
|
symbolSize: function (data) {
|
|
- if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
|
|
|
|
- return 40;
|
|
|
|
- } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
|
|
|
|
- return 70;
|
|
|
|
- } else if (data[2] > 100) {
|
|
|
|
- return 100;
|
|
|
|
- }
|
|
|
|
|
|
+ return Math.sqrt(data[1]) * 8;
|
|
},
|
|
},
|
|
},
|
|
},
|
|
{
|
|
{
|
|
@@ -792,44 +663,17 @@ let app = new Vue({
|
|
itemStyle: itemStyle,
|
|
itemStyle: itemStyle,
|
|
data: right5[2],
|
|
data: right5[2],
|
|
symbolSize: function (data) {
|
|
symbolSize: function (data) {
|
|
- if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
|
|
|
|
- return 40;
|
|
|
|
- } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
|
|
|
|
- return 70;
|
|
|
|
- } else if (data[2] > 100) {
|
|
|
|
- return 100;
|
|
|
|
- }
|
|
|
|
|
|
+ return Math.sqrt(data[1]) * 7;
|
|
},
|
|
},
|
|
},
|
|
},
|
|
],
|
|
],
|
|
};
|
|
};
|
|
- that.right2Chart.on("click", function (param) {
|
|
|
|
- if (that.versions) {
|
|
|
|
- that.rightAdd.modelName = 1;
|
|
|
|
- that.rightAdd.substraction =
|
|
|
|
- param.seriesName == "正偏差"
|
|
|
|
- ? 1
|
|
|
|
- : param.seriesName == "容差"
|
|
|
|
- ? 2
|
|
|
|
- : 3;
|
|
|
|
- that.rightAdd.projectStepCode = "";
|
|
|
|
- that.projectNum = 313;
|
|
|
|
- that.rightPenetrateTwo(
|
|
|
|
- 1,
|
|
|
|
- param.seriesName == "正偏差"
|
|
|
|
- ? 1
|
|
|
|
- : param.seriesName == "容差"
|
|
|
|
- ? 2
|
|
|
|
- : 3,
|
|
|
|
- that.findCode(param.name),
|
|
|
|
- "right"
|
|
|
|
- );
|
|
|
|
- } else {
|
|
|
|
- that.projectListTipShow = true;
|
|
|
|
- }
|
|
|
|
|
|
+ myChart.on("click", function (param) {
|
|
|
|
+ // that.showChartLTipDouble(param.name)
|
|
|
|
+ that.projectListTipShow = true;
|
|
});
|
|
});
|
|
- that.right2Chart.setOption(option);
|
|
|
|
- tools.loopShowTooltip(that.right2Chart, option, {
|
|
|
|
|
|
+ myChart.setOption(option);
|
|
|
|
+ tools.loopShowTooltip(myChart, option, {
|
|
interval: 2000,
|
|
interval: 2000,
|
|
loopSeries: true,
|
|
loopSeries: true,
|
|
});
|
|
});
|