239Echarts - 3D 柱状图(Stacked Bar3D)

简介: 239Echarts - 3D 柱状图(Stacked Bar3D)
效果图

源代码
$.getScript('vendors/simplex.js').done(function () {
function generateData() {
    var data = [];
    var noise = new SimplexNoise(Math.random);
    for (var i = 0; i <= 10; i++) {
        for (var j = 0; j <= 10; j++) {
            var value = noise.noise2D(i / 5, j / 5);
            data.push([i, j, value * 2 + 4]);
        }
    }
    return data;
}
var series = [];
for (var i = 0; i < 10; i++) {
    series.push({
        type: 'bar3D',
        data: generateData(),
        stack: 'stack',
        shading: 'lambert',
        emphasis: {
            label: {
                show: false
            }
        }
    });
}
myChart.setOption({
    xAxis3D: {
        type: 'value'
    },
    yAxis3D: {
        type: 'value'
    },
    zAxis3D: {
        type: 'value'
    },
    grid3D: {
        viewControl: {
            // autoRotate: true
        },
        light: {
            main: {
                shadow: true,
                quality: 'ultra',
                intensity: 1.5
            }
        }
    },
    series: series
});
});
目录
相关文章
|
6月前
echarts 柱状图/折线图x轴坐标间隔
echarts 柱状图/折线图x轴坐标间隔
213 0
|
JSON 前端开发 数据格式
【前端统计图】echarts实现简单柱状图
【前端统计图】echarts实现简单柱状图
84 0
|
18天前
|
JSON JavaScript 前端开发
vue中使用echarts实现省市地图绘制,根据数据在地图上显示柱状图信息,增加涟漪特效动画效果
vue中使用echarts实现省市地图绘制,根据数据在地图上显示柱状图信息,增加涟漪特效动画效果
268 0
|
3月前
Echarts——饼图折线图柱状图相互转换
Echarts——饼图折线图柱状图相互转换
128 0
|
4月前
【详细流程】vue+Element UI项目中使用echarts绘制圆环图 折线图 饼图 柱状图
【详细流程】vue+Element UI项目中使用echarts绘制圆环图 折线图 饼图 柱状图
337 0
|
5月前
|
数据可视化 JavaScript 前端开发
使用 ECharts 绘制3D饼图,立体效果华丽渲染!
使用 ECharts 绘制3D饼图,立体效果华丽渲染!
|
5月前
|
JavaScript Apache 容器
如何使用ECharts制作一个简单的柱状图
如何使用ECharts制作一个简单的柱状图
70 0
|
6月前
|
JSON 程序员 定位技术
使用echarts+echarts-gl绘制3d地图,实现地图轮播效果
记录一下大屏开发中使用到的echarts-gl 大屏的页面根据需求前前后后改了几个版本了,地图的样式也改了又改 这里记录一下,因为echarts属性用到的比较多也比较杂,防止以后需要用到忘记了
|
12月前
echarts设置柱状图柱状图粗细大小
echarts设置柱状图柱状图粗细大小
218 1
|
12月前
|
BI
echarts柱状图实现颜色渐变效果
echarts柱状图实现颜色渐变效果
213 1