您可以使用 echarts-gl 来实现 3D 圆柱。具体实现方法如下:
1. 引入 echarts 和 echarts-gl 库:
```html
<script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script>
```
2. 创建一个容器:
```html
<div id="container" style="width: 600px;height:400px;"></div>
```
3. 初始化 echarts 实例:
```javascript
var myChart = echarts.init(document.getElementById('container'));
```
4. 配置 echarts 选项:
```javascript
option = {
grid3D: {},
xAxis3D: {
type: 'category',
data: ['A', 'B', 'C', 'D', 'E', 'F']
},
yAxis3D: {},
zAxis3D: {},
series: [{
type: 'bar3D',
data: [
[0, 0, 0, 5],
[1, 0, 0, 1],
[2, 0,0, 2],
[3, 0, 0, 3],
[4, 0, 0,4],
[5, 0, 0, 5]
],
shading: 'lambert',
label: {
textStyle: {
fontSize: 16,
borderWidth: 1
}
},
itemStyle: {
opacity: 0.8
}
}]
};
```
5. 将配置项设置到 echarts 实例中:
```javascript
myChart.setOption(option);
```