echarts显示三维柱状图

要在 Echarts 中显示三维柱状图，你可以使用 Echarts 提供的 3D 图表功能。以下是一个简单的示例代码，演示如何使用 Echarts 创建一个三维柱状图：

// 引入 Echarts
import echarts from 'echarts';

// 初始化 Echarts 实例
const myChart = echarts.init(document.getElementById('chartContainer'));

// 配置数据
const data = [
  [0, 0, 5],
  [1, 0, 2],
  [2, 0, 8],
  [0, 1, 1],
  [1, 1, 5],
  [2, 1, 3],
  // 继续添加数据...
];

// 配置坐标轴
const xAxisData = ['Category A', 'Category B', 'Category C'];
const yAxisData = ['Subcategory X', 'Subcategory Y'];
const zAxisData = ['Value'];

// 配置柱状图系列
const series = [];
data.forEach(item => {
  series.push({
    type: 'bar3D',
    data: [item],
    shading: 'lambert', // 光照模型，默认为 'lambert'，可选值：'lambert', 'realistic'
    label: {
      show: true,
      formatter: '{@[2]}' // 标签显示数据的第三个值
    },
    itemStyle: {
      opacity: 0.8
    }
  });
});

// 配置图表
const option = {
  xAxis3D: {
    type: 'category',
    data: xAxisData
  },
  yAxis3D: {
    type: 'category',
    data: yAxisData
  },
  zAxis3D: {
    type: 'value',
    data: zAxisData
  },
  grid3D: {
    boxWidth: 200,
    boxDepth: 80,
    viewControl: {
      // 使用鼠标进行旋转、缩放等操作
      projection: 'orthographic' // 可选值：'perspective', 'orthographic'
    }
  },
  series: series
};

// 渲染图表
myChart.setOption(option);

请注意，以上示例仅为演示目的，数据和配置可能需要根据你的实际需求进行调整。确保在 HTML 页面中有一个具有 id "chartContainer" 的容器元素，用于渲染图表。

希望这可以帮助你创建一个三维柱状图！如有任何疑问，请随时提问。