zoukankan      html  css  js  c++  java
  • 使用Highcharts生成折线图_at last

    //数据库数据的读取,读取数据后数据格式的转换,还有highchart数据源的配置,伤透了脑筋。

    anyway,最终开张了。哈哈!

    数据库连接:conn_orcale.php

    <?php
    $dbconn=oci_connect("dnc-local","dnc-local","orcl")or die("数据库连接错误");
    ?>
    
    读取数据:device_query.php

    <?php
      require 'conn_orcale.php';
      $sql = "select * from xiaolv_month";
      $query = oci_parse($dbconn,$sql);
      oci_execute($query);
       <span style="color:#ff0000;">while( $a = oci_fetch_array($query))
       {
       	
       	$b[] = intval($a[1]);
      
       }
        $data= json_encode($b);</span>
         oci_close($dbconn);
    ?>

    <?php
      require 'conn_orcale.php';
      $sql = "select month,xiaolv from xiaolv_month";
      $query = oci_parse($dbconn,$sql);
      <span style="color:#ff0000;">$b=array();
       while( $a = oci_fetch_array($query))
       {
       	array_push($b,intval($a[1]));
       }
        echo json_encode($b);</span>
         oci_close($dbconn);
    ?>
    使用Highcharts生成折线图:Test.php
    <?php
      require 'device_query.php';
    ?>
    <html>
    <head>
    <title>hello mnmlist!</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/highcharts.js"></script>
    <script type="text/javascript" src="js/themes/gray.js"></script>
    <script type="text/javascript" src="js/json_parse.js"></script>
    <script type="text/javascript">
    $(function () {
        $('#mnmlist').highcharts({
            title: {
                text: 'Monthly Average Temperature',
                x: -20 //center
            },
            subtitle: {
                text: 'Source: WorldClimate.com',
                x: -20
            },
            xAxis: {
                categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
            },
            yAxis: {
                title: {
                    text: 'Temperature (°C)'
                },
                plotLines: [{
                    value: 0,
                     1,
                    color: '#808080'
                }]
            },
            tooltip: {
                valueSuffix: '°C'
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'middle',
                borderWidth: 0
            },
            <span style="color:#ff0000;">series: [{
                name: 'xiaolv',
                data: <?

    php echo $data;?> }]</span> }); }); </script> </head> <body> <p><?

    php echo $data." ";?></p> <div id="mnmlist" style="min-800px;height:400px"></div> </body> </html>

    正能量。有图有真相。奋斗





  • 相关阅读:
    crtmpserver流媒体服务器的介绍与搭建
    RTMP流媒体服务器 crtmpserver
    red5-server源码:https://github.com/Red5/red5-server
    C++实现RTMP协议发送H.264编码及AAC编码的音视频
    linux 下Time_wait过多问题解决
    Tomcat调优配置技巧集锦
    Tomcat调优总结
    LeetCode题解之 Longest Common Prefix
    LeetCode题解之Longest Continuous Increasing Subsequence
    LeetCode题解之Longest Increasing Subsequence
  • 原文地址:https://www.cnblogs.com/mengfanrong/p/5376946.html
Copyright © 2011-2022 走看看