KJ135
/
microwave-project-unite
mirror of http://172.16.0.12:5000/WBJY/microwave-project-unite.git
4
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

修改正射报告

tykong-cidian
duxiaoning 2024-08-27 03:22:53 +08:00
parent 28a38b22f6
commit 8022a67f3a
3 changed files with 298 additions and 279 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

564
src/components/qtReport/index.vue
View File

@ -1,61 +1,64 @@
<template> <template>
<div class="qtReport"> <div class="qtReport">
<div class="realResult"> <div class="realResult">
<div class="box1"><span class="sp1"></span><span class="sp2">真实性检验结果</span></div> <div class="box1">
<div class="resContent"> <span class="sp1"></span><span class="sp2">真实性检验结果</span>
<div> </div>
<el-tabs v-model="activeTabs"> <div class="resContent">
<el-tab-pane label="误差矩阵" name="pixel"> <div>
<ReportTable <el-tabs v-model="activeTabs">
:errorMatrix="errorMatrix" <el-tab-pane label="误差矩阵" name="pixel">
activeTabs="pixel" <ReportTable
></ReportTable> :errorMatrix="errorMatrix"
</el-tab-pane> activeTabs="pixel"
<el-tab-pane label="用户精度" name="userPre"> ></ReportTable>
<ReportTable </el-tab-pane>
:errorMatrix="errorMatrix" <el-tab-pane label="用户精度" name="userPre">
:preResults="preResults['用户精度']" <ReportTable
activeTabs="userPre" :errorMatrix="errorMatrix"
> :preResults="preResults['用户精度']"
</ReportTable> activeTabs="userPre"
</el-tab-pane> >
<el-tab-pane label="生产者精度" name="producerPre"> </ReportTable>
<ReportTable </el-tab-pane>
:errorMatrix="errorMatrix" <el-tab-pane label="生产者精度" name="producerPre">
:preResults="preResults['生产者精度']" <ReportTable
activeTabs="producerPre" :errorMatrix="errorMatrix"
> :preResults="preResults['生产者精度']"
</ReportTable> activeTabs="producerPre"
</el-tab-pane> >
<el-tab-pane label="错分精度" name="errorPre"> </ReportTable>
<ReportTable </el-tab-pane>
:errorMatrix="errorMatrix" <el-tab-pane label="错分精度" name="errorPre">
:preResults="preResults['错分误差']" <ReportTable
activeTabs="errorPre" :errorMatrix="errorMatrix"
> :preResults="preResults['错分误差']"
</ReportTable> activeTabs="errorPre"
</el-tab-pane> >
<el-tab-pane label="漏分精度" name="LeakagePre"> </ReportTable>
<ReportTable </el-tab-pane>
:errorMatrix="errorMatrix" <el-tab-pane label="漏分精度" name="LeakagePre">
:preResults="preResults['漏分误差']" <ReportTable
activeTabs="LeakagePre" :errorMatrix="errorMatrix"
> :preResults="preResults['漏分误差']"
</ReportTable> activeTabs="LeakagePre"
</el-tab-pane> >
</el-tabs> </ReportTable>
</div> </el-tab-pane>
</div> </el-tabs>
</div>
<div class="groudCoverType">
<div class="box1">
<span class="sp1"></span><span class="sp2">{{ pdSubTypeName }}误差结果图</span>
</div>
<div class="gctContent">
<div id="qtReportEchart" ref="chart"></div>
</div>
</div> </div>
</div>
</div> </div>
<div class="groudCoverType">
<div class="box1">
<span class="sp1"></span
><span class="sp2">{{ pdSubTypeName }}误差结果图</span>
</div>
<div class="gctContent">
<div id="qtReportEchart" ref="chart"></div>
</div>
</div>
</div>
</template> </template>
<script> <script>
@ -63,271 +66,282 @@ import ReportTable from "@/components/reportTable";
import { productTypeMap } from "@/lib/variateMap"; import { productTypeMap } from "@/lib/variateMap";
export default { export default {
components: { components: {
ReportTable, ReportTable,
},
props: {
realRes: {
require: true,
}, },
props: { pdSubType: {
realRes: { require: true,
require: true, },
},
data() {
return {
activeTabs: "pixel",
pdSubTypeName: null,
myCharts: null,
errorMatrix: null,
preResults: null,
};
},
created() {
this.initParam();
},
mounted() {
this.myCharts = this.$echarts.init(this.$refs.chart);
if (this.realRes.rocCoordinateValues !== undefined)
console.log("2222222", this.realRes.report["" + 12 + ""]);
this.drawPie(this.realRes.rocCoordinateValues);
},
methods: {
initParam() {
if (this.realRes !== undefined) {
this.pdSubTypeName = productTypeMap(this.pdSubType);
this.errorMatrix = this.realRes.report["" + 12 + ""]
? this.realRes.report["" + 12 + ""]
: [];
this.preResults = this.realRes.results ? this.realRes.results : {};
}
},
drawPie(rocVal) {
let tableData = this.realRes.report["" + 12 + ""];
let newTableData = this.deepClone(tableData);
let xArr = newTableData.pop();
let yArr = newTableData.pop();
let dataArr = [];
newTableData.forEach((a, index1) => {
a.forEach((b, index2) => {
dataArr.push([index1, index2, b.count]);
});
});
let echartOption = {
tooltip: {
position: "top",
}, },
pdSubType: { grid: {
require: true, height: "70%",
top: "10%",
}, },
}, xAxis: {
data() { type: "category",
return { data: xArr,
activeTabs: "pixel", splitArea: {
pdSubTypeName: null, show: true,
myCharts: null, },
errorMatrix: null, axisLabel: {
preResults: null, interval: 0,
}; formatter: function (value) {
}, // 将 x 轴的文字改为竖版显示
created() { var str = value.split("");
this.initParam(); return str.join("\n");
}, },
mounted() { },
this.myCharts = this.$echarts.init(this.$refs.chart);
if (this.realRes.rocCoordinateValues !== undefined)
console.log("2222222", this.realRes.report["" + 12 + ""]);
this.drawPie(this.realRes.rocCoordinateValues);
},
methods: {
initParam() {
if (this.realRes !== undefined) {
this.pdSubTypeName = productTypeMap(this.pdSubType);
this.errorMatrix = this.realRes.report["" + 12 + ""]
? this.realRes.report["" + 12 + ""]
: [];
this.preResults = this.realRes.results ? this.realRes.results : {};
}
}, },
drawPie(rocVal) { yAxis: {
let tableData = this.realRes.report["" + 12 + ""]; type: "category",
let xArr = tableData.pop(); data: yArr,
let yArr = tableData.pop(); splitArea: {
let dataArr = []; show: true,
tableData.forEach((a, index1) => { },
a.forEach((b, index2) => {
dataArr.push([index1, index2, b.count]);
});
});
let echartOption = {
tooltip: {
position: "top",
},
grid: {
height: "70%",
top: "10%",
},
xAxis: {
type: "category",
data: xArr,
splitArea: {
show: true,
},
axisLabel: {
interval: 0,
formatter: function (value) {
// 将 x 轴的文字改为竖版显示
var str = value.split("");
return str.join("\n");
},
},
},
yAxis: {
type: "category",
data: yArr,
splitArea: {
show: true,
},
},
visualMap: {
min: 0,
max: 10,
calculable: true,
left: "right", // 将 visualMap 组件放置在容器的右侧
top: "middle", // 垂直居中
orient: "vertical", // 垂直显示
inRange: {
color: ["#F4FBFD","#073671"], // 定义颜色渐变
},
// outOfRange: {
// color: "#999", // 数据值在范围外时的颜色
// },
},
series: [
{
name: "Punch Card",
type: "heatmap",
data: dataArr,
label: {
show: true,
},
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
},
],
};
echartOption && this.myCharts.setOption(echartOption);
return;
let allData = [];
for (let i in rocVal) {
let ad = [];
ad.push(
parseFloat(rocVal[i].cre_falseAlarmX.toFixed(3)),
parseFloat(rocVal[i].cre_reCallY.toFixed(3))
);
allData.push(ad);
}
console.log(allData);
let option = {
animation: false,
tooltip: {
formatter: "({c})",
},
xAxis: {
name: "漏分精度",
nameLocation: "middle",
nameTextStyle: {
lineHeight: 30,
height: 60,
fontWeight: "bold",
},
min: 0,
max: 1,
axisLabel: {
formatter: function (value) {
return Number(value).toFixed(1);
},
},
},
yAxis: {
name: "用户精度",
nameTextStyle: {
lineHeight: 30,
height: 60,
fontWeight: "bold",
},
min: 0,
max: 1,
axisLabel: {
formatter: function (value) {
return Number(value).toFixed(1);
},
},
},
series: [
{
symbolSize: 10,
data: allData,
type: "scatter",
},
],
};
option && this.myCharts.setOption(option);
}, },
visualMap: {
min: 0,
max: 10,
calculable: true,
left: "right", // 将 visualMap 组件放置在容器的右侧
top: "middle", // 垂直居中
orient: "vertical", // 垂直显示
inRange: {
color: ["#F4FBFD", "#073671"], // 定义颜色渐变
},
// outOfRange: {
// color: "#999", // 数据值在范围外时的颜色
// },
},
series: [
{
name: "Punch Card",
type: "heatmap",
data: dataArr,
animation: false,
label: {
show: true,
},
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
},
],
};
echartOption && this.myCharts.setOption(echartOption);
return;
let allData = [];
for (let i in rocVal) {
let ad = [];
ad.push(
parseFloat(rocVal[i].cre_falseAlarmX.toFixed(3)),
parseFloat(rocVal[i].cre_reCallY.toFixed(3))
);
allData.push(ad);
}
console.log(allData);
let option = {
animation: false,
tooltip: {
formatter: "({c})",
},
xAxis: {
name: "漏分精度",
nameLocation: "middle",
nameTextStyle: {
lineHeight: 30,
height: 60,
fontWeight: "bold",
},
min: 0,
max: 1,
axisLabel: {
formatter: function (value) {
return Number(value).toFixed(1);
},
},
},
yAxis: {
name: "用户精度",
nameTextStyle: {
lineHeight: 30,
height: 60,
fontWeight: "bold",
},
min: 0,
max: 1,
axisLabel: {
formatter: function (value) {
return Number(value).toFixed(1);
},
},
},
series: [
{
symbolSize: 10,
data: allData,
type: "scatter",
},
],
};
option && this.myCharts.setOption(option);
}, },
deepClone(obj) {
if (obj === null) return null;
let clone = obj instanceof Array ? [] : {};
for (const key of Object.keys(obj)) {
clone[key] =
typeof obj[key] === "object" ? this.deepClone(obj[key]) : obj[key];
}
return clone;
},
},
}; };
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.qtReport { .qtReport {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.realResult { .realResult {
width: 100%; width: 100%;
height: calc(55% - 5px); height: calc(55% - 5px);
background-color: white; background-color: white;
margin-bottom: 5px; margin-bottom: 5px;
} }
.groudCoverType { .groudCoverType {
width: 100%; width: 100%;
height: 45%; height: 45%;
background-color: white; background-color: white;
} }
.resContent { .resContent {
// border: 1px black solid; // border: 1px black solid;
height: calc(100% - 60px); height: calc(100% - 60px);
width: calc(100% - 20px); width: calc(100% - 20px);
margin: 10px; margin: 10px;
font-size: 20px; font-size: 20px;
overflow-y: scroll; overflow-y: scroll;
.rptitle { .rptitle {
display: block; display: block;
float: left; float: left;
font-size: 16px; font-size: 16px;
span { span {
color: #354595; color: #354595;
font-weight: bold; font-weight: bold;
}
} }
}
.sampling { .sampling {
width: calc(40% - 6px); width: calc(40% - 6px);
text-align: start; text-align: start;
margin-left: 6px; margin-left: 6px;
} }
.pixelDeal { .pixelDeal {
width: calc(60% - 6px); width: calc(60% - 6px);
text-align: end; text-align: end;
margin-right: 6px; margin-right: 6px;
} }
} }
/deep/.resContent .el-tabs__header { /deep/.resContent .el-tabs__header {
margin: 0; margin: 0;
} }
/deep/.resContent .el-tabs__item { /deep/.resContent .el-tabs__item {
padding: 0 13px; padding: 0 13px;
} }
.gctContent { .gctContent {
border: 1px black solid; border: 1px black solid;
height: calc(100% - 60px); height: calc(100% - 60px);
width: calc(100% - 20px); width: calc(100% - 20px);
margin: 10px; margin: 10px;
} }
#qtReportEchart { #qtReportEchart {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
.box1 { .box1 {
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
border-bottom: 1px solid rgb(205, 205, 205, 0.5); border-bottom: 1px solid rgb(205, 205, 205, 0.5);
} }
.sp1 { .sp1 {
display: inline-block; display: inline-block;
width: 7px; width: 7px;
height: 26px; height: 26px;
background-color: #354595; background-color: #354595;
vertical-align: top; vertical-align: top;
margin-left: 20px; margin-left: 20px;
margin-top: 8px; margin-top: 8px;
} }
.sp2 { .sp2 {
margin-left: 10px; margin-left: 10px;
font-size: 20px; font-size: 20px;
font-weight: 700; font-weight: 700;
color: #354595; color: #354595;
vertical-align: top; vertical-align: top;
} }
</style> </style>

6
src/components/rtReport/index.vue
View File

@ -431,7 +431,7 @@ export default {
}, },
}, },
yAxis: { yAxis: {
name: "误差", name: "实测值（" + this.getProductDes() + "）",
nameTextStyle: { nameTextStyle: {
lineHeight: 30, lineHeight: 30,
height: 60, height: 60,
@ -531,7 +531,7 @@ export default {
let num = converted.geometry.coordinates[0]; let num = converted.geometry.coordinates[0];
const p = Math.floor(Math.log(num) / Math.LN10); const p = Math.floor(Math.log(num) / Math.LN10);
const n = num * 10 ** -p; const n = num * 10 ** -p;
return `${n.toFixed(4)}xe${p}`; return `${n.toFixed(4)}e${p}`;
}, },
}, },
}, },
@ -551,7 +551,7 @@ export default {
let num = converted.geometry.coordinates[1]; let num = converted.geometry.coordinates[1];
const p = Math.floor(Math.log(num) / Math.LN10); const p = Math.floor(Math.log(num) / Math.LN10);
const n = num * 10 ** -p; const n = num * 10 ** -p;
return `${n.toFixed(4)}xe${p}`; return `${n.toFixed(4)}e${p}`;
}, },
}, },
}, },

7
src/views/Daichuli/Feedback/Inspection/Report/index.vue
View File

@ -193,7 +193,12 @@ export default {
this.pdSubType === productSubTypeVal.ACS_TYPESOFLANDCOVER || this.pdSubType === productSubTypeVal.ACS_TYPESOFLANDCOVER ||
this.pdSubType === productSubTypeVal.ACS_VEGETATIONPHENOLOGY this.pdSubType === productSubTypeVal.ACS_VEGETATIONPHENOLOGY
) { ) {
this.base64Data = this.$refs.reportQT.myCharts.getDataURL(); this.base64Data = this.$refs.reportQT.myCharts.getDataURL({
type: "png",
pixelRatio: 1.5, //放大两倍下载，之后压缩到同等大小展示。解决生成图片在移动端模糊问题
backgroundColor: "#fff",
excludeComponents: ["toolbox", "dataZoom"],
});
} else { } else {
this.base64Data = this.$refs.reportRT.myCharts.getDataURL({ this.base64Data = this.$refs.reportRT.myCharts.getDataURL({
type: "png", type: "png",