zoukankan      html  css  js  c++  java
  • 河北省重大技术需求征集系统进度报告四

    完成任务

    昨天和今天完成了统计查询,学到了不少知识,复习了echarts有关知识,但是由于echarts的一些未知错误图表一直出不来,用最原始的模板才可以

    echarts配置模板

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>第一个 ECharts 实例</title>
        <!-- 引入 echarts.js -->
        <script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.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>

    运行以上的代码出现下图则配置正确

    其中横坐标和纵坐标的值可以配合ajax从数据库读取。

    运行截图

  • 相关阅读:
    vuex 简单理解
    es2015(es6)学习总结
    工作资源知识点总结收集
    margin-top使用需要注意的地方
    关于用display:table让元素居中的小结
    display:table-cell
    margin:0 auto;不居中
    css选择器总结
    css 选择器优先级
    给行内元素加上绝对定位之后,元素属性的变化
  • 原文地址:https://www.cnblogs.com/g414056667/p/13894025.html
Copyright © 2011-2022 走看看