zoukankan      html  css  js  c++  java
  • ECharts简单入门demo

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>ECharts</title>
        <!-- 引入 echarts.js -->
        <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts-all-3.js"></script>
    </head>
    <body>
        <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
        <div id="main" style=" 600px;height:400px;"></div>
    <script type="text/javascript"> // 利用dom,初始化echarts实例 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); </script> </body> </html>

     =====================================================================================

    以下是我自己构造的图:代码就不贴了。

  • 相关阅读:
    git简单使用
    简单Spring和mybatis整合配置文件
    ASP.NET程序开发范例宝典
    C# DataSet和DataTable详解
    AOP
    匿名内部类
    数据库事务
    mybatis
    线程池
    单例模式
  • 原文地址:https://www.cnblogs.com/houchen/p/11461893.html
Copyright © 2011-2022 走看看