依赖 echarts需要5.1.2以上
npm install echarts npm install echarts-gl
引入
import * as echarts from 'echarts'; import "echarts-gl";
使用
</div>
<div class="chart-table">
<div class="chart">
<div ref="chart" :style="{ height: height, width: width }" />
</div>
</div>
initChart() {
// 标记点大小
let symbolSize = 10;
let optionData = this.scorearr;
this.chart = echarts.init(this.$refs.chart);
let options = {
trigger: "axis",
tooltip: {
formatter:function(params){
return `名字1: ${params.data[0]}<br />
名字2: ${params.data[1]}<br />
}
},
axisPointer: {
type: "cross",
},
grid3D: {},
xAxis3D: {
name: "名字1",
nameTextStyle: {
fontSize: 14,
},
type: "value",
scale: true,
},
yAxis3D: {
name: "名字2",
nameTextStyle: {
fontSize: 14,
},
type: "value",
scale: true,
},
zAxis3D: {
name: "名字3",
nameTextStyle: {
fontSize: 14,
},
type: "value",
scale: true,
},
dataset: {
source: optionData,
},
series: [
{
name: "图名",
type: "scatter3D",
symbolSize: symbolSize,
encode: {
x: "x",
y: "y",
z: "z",
tooltip: [0, 1, 2, 3, 4, 5],
},
emphasis: {
itemStyle: {
color: "red",
},
label: {
show: false,
},
}
},
],
};
this.chart.setOption(options);
},
resetChart() {
this.$nextTick(() => {
echarts.init(this.$refs.chart).resize();
});
},
数据格式
[[1575,1575,1575,0,0,0],[1575,1575,1680,0,0.88,0.88],[1575,1575,1785,0,1.7,1.7]]
标签：scale,name,三维,chart,散点图,type,echarts,1575 From： https://www.cnblogs.com/jqynr/p/17097865.html