echarts立體柱狀圖詳解

一、echarts立體柱狀圖怎麼做

echarts立體柱狀圖是一種3D效果的柱狀圖，通過z軸來增加第三個維度的視覺效果，使數據更加直觀、形象。使用echarts創建立體柱狀圖非常簡單，只需要在option中設置三維坐標系，並給柱子加上立體效果即可：

option = {
  xAxis3D: {
    type: 'category',
    data: ['一月', '二月', '三月', '四月', '五月', '六月'],
  },
  yAxis3D: {
    type: 'value',
  },
  zAxis3D: {
    type: 'category',
    data: ['A', 'B', 'C', 'D', 'E'],
  },
  grid3D: {
    boxWidth: 200,
    boxDepth: 80,
    viewControl: {
      // projection: 'orthographic',
      beta: 10,
      alpha: 25
    }
  },
  series: [{
    type: 'bar3D',
    data: [
      ['一月', 'A', 10],
      ['二月', 'A', 20],
      ['三月', 'A', 30],
      ['四月', 'A', 40],
      ['五月', 'A', 50],
      ['六月', 'A', 60],
      ['一月', 'B', 20],
      ['二月', 'B', 30],
      ['三月', 'B', 40],
      ['四月', 'B', 50],
      ['五月', 'B', 60],
      ['六月', 'B', 70],
      ['一月', 'C', 30],
      ['二月', 'C', 40],
      ['三月', 'C', 50],
      ['四月', 'C', 60],
      ['五月', 'C', 70],
      ['六月', 'C', 80],
      ['一月', 'D', 40],
      ['二月', 'D', 50],
      ['三月', 'D', 60],
      ['四月', 'D', 70],
      ['五月', 'D', 80],
      ['六月', 'D', 90],
      ['一月', 'E', 50],
      ['二月', 'E', 60],
      ['三月', 'E', 70],
      ['四月', 'E', 80],
      ['五月', 'E', 90],
      ['六月', 'E', 100]
    ],
    shading: 'lambert',

    label: {
      textStyle: {
        fontSize: 16,
        borderWidth: 1
      }
    },

    itemStyle: {
      opacity: 0.8
    }
  }]
};

其中，xAxis3D、yAxis3D、zAxis3D分別表示三個坐標軸，grid3D表示3D場景的大小和角度，series裡面的type為bar3D，表示是立體柱狀圖，data表示數據，shading表示圖形的著色效果，label表示圖形標籤文本樣式，itemStyle表示圖形樣式。

二、 echarts立體柱狀圖大小

echarts立體柱狀圖的大小可以通過boxWidth和boxDepth來控制，例如，在grid3D中設置boxWidth為100，boxDepth為50，可以使立體柱狀圖的大小變小：

option = {
  ...,
  grid3D: {
    boxWidth: 100,
    boxDepth: 50,
    ...
  },
  ...
};

三、立體柱狀圖怎麼做

立體柱狀圖可以通過多種方式來完成，除了使用echarts之外，WPS、Excel等辦公軟體也支持立體柱狀圖的繪製。以WPS為例，打開表格後，選擇需要製作立體柱狀圖的數據範圍，點擊「插入」-「圖表」-「3D圖」-「柱圖（垂直）」，即可繪製立體柱狀圖。

四、wps立體柱狀圖怎麼做

在WPS中，製作立體柱狀圖非常簡單，只需要按照以下步驟即可：

1. 選擇需要繪製立體柱狀圖的數據範圍；

2. 點擊「插入」-「圖表」-「3D圖」-「柱圖（垂直）」；

3. 在彈出的圖表編輯窗口中，對圖表進行進一步的設置和美化。

五、excel立體柱狀圖怎麼做

在Excel中，製作立體柱狀圖非常簡單，只需要按照以下步驟即可：

1. 選擇需要繪製立體柱狀圖的數據範圍；

2. 點擊「插入」-「柱形圖」-「立體柱形圖」；

3. 在彈出的圖表編輯窗口中，對圖表進行進一步的設置和美化。

六、echarts官網

echarts是百度團隊開源的一個數據可視化工具庫，提供了各種各樣的圖表類型和交互方式，非常適合做數據可視化和大屏展示。

echarts官網：https://echarts.apache.org/

七、echarts餅圖

echarts餅圖是一種常用的餅狀圖，通過扇形的大小比例來展現數據的佔比情況。使用echarts創建餅圖非常簡單，只需要在option中設置series的type為pie，然後給每個扇形賦值即可：

option = {
  ...,
  series: [{
    type: 'pie',
    data: [
      {value: 335, name: '直接訪問'},
      {value: 310, name: '郵件營銷'},
      {value: 234, name: '聯盟廣告'},
      {value: 135, name: '視頻廣告'},
      {value: 1548, name: '搜索引擎'}
    ]
  }]
};

八、echarts數據可視化

echarts提供了一系列常用的數據可視化工具，比如柱狀圖、餅圖、折線圖、雷達圖等，可以根據具體需要選擇適合的圖表類型。同時，echarts還支持與各種流行的前端框架和圖形庫（比如React、Vue、AntV等）進行快速集成，可以非常方便地將數據可視化作為Web應用或移動應用的一部分。

九、echarts雷達圖

echarts雷達圖是一種常用的多維數據展示圖表，通過虛實相間的線條和填充區域展現多個數據指標的大小關係。使用echarts創建雷達圖也非常簡單，只需要在option中設置radar的三個屬性即可：

option = {
  ...,
  radar: {
    indicator: [
      { name: '銷售', max: 6500},
      { name: '成本', max: 16000},
      { name: '利潤', max: 30000},
      { name: '市場份額', max: 38000},
      { name: '發展潛力', max: 52000}
    ]
  },
  series: [{
    type: 'radar',
    data : [
      {
        value : [4300, 10000, 28000, 35000, 50000],
        name : '預算分配（Allocated Budget）'
      },
      {
        value : [5000, 14000, 28000, 31000, 42000],
        name : '實際開銷（Actual Spending）'
      }
    ]
  }]
};

其中，indicator表示雷達圖的每個指標，series裡面的type為radar，data表示數據。

十、echarts中國地圖

echarts中國地圖是一種常用的地圖類型，通過色塊的顏色表示各地的數據指標大小。使用echarts創建中國地圖非常簡單，只需要在option中設置geo和series的屬性即可：

option = {
  ...,
  geo: {
    type: 'map',
    map: 'china'
  },
  series: [
    {
      type: 'map',
      map: 'china'
    }
  ]
};

其中，geo表示地理坐標系組件，type為map表示地圖的類型，map為地圖的名稱，series裡面的type為map，map表示地圖的名稱。