Echart.js 入门案例

最新推荐文章于 2025-06-21 15:04:44 发布

qq_36001599

最新推荐文章于 2025-06-21 15:04:44 发布

阅读量583

点赞数

CC 4.0 BY-SA版权

分类专栏： Echart 文章标签： Echart

本文链接：https://blog.youkuaiyun.com/qq_36001599/article/details/82021574

Echart 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了Echart.js的基础知识，并展示了一个生成的图表页面。在实践中遇到一个未知问题，待解决。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Echart 是什么自行百度百度说的很详细先给张生成好的页面
这里写图片描述

代码
<script src="js/echarts.min.js" type="text/javascript"></script>
<div id="main" style="height:400px"></div>

<script type="text/javascript">
   var myChart = echarts.init(document.getElementById('main'));
        var option={
            tooltip: {
                        show: true
                    },
                    legend: {
                        data:['销量']
                    },
                    xAxis : [
                        {
                            type : 'category',
                            data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
                        }
                    ],
                    yAxis : [
                        {
                            type : 'value'
                        }
                    ],
                    series : [
                        {
                            "name":"销量",
                            "type":"bar",
                            "data":[5, 20, 40, 10, 10, 20]
                        }
                    ]
                };

      //为eccharts 对象加载数据
      myChart.setOption(option); 

</script>