echarts 实现 3d 柱状图

已于 2022-10-12 09:52:50 修改
阅读量5.3k 收藏 24
点赞数 4
文章标签： echarts javascript vue.js
于 2022-07-28 20:39:40 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_38992765/article/details/126043321
版权

echarts 实现 3d 柱状图

柱状图

实现要求

  1. 能够调整大小
  2. 实现3d效果，可以改变颜色

前置环境

vue: ^3.1.2
echarts: ^5.3.3
lodash: ^4.17.21

效果

在这里插入图片描述
调整大小和颜色

在这里插入图片描述

代码

baseCharts.vue

<template>
  <div
    id="baseBarCharts"
    ref="echartsRef"
  ></div>
</template>
<script>
import { onMounted, ref } from "vue"
import * as echarts from 'echarts'
import _ from 'lodash'
export default {
  name: "barCharts",
  setup () {
    let baseEcharts = null
    let echartsRef = ref(null)
    let linearArr = [
      "#0079e4 ",
      "#000af5 ",
      "#36c9ff ",
      "#003efa",
      "#0099e4",
      "#4a9df7",
      "rgba(0, 31, 117, 0.3)",
      "rgba(0, 153, 228, 0.3)",
    ]
    function threeDimensionalLine (offsetX = 20, sliderWidth = 8, offsetTick = 14) {
      // 绘制左侧面
      const CubeLeft = echarts.graphic.extendShape({
        shape: {
          x: 0,
          y: 0,
        },
        buildPath: function (ctx, shape) {
          // 会canvas的应该都能看得懂，shape是从custom传入的
          const xAxisPoint = shape.xAxisPoint
          const c0 = [shape.x - offsetTick, shape.y]
          const c1 = [shape.x - offsetTick + offsetX, shape.y]
          const c2 = [xAxisPoint[0] - offsetTick + offsetX, xAxisPoint[1]]
          const c3 = [xAxisPoint[0] - offsetTick, xAxisPoint[1]]
          ctx
            .moveTo(c0[0], c0[1])
            .lineTo(c1[0], c1[1])
            .lineTo(c2[0], c2[1])
            .lineTo(c3[0], c3[1])
            .closePath()
        },
      })
      // 绘制右侧面
      const CubeRight = echarts.graphic.extendShape({
        shape: {
          x: 0,
          y: 0,
        },
        buildPath: function (ctx, shape) {
          const xAxisPoint = shape.xAxisPoint
          const c1 = [shape.x - offsetTick + offsetX, shape.y]
          const c2 = [shape.x - offsetTick + offsetX + sliderWidth, shape.y - sliderWidth]
          const c3 = [
            xAxisPoint[0] - offsetTick + offsetX + sliderWidth,
            xAxisPoint[1] - sliderWidth + 4,
          ]
          const c4 = [shape.x - offsetTick + offsetX, xAxisPoint[1]]
          ctx
            .moveTo(c1[0], c1[1])
            .lineTo(c2[0], c2[1])
            .lineTo(c3[0], c3[1])
            .lineTo(c4[0], c4[1])
            .closePath()
        },
      })
      // 绘制顶面
      const CubeTop = echarts.graphic.extendShape({
        shape: {
          x: 0,
          y: 0,
        },
        buildPath: function (ctx, shape) {
          const c1 = [shape.x - offsetTick, shape.y]
          const c2 = [shape.x - offsetTick + offsetX, shape.y] // 右点
          const c3 = [shape.x - offsetTick + offsetX + sliderWidth, shape.y - sliderWidth]
          const c4 = [shape.x - offsetTick + sliderWidth, shape.y - sliderWidth]
          ctx
            .moveTo(c1[0], c1[1])
            .lineTo(c2[0], c2[1])
            .lineTo(c3[0], c3[1])
            .lineTo(c4[0], c4[1])
            .lineTo(c1[0], c1[1])
            .closePath()
        },
      })

      const CubeBottom = echarts.graphic.extendShape({
        shape: {
          x: 0,
          y: 0,
        },
        buildPath: function (ctx, shape) {
          const xAxisPoint = shape.xAxisPoint
          const c1 = [xAxisPoint[0] - offsetTick, xAxisPoint[1]]
          const c2 = [xAxisPoint[0] - offsetTick, xAxisPoint[1] + 6] // 右点
          const c3 = [xAxisPoint[0] - offsetTick + offsetX + sliderWidth, xAxisPoint[1] + 6]
          const c4 = [xAxisPoint[0] - offsetTick + offsetX + sliderWidth, xAxisPoint[1] - 6]
          const c5 = [xAxisPoint[0] - offsetTick + offsetX, xAxisPoint[1]]
          ctx
            .moveTo(c1[0], c1[1])
            .lineTo(c2[0], c2[1])
            .lineTo(c3[0], c3[1])
            .lineTo(c4[0], c4[1])
            .lineTo(c5[0], c5[1])
            .lineTo(c1[0], c1[1])
            .closePath()
        },
      })
      // 注册三个面图形
      echarts.graphic.registerShape("CubeLeft", CubeLeft)
      echarts.graphic.registerShape("CubeRight", CubeRight)
      echarts.graphic.registerShape("CubeTop", CubeTop)
      echarts.graphic.registerShape("CubeBottom", CubeBottom)
    }
    let defalutOptions = ref({
      textStyle: {
        fontFamily: "PingFang",
      },
      grid: {
        top: "12%",
        left: "1%",
        right: "2%",
        bottom: "10%",
        containLabel: true,
      },
      xAxis: {
        type: "category",
        data: [],
        axisLine: {
          lineStyle: {
            color: "#fff",
          },
        },
        axisTick: {
          alignWithLabel: true,
        },
      },
      yAxis: {
        type: "value",
        axisLine: {
          show: true,
          lineStyle: {
            color: "#fff",
          },
        },
        splitLine: {
          lineStyle: {
            color: "#3a79c2",
          },
        },
      },
      tooltip: {
        show: true,
        position: "bottom",
        backgroundColor: "#fff",
        textStyle: {
          color: "#000",
          //   fontStyle: "PingFang",
          fontSize: 12,
          //   fontWeight: "normal",
          lineHeight: 24,
        },
      },
      series: [
        {
          type: "custom",
          renderItem: (params, api) => {
            const location = api.coord([api.value(0), api.value(1)])
            return {
              type: "group",
              children: [
                {
                  type: "CubeLeft",
                  shape: {
                    api,
                    xValue: api.value(0),
                    yValue: api.value(1),
                    x: location[0],
                    y: location[1],
                    xAxisPoint: api.coord([api.value(0), 0]),
                  },
                  style: {
                    fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                      {
                        offset: 0,
                        color: linearArr[0],
                      },
                      {
                        offset: 1,
                        color: linearArr[1],
                      },
                    ]),
                  },
                },
                {
                  type: "CubeRight",
                  shape: {
                    api,
                    xValue: api.value(0),
                    yValue: api.value(1),
                    x: location[0],
                    y: location[1],
                    xAxisPoint: api.coord([api.value(0), 0]),
                  },
                  style: {
                    fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                      {
                        offset: 0,
                        color: linearArr[2],
                      },
                      {
                        offset: 1,
                        color: linearArr[3],
                      },
                    ]),
                  },
                },
                {
                  type: "CubeTop",
                  shape: {
                    api,
                    xValue: api.value(0),
                    yValue: api.value(1),
                    x: location[0],
                    y: location[1],
                    xAxisPoint: api.coord([api.value(0), 0]),
                  },
                  style: {
                    fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                      {
                        offset: 0,
                        color: linearArr[4],
                      },
                      {
                        offset: 1,
                        color: linearArr[5],
                      },
                    ]),
                  },
                },
                {
                  type: "CubeBottom",
                  shape: {
                    api,
                    xValue: api.value(0),
                    yValue: api.value(1),
                    x: location[0],
                    y: location[1],
                    xAxisPoint: api.coord([api.value(0), 0]),
                  },
                  style: {
                    fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                      {
                        offset: 0,
                        color: linearArr[6],
                      },
                      {
                        offset: 1,
                        color: linearArr[7],
                      },
                    ]),
                  },
                },
              ],
            }
          },
          data: [],
        },

        {
          type: "bar",
          label: {
            normal: {
              show: true,
              position: "top",
              fontSize: 12,
              color: "#fff",
            },
          },
          itemStyle: {
            color: "transparent",
          },
          data: [],
        },
      ],
    })
    onMounted(() => {
      baseEcharts = echarts.init(echartsRef.value)
      window.addEventListener(
        "resize",
        _.debounce(() => {
          baseEcharts.resize()
        }, 150)
      )
    })
    function setOptions (options, linerArrOptions, barWidth = {}) {
      linearArr = linerArrOptions
      if (barWidth.offsetX && barWidth.sliderWidth) {
        threeDimensionalLine(
          barWidth.offsetX,
          barWidth.sliderWidth,
          (barWidth.offsetX + barWidth.sliderWidth) / 2
        )
      } else {
        threeDimensionalLine()
      }
      baseEcharts.setOption(options, true)
    }
    return {
      echartsRef,
      setOptions,
      defalutOptions,
    }
  },
}
</script>
<style lang="scss" scoped>
#baseBarCharts {
  width: 100%;
  height: 100%;
}
</style>

使用

<template>
  <div style="width:600px;height:500px;background-color: #000;">
    <base-charts ref="baseChartsRef"></base-charts>
  </div>
  <br />
  <div style="width:600px;height:500px;background-color: #000;">
    <base-charts ref="baseChartsRefPlus"></base-charts>
  </div>
</template>

<script>
import baseCharts from "@/components/baseCharts.vue";
import { onMounted, ref } from 'vue';
export default {
  name: "basecharts",
  components: {
    baseCharts,
  },
  setup () {
    const baseChartsRef = ref(null)
    const baseChartsRefPlus = ref(null)
    onMounted(() => {
      let { defalutOptions, setOptions } = baseChartsRef.value
      defalutOptions.xAxis.data = ['深圳', '广州', '汕头']
      defalutOptions.series[0].data = [100, 200, 300]
      defalutOptions.series[1].data = [100, 200, 300]
      setOptions(defalutOptions, [
        "#4582ff", // 正面颜色渐变
        "#582ee8", // 正面颜色渐变
        "#638afa", // 侧面颜色渐变
        "#6757f1", // 侧面颜色渐变
        "#4c70fc", // 顶部颜色渐变
        "#4582ff", // 顶部颜色渐变
        "rgba(90,75,246,0.3)", // 底部颜色渐变
        "rgba(0,31,117,0.3)" // 底部颜色渐变
      ]);
      // 大小可调整
      baseChartsRefPlus.value.defalutOptions.xAxis.data = ['深圳', '广州', '汕头']
      baseChartsRefPlus.value.defalutOptions.series[0].data = [100, 200, 300]
      baseChartsRefPlus.value.defalutOptions.series[0].data = [100, 200, 300]
      baseChartsRefPlus.value.setOptions(baseChartsRefPlus.value.defalutOptions, [
        "#0079e4", // 正面颜色渐变
        "#000af5", // 正面颜色渐变
        "#36c9ff", // 侧面颜色渐变
        "#003efa", // 侧面颜色渐变
        "#0099e4", // 顶部颜色渐变
        "#4a9df7", // 顶部颜色渐变
        "rgba(0,31,117,0.3)", // 底部颜色渐变
        "rgba(0,153,228,0.3)" // 底部颜色渐变
      ], { offsetX: 36, sliderWidth: 16 }) // 正面宽度 ， 侧面宽度

    })
    return {
      baseChartsRef,
      baseChartsRefPlus
    };
  },
};
</script>

<style scoped>
.schart-box {
  display: inline-block;
  margin: 20px;
}
.schart {
  width: 600px;
  height: 400px;
}
.content-title {
  clear: both;
  font-weight: 400;
  line-height: 50px;
  margin: 10px 0;
  font-size: 22px;
  color: #1f2f3d;
}
</style>

10.12 更新

横行柱状图

效果

在这里插入图片描述

代码

<template>
  <div id="charts" ref="echartsRef"></div>
</template>
<script>
import { onMounted, ref } from "vue"

export default {
  name: "baseLine",
  props: {
    isneedPercent: {
      type: Boolean,
      default: false,
    },
  },
  setup(props) {
    let baseEcharts = null
    let echartsRef = ref(null)
    let linearArr = [
      "#f7763f",
      "#fa2a31",
      "#ff9d61",
      "#fa2a31",
      "#ff9d61",
      "rgba(247,105,109,0.9)",
      "#fa2a31",
      "#ff9d61",
    ]
    let defalutOptions = ref({
      textStyle: {
        fontFamily: "PingFang",
        fontSize: 16,
      },
      tooltip: {
        trigger: "item",
        valueFormatter: value => (props.isneedPercent ? value + "%" : value),
      },
      grid: {
        top: "2%",
        left: "20%",
        bottom: "10%",
      },
      xAxis: {
        axisTick: {
          show: false,
        },
        axisLine: {
          show: true,
        },
        splitLine: {
          show: false,
        },
        axisLabel: {
          interval: 0,
          textStyle: {
            color: "#fff",
            fontSize: 14,
          },
          formatter: props.isneedPercent ? "{value}%" : "{value}",
        },
      },
      yAxis: {
        data: [],
        splitLine: {
          show: false,
        },
        axisTick: {
          show: true,
        },
        axisLine: {
          show: true,
        },
        axisLabel: {
          textStyle: {
            color: "#fff",
            fontSize: 12,
            padding: [0, 5, 0, 0],
          },
        },
      },
      series: [
        // 最左边顶部
        {
          name: "",
          type: "pictorialBar",
          symbolSize: [5, 20],
          symbolOffset: [-2, 0],
          z: 12,
          itemStyle: {
            opacity: 1,
            color: linearArr[0],
          },
          data: [1, 1, 1, 1, 1],
          tooltip: {
            show: false,
          },
        },
        {
          name: "2020",
          type: "bar",
          barWidth: 20,
          barGap: "-100%",
          itemStyle: {
            //lenged文本
            opacity: 1,
            color: new echarts.graphic.LinearGradient(
              0,
              0,
              0,
              1,
              [
                {
                  offset: 0,
                  color: linearArr[1], // 0% 处的颜色
                },
                {
                  offset: 1,
                  color: linearArr[2], // 100% 处的颜色
                },
              ],
              false
            ),
          },
          label: {
            formatter: props.isneedPercent ? "{c} %" : "{c}",
          },
          data: [],
        },
        {
          type: "bar",
          barWidth: 20,
          barGap: "-100%",
          itemStyle: {
            color: "transparent",
          },
          label: {
            formatter: props.isneedPercent ? "{c} %" : "{c}",
          },
          data: [],
        },
        {
          name: "", //头部
          type: "pictorialBar",
          symbolSize: [5, 20],
          symbolOffset: [2, 0],
          z: 12,
          symbolPosition: "end",
          itemStyle: {
            color: new echarts.graphic.LinearGradient(
              0,
              0,
              0,
              1,
              [
                {
                  offset: 0,
                  color: linearArr[3], // 0% 处的颜色
                },
                {
                  offset: 1,
                  color: linearArr[4], // 100% 处的颜色
                },
              ],
              false
            ),
            opacity: 0.2,
          },
          label: {
            formatter: props.isneedPercent ? "{c} %" : "{c}",
          },
          data: [100, 100, 100, 100, 100, 100],
          tooltip: {
            show: false,
          },
        },
        {
          name: "",
          type: "pictorialBar",
          symbolSize: [5, 20],
          symbolOffset: [2, 0],
          z: 12,
          itemStyle: {
            opacity: 1,
            color: linearArr[5],
          },
          symbolPosition: "end",
          data: [],
          tooltip: {
            show: false,
          },
          label: {
            show: true,
            position: "right",
            fontSize: 12,
            color: "#fff",
            formatter: props.isneedPercent ? "{c} %" : "{c}",
          },
        },
        {
          name: "all",
          type: "bar",
          barWidth: 20,
          barGap: "-100%",
          z: 0,
          itemStyle: {
            color: new echarts.graphic.LinearGradient(
              0,
              0,
              0,
              1,
              [
                {
                  offset: 0,
                  color: linearArr[6], // 0% 处的颜色
                },
                {
                  offset: 1,
                  color: linearArr[7], // 100% 处的颜色
                },
              ],
              false
            ),
            opacity: 0.2,
          },
          label: {
            formatter: props.isneedPercent ? "{c} %" : "{c}",
          },
          data: [100, 100, 100, 100, 100, 100],
          tooltip: {
            show: false,
          },
        },
      ],
    })

    onMounted(() => {
      baseEcharts = echarts.init(echartsRef.value)
      window.addEventListener(
        "resize",
        _.debounce(() => {
          baseEcharts.resize()
        }, 150)
      )
      // baseEcharts.setOption(defalutOptions.value)
    })
    function setOptions(options, colors) {
      options.series[0].itemStyle.color = colors[0]
      options.series[1].itemStyle.color.colorStops = [
        { offset: 0, color: colors[1] },
        { offset: 1, color: colors[2] },
      ]
      options.series[3].itemStyle.color.colorStops = [
        { offset: 0, color: colors[3] },
        { offset: 1, color: colors[4] },
      ]
      options.series[4].itemStyle.color = colors[5]
      options.series[5].itemStyle.color.colorStops = [
        { offset: 0, color: colors[6] },
        { offset: 1, color: colors[7] },
      ]
      baseEcharts.setOption(options, true)
    }
    return {
      echartsRef,
      setOptions,
      defalutOptions,
    }
  },
}
</script>
<style lang="scss" scoped>
#charts {
  width: 100%;
  height: 100%;
}
</style>

使用

<template>
  <div>
    <pipeBar ref="pipeBarRef" style="width: 500px; height: 400px"></pipeBar>
  </div>
</template>
<script>
import { onMounted, ref } from "vue"
import pipeBar from "@/components/echarts/pipeBar"

export default {
  setup() {
    let pipeBarRef = ref(null)
    onMounted(() => {
      let { setOptions, defalutOptions } = pipeBarRef.value
      defalutOptions.series[1].data =
        defalutOptions.series[2].data =
        defalutOptions.series[4].data =
          [20, 60, 10]
      defalutOptions.series[3].data = defalutOptions.series[5].data = [100, 100, 100]
      defalutOptions.yAxis.data = ["本科及以上", "大专", "大专及一下"]
      setOptions(defalutOptions, [
        "#f7763f", // 颜色值
        "#fa2a31",// 颜色值
        "#ff9d61",// 颜色值
        "#fa2a31",// 颜色值
        "#ff9d61",// 颜色值
        "rgba(247,105,109,0.9)",// 颜色值
        "#fa2a31",// 颜色值
        "#ff9d61",// 颜色值
      ])
    })
    return {
      pipeBarRef,
    }
  },
  components: {
    pipeBar,
  },
}
</script>
<style lang="scss"></style>
一个抱抱一首歌
关注
  • 4
    点赞
  • 踩
  • 24
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
vue+echarts——实现3D地图+3D柱状图 效果—
fksdskjfzxklzk的博客
04-27 434
我这边是存储到当前文件夹中了。
极致呈现系列之：ECharts3D柱状图的维度穿梭
九仞山的专栏
06-30 1181
ECharts3D柱状图的使用
echarts的图表立体感——实现立体柱状图和立体饼图的详细教程
热门推荐
杜永康的博客
11-01 1万+
准备HTML结构和容器，用于容纳图表的展示。初始化Echarts实例，并将之前创建的容器关联起来。配置图表所需的数据，包括x轴和对应的柱状图的高度值（对于立体柱状图）或每个扇区的名称和对应的数值（对于立体饼图）。配置图表的选项，包括样式、颜色和其他属性。渲染图表并呈现在页面中，通过调用Echarts实例的setOption方法将之前配置好的选项应用到图表中，并通过调用Echarts实例的render方法将图表渲染出来。
echarts绘制三维柱状图
最新发布
pengbr的博客
06-02 1258
echarts ECharts 是一个使用 JavaScript 实现的开源可视化库，主要用于数据的可视化展示。ECharts 支持丰富的图表类型，如折线图、柱状图、饼图、地图、K线图等，可以满足不同类型数据的展示需求。 文档地址：echarts 本次所绘制三维柱状图主要使用的是示例源代码，在此基础上做了些修改。 引入CDN 使用echarts需要导入echarts和echarts-gl。 免费的CDN服务可访问网址：Staticfile CDN <!-- 引入 ECharts 文件 --> &
echarts 3d柱状图
徐___L
02-16 3357
echarts 3d柱状图
echarts 3D柱状图
nbclasszj的博客
10-12 1917
echarts 3D柱状图
echarts 3D柱图
qq_34169240的博客
02-08 608
getEcharts3DBar (xAxisData, data, colorType) { var colorArr = []; if (colorType == '01') { colorArr = ["#2886c6", "#50bfda", "#89e3ec"]; } else if (colorType == '02') { colorArr = ["#28c1c6", "#50dac0", "#87e8c7"];...
echart实现3D柱状图效果
01-31
echart.js实现动态3D效果，酷炫的效果，值得研究看看哈
echarts堆叠柱状图(顶端圆角）.rar
07-30
echarts实现堆叠柱状图(顶端圆角），并统计总数，自定义柱体颜色
使用echarts 实现3D地球
08-13
**使用ECharts实现3D地球**\n\nECharts是一个基于JavaScript的数据可视化库，它提供了丰富的图表类型，包括柱状图、折线图、饼图等，并且支持自定义交互和动画效果。在ECharts中，3D地球的实现是通过其强大的3D渲染...
Echarts实现的地图关联柱状图
08-19
Echarts实现的地图关联柱状图
echarts的3D柱状图
zhuxiaolong1234的博客
02-27 537
【代码】echarts的3D柱状图。
记录下echarts立体柱形图实现的几种方式
qq_35438952的博客
03-24 2600
ecarts立体柱形图实现方法
vue echarts实现3D效果柱状图
古月水告的博客
05-17 4082
在vue2项目里面，研究了哈，这里记录下eacharts 实现3D效果柱状图 在main.js引入eacharts import echarts from 'echarts' Vue.prototype.$echarts = echarts <template> <scale-card title="月度故障业务平均恢复时长" iconname="el-icon-data-analysis"> <div class="chart-container">
echarts画立体圆柱形图表
裤兜的博客
11-15 2864
option = { xAxis: { type: 'category', data: ['A区', 'B区', 'C区', 'D区', 'E区', 'F区', 'G区'], axisLine: { lineStyle: { color: '#2063A8' } }, axisTick: { show: false }, axisLabel: { color: '#EFF2F9',
Vue+Echarts实现3D效果柱状图（仅使用Echarts实现）
书山有路勤为径，学海无涯苦作舟
04-23 1336
实现这种效果主要是: ECharts中的 series 属性,通过两种不同类型的图表组合而成. 其中里面的柱体渐变色是通过。ECharts中内置的渐变色生成器 echarts.graphic.LinearGradient。type: “pictorialBar”, // pictorialBar(象形柱图)echarts使用的版本： “vue-echarts”: “^6.2.3”,type: “bar”, // bar(柱状图)可以用来设置渐变色.
echarts 实现3D立体柱状图示例
SM_Cute的博客
11-20 636
echarts 实现3D立体柱状图示例
echarts实现3D柱状图
07-27
要实现echarts的3D柱状图，可以参考以下步骤： 1. 首先，你可以查看echarts官方网站，了解echarts自定义图形的详细用法。\[1\] 2. 参考你提供的案例，可以创建左右两个面，也就是两个柱子。为了形成一点对比，可以稍微调整左右两个面的颜色。同时，可以使用"type: 'pictorialBar'"来实现底部和顶部的效果。\[2\] 3. 在代码中，可以设置柱状图的柱宽（barWidth）为一个固定值，例如30。如果改动这个值导致柱子形状变形，可以调整series中每一个对象的symbolOffset的值。\[3\] 4. 对于双柱状图，可以在series数组中定义多个元素，前几个元素表示"本期"柱状图，后几个元素表示"同期"柱状图。每个柱子都由上中下三部分组成，因此需要定义多个series元素来表示柱子的主体部分、底部和顶部。为了达到整体性的效果，每个柱状图的三部分颜色需要统一。\[3\] 通过以上步骤，你可以实现echarts的3D柱状图。希望对你有帮助！ #### 引用[.reference_title] - *1* [echarts实现3d柱状图的两种方式](https://blog.csdn.net/weixin_69773376/article/details/128199545)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [echarts 3d柱状图](https://blog.csdn.net/xuyanl/article/details/128011860)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [echarts实现3D效果柱状图](https://blog.csdn.net/dqfkkll/article/details/120287486)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值