echart实现立体的柱状图

最新推荐文章于 2025-07-03 14:30:17 发布

Ciao_Traveler

最新推荐文章于 2025-07-03 14:30:17 发布

阅读量3k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： echarts的使用

本文链接：https://blog.csdn.net/weixin_44202904/article/details/112169317

效果图：在这里插入图片描述
代码：

var xData3 = ["6", "7", "8", "9","10","11"];
    var data3 = [1209, 1715, 2408, 1308, 1308, 1145];
    var data5 = [4000, 4000, 4000, 4000, 4000,4000];
    var option = {
   
   
      tooltip: {
   
   
        trigger: "axis",
        show: false,
      },
      grid: {
   
   
        left: 50,
        bottom: 25,
        top: 30,
        right: 40,
      },
      xAxis: {
   
   
        data: xData3,
        name: "(月)",
        // 坐标轴刻度相关设置
        axisTick: {
   
   
          show: false,
        },
        // 坐标轴线的相关设置
        axisLine: {
   
   
          show: true,
          lineStyle: {
   
   
            color: "#414965",
          },
        },
        // 坐标轴刻度标签的相关设置
        axisLabel: {
   
   
          // 可以设置成 0 强制显示所有标签
          interval: 0,