|
|
@@ -80,23 +80,7 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- color1: [
|
|
|
- "#DBEEBC",
|
|
|
- "#A8D7BE",
|
|
|
- "#8ECAC1",
|
|
|
- "#77BDC2",
|
|
|
- "#64ADC2",
|
|
|
- "#559ABE",
|
|
|
- "#4884B7",
|
|
|
- "#406DAB",
|
|
|
- "#3856A0",
|
|
|
- "#314291",
|
|
|
- "#28357A",
|
|
|
- "#1A285E",
|
|
|
- "#FF7F50",
|
|
|
- "#FFD700",
|
|
|
- "#90EE90",
|
|
|
- ], // 默认颜色
|
|
|
+ color1: [], // 默认颜色
|
|
|
chartData: {},
|
|
|
chartType: "scatter", // 当前图表类型（默认是散点图）
|
|
|
colorSchemes: [...colorSchemes],
|
|
|
@@ -215,11 +199,15 @@ export default {
|
|
|
`${this.chartData.yaixs}:` +
|
|
|
"%{y} <br>" +
|
|
|
`${this.chartData.zaixs}:` +
|
|
|
- "%{z} <br>",
|
|
|
+ "%{z} <extra></extra>",
|
|
|
};
|
|
|
return trace;
|
|
|
});
|
|
|
+ const yData = [...new Set(this.chartData.data[0].yData)]; // 获取机组编号
|
|
|
+ const ticktext = yData;
|
|
|
+ const tickvals = yData.map((_, index) => index + 1); // 让 tickvals 均匀分布
|
|
|
|
|
|
+ console.log(ticktext, "tickvals", tickvals);
|
|
|
const layout = {
|
|
|
title: {
|
|
|
text: this.chartData.data[0].title,
|
|
|
@@ -228,12 +216,13 @@ export default {
|
|
|
weight: "bold",
|
|
|
},
|
|
|
},
|
|
|
+
|
|
|
scene: {
|
|
|
xaxis: {
|
|
|
title: this.chartData.xaixs,
|
|
|
gridcolor: "rgb(255,255,255)",
|
|
|
tickcolor: "rgb(255,255,255)",
|
|
|
- backgroundcolor: "#e5ecf6",
|
|
|
+ backgroundcolor: "#CFD4DC",
|
|
|
showbackground: true,
|
|
|
linewidth: 2, // 轴线宽度
|
|
|
linecolor: "black", // 轴线颜色
|
|
|
@@ -244,12 +233,12 @@ export default {
|
|
|
},
|
|
|
yaxis: {
|
|
|
title: this.chartData.yaixs,
|
|
|
- tickvals: [...new Set(this.chartData.data[0].yData)],
|
|
|
- ticktext: [...new Set(this.chartData.data[0].yData)],
|
|
|
+ // tickvals: tickvals,
|
|
|
+ // ticktext: ticktext,
|
|
|
+ // range: [0.5, tickvals.length + 0.5], // 让刻度均匀排列
|
|
|
gridcolor: "rgb(255,255,255)",
|
|
|
tickcolor: "rgb(255,255,255)",
|
|
|
- fixedrange: true, // 防止缩放
|
|
|
- backgroundcolor: "#e5ecf6",
|
|
|
+ backgroundcolor: "#CFD4DC",
|
|
|
showbackground: true,
|
|
|
linewidth: 2, // 轴线宽度
|
|
|
linecolor: "black", // 轴线颜色
|
|
|
@@ -261,7 +250,7 @@ export default {
|
|
|
title: this.chartData.zaixs,
|
|
|
gridcolor: "rgb(255,255,255)",
|
|
|
tickcolor: "rgb(255,255,255)",
|
|
|
- backgroundcolor: "#e5ecf6",
|
|
|
+ backgroundcolor: "#CFD4DC",
|
|
|
showbackground: true,
|
|
|
fixedrange: true, // 防止缩放
|
|
|
linewidth: 2, // 轴线宽度
|
|
|
@@ -271,8 +260,8 @@ export default {
|
|
|
tickcolor: "black",
|
|
|
},
|
|
|
aspectratio: {
|
|
|
- x: 3,
|
|
|
- y: 1.5,
|
|
|
+ x: 2.3,
|
|
|
+ y: 1.8,
|
|
|
z: 1,
|
|
|
},
|
|
|
plot_bgcolor: "#e5ecf6",
|
|
|
@@ -280,22 +269,22 @@ export default {
|
|
|
bgcolor: "#e5ecf6", // 设置背景颜色
|
|
|
camera: {
|
|
|
up: {
|
|
|
- x: -0.0014269369124665849,
|
|
|
- y: 0.0012146694366401958,
|
|
|
- z: 0.9999982442130624,
|
|
|
+ x: 0.1404902084609593,
|
|
|
+ y: 0.21761427477626,
|
|
|
+ z: 0.9658708654577998,
|
|
|
},
|
|
|
center: {
|
|
|
- x: -0.4418147101642839,
|
|
|
- y: 0.11636199495350043,
|
|
|
- z: -0.4133154056555356,
|
|
|
+ x: -0.1006727339672774,
|
|
|
+ y: 0.0754471798006855,
|
|
|
+ z: 0.005741722270889481,
|
|
|
},
|
|
|
eye: {
|
|
|
- x: -2.482948029595208,
|
|
|
- y: -2.2792871251589983,
|
|
|
- z: 1.0941053354561574,
|
|
|
+ x: -2.10865062403837,
|
|
|
+ y: -2.6322931505097884,
|
|
|
+ z: 0.9078749284640724,
|
|
|
},
|
|
|
projection: {
|
|
|
- type: "perspective",
|
|
|
+ type: "orthographic",
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
@@ -383,27 +372,27 @@ export default {
|
|
|
Plotly.relayout(`plotly-3d-chart-` + this.index, {
|
|
|
"scene.camera": {
|
|
|
up: {
|
|
|
- x: -0.0014269369124665849,
|
|
|
- y: 0.0012146694366401958,
|
|
|
- z: 0.9999982442130624,
|
|
|
+ x: 0,
|
|
|
+ y: 0,
|
|
|
+ z: 1,
|
|
|
},
|
|
|
center: {
|
|
|
- x: -0.4418147101642839,
|
|
|
- y: 0.11636199495350043,
|
|
|
- z: -0.4133154056555356,
|
|
|
+ x: 0,
|
|
|
+ y: 0,
|
|
|
+ z: 0,
|
|
|
},
|
|
|
eye: {
|
|
|
- x: -2.482948029595208,
|
|
|
- y: -2.2792871251589983,
|
|
|
- z: 1.0941053354561574,
|
|
|
+ x: -1.9411806339437676,
|
|
|
+ y: -1.0688695891896567,
|
|
|
+ z: 0.47888991188707036,
|
|
|
},
|
|
|
projection: {
|
|
|
- type: "perspective",
|
|
|
+ type: "orthographic",
|
|
|
},
|
|
|
},
|
|
|
"scene.aspectratio": {
|
|
|
- x: 3,
|
|
|
- y: 1.5,
|
|
|
+ x: 2.2,
|
|
|
+ y: 1.8,
|
|
|
z: 1,
|
|
|
},
|
|
|
});
|
liujiejie
