欢迎来到 ECharts 文档中心,这里提供了丰富的图表制作指南和示例。

快速开始

  1. 安装 ECharts:首先,您需要在项目中安装 ECharts。可以通过 npm 或 yarn 进行安装。

    npm install echarts --save
    # 或者
    yarn add echarts
    
  2. 引入 ECharts:在您的 HTML 文件中引入 ECharts。

    <script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
    
  3. 初始化图表:创建一个图表实例,并设置图表的配置项和数据。

    var myChart = echarts.init(document.getElementById('main'));
    
    var option = {
        title: {
            text: 'ECharts 入门示例'
        },
        tooltip: {},
        legend: {
            data:['销量']
        },
        xAxis: {
            data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
        },
        yAxis: {},
        series: [{
            name: '销量',
            type: 'bar',
            data: [5, 20, 36, 10, 10, 20]
        }]
    };
    
    myChart.setOption(option);
    
  4. 渲染图表:在 HTML 中添加一个容器元素,并为其设置 id

    <div id="main" style="width: 600px;height:400px;"></div>
    

图表类型

ECharts 支持多种图表类型,包括:

  • 柱状图
  • 折线图
  • 饼图
  • 散点图
  • 雷达图
  • K线图
  • 地图
  • 更多...

查看更多图表类型

示例

这里有一些 ECharts 的示例,您可以参考和学习。

资源

希望这些信息能帮助您更好地了解和使用 ECharts。😊