Question

我正在为csv文件中的盒子图和数据编写代码。但是我在读取csv时遇到错误，因为$未定义，不确定我是否有更多错误。这是我的代码和我的Csv文件。

<!DOCTYPE HTML>
 <html>
 <head>
 <p id="demo"></p>
<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
 <script src="https://code.highcharts.com/highcharts.js"></script>
 <script src="https://code.highcharts.com/highcharts-more.js"></script>
 <script src="https://code.highcharts.com/modules/exporting.js"></script>
 <script type="text/javascript">
 window.onload = function () {
 var dataPoints = [];
 var row =0;
 function getDataPointsFromCSV(csv) { 
      var dataPoints = csvLines = points = [];
      csvLines = csv.split(/[\r?\n|\r|\n]+/); 

        for (var i = 0; i < csvLines.length; i++){
            if (csvLines[i].length > 0) {     
          points = csvLines[i].split(",");
          var current_time_value = parseFloat(points[1]);
          for(var j=0;j< csvLines.length; j++){
            var point_1 = csvLines[j].split(","); 
            var arr_length=new Array() ;
            if(parseFloat(point_1[1])==current_time_value){
              arr_length.push(parseFloat(point_1[2]))
            }
          }
          var arr_length_string=arr_length.join();
          var result=[];
    for (var k=0,l=arr_length.length;k<l;k++) {
    result.push(+arr_length[k]);
    result[k]
        dataPoints.push({x: parseFloat(points[1]), y: arr_length});
        break;
            }}
      }
      return dataPoints;
    }
    $.get('results.csv', function(data) {
             $('#container').highcharts({
                        chart: {
                            type: "boxplot"
                        },
                        title: {
                            text: "Box Plot"
                        },
                        xAxis: {
                            categories: []
                        },
                        yAxis: {
                            title: {
                                text: "Number of students"
                            }
                        },
                        data: [{
             type: "boxplot",
             dataPoints: getDataPointsFromCSV(data),
             backgroundColor: "rgba(153,255,51,0.4)"
          }]

                });
            });
        }

     </script>
     </head>
     <body>
     <div id="container" style="height: 400px; margin: auto; min-
     width:310px; max-width: 600px"></div>
     </body>
     </html>

这是我的CSV格式 -

     Time1,Time2,2.4Gz,5Gz
     1485885598,1485889198,0,0
     1485885598,1485889198,-74,0
     1485885598,1485889198,-74,0
     1485885598,1485889198,-60,-
     1485885598,1485889198,-74,0
     1485889198,1485892798,-70,0
     1485889198,1485892798,0,0
     1485889198,1485892798,-63,0
     1485889198,1485892798,-74,0
     1485889198,1485892798,-74,0
     1485889198,1485892798,-64,0
     1485889198,1485892798,-61,-55
     1485889198,1485892798,0,0
     1485889198,1485892798,-67,-61

使用csv的高图框图

0 个答案: