|
@@ -9,29 +9,49 @@
|
|
|
//import from '';
|
|
|
|
|
|
export default {
|
|
|
- name: "canvasVehicleConfiguration", //
|
|
|
+ name: "canvasVehicleConfiguration", // 车辆配置详情中的canvas
|
|
|
components: {},
|
|
|
data() {
|
|
|
return {
|
|
|
// modelImgSrc: require("@/assets/common/image/others/carTopView.png"),
|
|
|
- aSrc: require("@/assets/common/image/others/sensorIcon.png"),
|
|
|
+ // aSrc: require("@/assets/common/image/others/sensorIcon.png"),
|
|
|
ctx: null,
|
|
|
ctxBg: null,
|
|
|
imgBg: null,
|
|
|
imgIcon: null,
|
|
|
- rate: 70, // 换算比例
|
|
|
+ rate: 70 / 1000, // 换算比例 70为给出的比例关系
|
|
|
};
|
|
|
},
|
|
|
|
|
|
props: {
|
|
|
coordinate: {
|
|
|
type: Object,
|
|
|
- default: { x: 0, y: 0, h: 60 },
|
|
|
+ default: { x: 0, y: 0, h: 0 },
|
|
|
},
|
|
|
modelImgSrc: {
|
|
|
type: String,
|
|
|
default: require("@/assets/common/image/others/carTopView.png"),
|
|
|
},
|
|
|
+ curOneName: {
|
|
|
+ type: String,
|
|
|
+ default: "camera",
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ computed: {
|
|
|
+ sensorSrc() {
|
|
|
+ if (this.curOneName === "camera") {
|
|
|
+ return require("@/assets/common/image/sensor/l1.png");
|
|
|
+ } else if (this.curOneName === "ogt") {
|
|
|
+ return require("@/assets/common/image/sensor/l2.png");
|
|
|
+ } else if (this.curOneName === "lidar") {
|
|
|
+ return require("@/assets/common/image/sensor/l3.png");
|
|
|
+ } else if (this.curOneName === "gps") {
|
|
|
+ return require("@/assets/common/image/sensor/l5.png");
|
|
|
+ } else {
|
|
|
+ return require("@/assets/common/image/sensor/l1.png");
|
|
|
+ }
|
|
|
+ },
|
|
|
},
|
|
|
|
|
|
watch: {
|
|
@@ -46,6 +66,7 @@ export default {
|
|
|
methods: {
|
|
|
draw(data) {
|
|
|
if (data.x === "" || data.y === "" || data.h === "") return;
|
|
|
+ this.imgIcon.src = this.sensorSrc;
|
|
|
|
|
|
let rate = this.rate;
|
|
|
// 摄像头从自己左上角的原点开始绘制,需要移到自己的中心点
|
|
@@ -55,7 +76,8 @@ export default {
|
|
|
let h2 = 90 + +data.h / 2;
|
|
|
|
|
|
this.ctx.clearRect(-250, -40, 500, 1000);
|
|
|
- this.ctx.drawImage(this.imgIcon, x - 6, y - 6, 20.5, 14.5);
|
|
|
+ // this.ctx.drawImage(this.imgIcon, x - 6, y - 6, 20.5, 14.5);
|
|
|
+ this.ctx.drawImage(this.imgIcon, x - 6, y - 6, 20, 20);
|
|
|
this.ctx.beginPath();
|
|
|
|
|
|
//定义起点
|
|
@@ -92,7 +114,7 @@ export default {
|
|
|
};
|
|
|
|
|
|
this.imgIcon = new Image();
|
|
|
- this.imgIcon.src = this.aSrc;
|
|
|
+ this.imgIcon.src = this.sensorSrc;
|
|
|
});
|
|
|
},
|
|
|
};
|