echarts 简单3D柱状图
原创
代码示例
- 需要先下载js脚本
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>3D柱状图</title>
<script src="./static/echarts.min.js"></script>
<script src="./static/echarts-gl.min.js"></script>
</head>
<body>
<div id="3d-bar" style="width: 1000px; height: 800px;"></div>
<script>
const chart = echarts.init(document.getElementById('3d-bar'));
chart.setOption({
xAxis3D: { data: ['A', 'B', 'C'] },
yAxis3D: { type: 'value' },
zAxis3D: { type: 'value' },
grid3D: {},
series: [{
type: 'bar3D',
data: [
[0, 10, 100],
[1, 20, 150],
[2, 30, 120]
]
}]
});
</script>
</body>
</html>结果展示
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号