Question

我使用了一个例子，可以使用php和mysql成功读取数据并绘制它（时基与变量），一切正常。我已经采用了它并将其用作模板并使用了不使用时基的不同数据库，但图形未呈现。该图表用于显示SQL查询中的数据，该查询将变量的出现频率与x轴上的变量和Y轴上出现的频率进行核对。

图表会弹出x和y轴值，符合预期。看起来不错;除了情节缺失。为了帮助我排除故障，我已经在屏幕上列出了数据，尽管不是很好 - 这证明了数据库被正确调用，并且没有明显的SQL错误，并且正在返回数据。

db_code`

<?php

$con = mysql_connect("localhost","root","hal9000");

if (!$con) {
  die('Could not connect: ' . mysql_error());
}

mysql_select_db("sqm", $con);

$result = mysql_query("SELECT magnitude, COUNT(*) AS xxx FROM data WHERE magnitude > 1 GROUP by magnitude");

while($row = mysql_fetch_array($result)) {
   echo $row['magnitude'] . "\t" . $row['xxx']. "\n";
}

mysql_close($con);
?> `

main_page代码

<script type="text/javascript">
        var chart;
            $(document).ready(function() {
                var options = {
                    chart: {
                        renderTo: 'common_LHS',
                        defaultSeriesType: 'line',
                        marginRight: 130,
                        marginBottom: 25
                    },
                    title: {
                        text: 'Magnitude',
                        x: -20 //center
                    },
                    subtitle: {
                        text: '',
                        x: -20
                    },
                    plotOptions: {
                        series: {
                            marker: {
                                enabled: true,
                                symbol: 'circle',
                                radius: 0
                             }
                        }
                    },
                    xAxis: {
                        type: 'linear',
                        tickWidth: 0,
                        gridLineWidth: 1,
                        labels: {
                            align: 'center',
                            x: -3,
                            y: 20
                        }
                    },
                    yAxis: {
                        title: {
                            text: 'Frequency of occurrence'
                        },
                        plotLines: [{
                            value: 0,
                            width: 1,
                            color: '#808080'
                        }]
                    },
                    legend: {
                        layout: 'vertical',
                        align: 'right',
                        verticalAlign: 'top',
                        x: -10,
                        y: 100,
                        borderWidth: 0
                    },
                    tooltip: {
                        crosshairs: [{
                            width: 2,
                            color: 'red'
                        }, {
                            width: 2,
                            color: 'red'
                        }],
                   },

                    series: [{
                        name: 'Occurrence',
                    }]
                }

                jQuery.get('data.php', null, function(tsv) {
                    var lines = [];
                    traffic = [];
                    try {
                        // split the data return into lines and parse them
                        tsv = tsv.split(/\n/g);
                        jQuery.each(tsv, function(i, line) {
                            line = line.split(/\t/);
                            traffic.push ([
                                parseFloat(line[0]),        //need to parseFloat to convert data to float from string
                                parseFloat(line[1])
                            ]);
                        });
                    } catch (e) {  }
                    options.series[0].data = traffic;
                    chart = new Highcharts.Chart(options);
                });
            });

当在LibreCalc中绘制时，数据看起来和我预期的一样，除了不能渲染它的线几乎在Highcharts中完成。

欣赏任何建议。不幸的是，由于我是这个论坛的新手，我无法提交图片，但很高兴将它们发送给某人，如果有帮助的话。

期待它是简单的，通常是：）

Answer 1

我认为问题来自您构建traffic数组的方式。它可能没有很好的排序。尝试使用第一个元素对其进行排序，使用类似：

function Comparator(a,b){
    if (a[0] < b[0]) return -1;
    if (a[0] > b[0]) return 1;
    return 0;
}

traffic.sort(Comparator);

options.series[0].data = traffic;

它会给你一个不同的结果吗？此外，您的浏览器控制台在渲染图表时是否会记录某些内容？

Answer 2

嗯，我说这很简单，就是这样。

我补充说，10确保它是小数，它没有任何区别。我将其更改为16，并期望值发生变化，并且它确实在读取数据，尽管它仍然没有绘制数据。

然后我将.replace（＆＃39;，＆＃39;，＆＃39;＆＃39;）添加到y轴并且它有效。

parseFloat（第[1]行，第10行），
parseFloat（第[1] .replace（＆＃39;，＆＃39;，＆＃39;＆＃39;），10）

似乎它不喜欢数据值中的逗号！

Highcharts线没有密谋

2 个答案: