256Echarts - 3D 曲面(Surface Wave)

简介: 256Echarts - 3D 曲面(Surface Wave)
效果图

源代码
option = {
    tooltip: {},
    backgroundColor: '#fff',
    visualMap: {
        show: false,
        dimension: 2,
        min: -1,
        max: 1,
        inRange: {
            color: ['#313695', '#4575b4', '#74add1', '#abd9e9', '#e0f3f8', '#ffffbf', '#fee090', '#fdae61', '#f46d43', '#d73027', '#a50026']
        }
    },
    xAxis3D: {
        type: 'value'
    },
    yAxis3D: {
        type: 'value'
    },
    zAxis3D: {
        type: 'value',
        max: 1,
        splitNumber: 2
    },
    grid3D: {
        viewControl: {
            // projection: 'orthographic'
        },
        boxHeight: 40
    },
    series: [{
        type: 'surface',
        wireframe: {
            show: false
        },
        shading: 'color',
        equation: {
            x: {
                step: 0.05,
                min: -3,
                max: 3,
            },
            y: {
                step: 0.05,
                min: -3,
                max: 3,
            },
            z: function (x, y) {
                return Math.sin(x * x + y * y) * x / 3.14
            }
        }
    }]
}


目录
相关文章
263Echarts - 3D 折线图(三维折线图正交投影)
263Echarts - 3D 折线图(三维折线图正交投影)
146 0
|
6月前
|
数据可视化 JavaScript 前端开发
使用 ECharts 绘制3D饼图,立体效果华丽渲染!
使用 ECharts 绘制3D饼图,立体效果华丽渲染!
|
7月前
|
JSON 程序员 定位技术
使用echarts+echarts-gl绘制3d地图,实现地图轮播效果
记录一下大屏开发中使用到的echarts-gl 大屏的页面根据需求前前后后改了几个版本了,地图的样式也改了又改 这里记录一下,因为echarts属性用到的比较多也比较杂,防止以后需要用到忘记了
|
定位技术
257Echarts - 3D 地图(Buildings)
257Echarts - 3D 地图(Buildings)
72 1
262Echarts - 3D 路径图(Flights on Geo3D)
262Echarts - 3D 路径图(Flights on Geo3D)
94 0
261Echarts - 3D 路径图(Flights GL)
261Echarts - 3D 路径图(Flights GL)
78 0
260Echarts - 3D 路径图(Flights)
260Echarts - 3D 路径图(Flights)
64 0
259Echarts - 3D 路径图(Airline on Globe)
259Echarts - 3D 路径图(Airline on Globe)
49 0
|
定位技术
258Echarts - 3D 地图(Wood City)
258Echarts - 3D 地图(Wood City)
118 0
|
2月前
|
小程序 前端开发 JavaScript
微信小程序图表制作利器:ECharts组件的使用与技巧
微信小程序图表制作利器:ECharts组件的使用与技巧
86 1