如何在创建后更改Highcharts数据

时间:2018-02-13 20:16:54

标签: html csv highcharts

加载高保真数据后,如何更改显示格式?

我有一个输出CSV文件的程序。我将文件cronjob到我的网络服务器。在那里我创建了一个高清HTML图表。

我有3行,第3行的数据以秒为单位。我希望在几个小时内显示它,因为有时它可能是一年,这会破坏我的图表......所以每个值都应该以某种方式划分" x / 60/60"。

我发现了一些脚本可以获取现有数据并对其进行转换并将其恢复,但我并不知道如何在不点击额外按钮的情况下让它们正常工作。

所以这是我的简单开始,也许有人可以帮助我。如果我不高兴,请随时问我

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!-- 1. Add these JavaScript inclusions in the head of your page -->
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="https://code.highcharts.com/highcharts.js"></script>
    <script type="text/javascript" src="https://code.highcharts.com/modules/data.js"></script>                    
    <!-- 2. Add the JavaScript to initialize the chart on document ready -->
    <script type="text/javascript">
        $(document).ready(function() {
             /*
                 Load the data from the CSV file. This is the contents of the file:    
                 Apples;Pears;Oranges        
                 John;8;4;5
                 Jane;3;4;5
                 Joe;86;76;79
                 Janet;3;16;13    
             */
             $.get('stat.csv', function(csv) {
                 $('#container').highcharts({
                     chart: { type: 'column' },
                     data: {
                         csv: csv,
                         itemDelimiter: ';'
                     },
                     title: { text: 'Deadlines' },
                     yAxis: { title: { text: 'Units' } }
                 });
             });
         });
     </script>
 </head>
 <body>
     <!-- 3. Add the container -->
     <div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
 </body>
</html>

0 个答案:

没有答案