1

今天我下载了最新版本的jqPlot并用数据填充了一个Plot,我遇到了DateAxisRenderer“挂断”问题。至少我认为这可能是问题所在。

我尝试注入此修补程序(http://www.cefolger.net/2012/02/jqplot-crashhanginfinite-loop-in.html),但它仍然无法正常工作。

我的设置如下。

<div id="history_chart" stlye="height: 300px; width: 500px;">

</div>

<script type="text/javascript">
    $(function(){
        var history_data = <?php echo json_encode($history_data); ?>;
        var historyDataRenderer = function(){
            console.log(history_data);
            return history_data;
        }
        var history_plit = $.jqplot('history_chart',[], {
            title: "Tarifhistorie",
            dataRenderer: historyDataRenderer,
            axes: {
                xaxis:{
                    renderer: $.jqplot.DateAxisRenderer,
                    tickOptions: '%e.%#m.%Y (%#H:%#M:%#S)'
                },
                yaxis:{}
            }
        });
    });
</script>

我通过的数据:

[["29.02.2012 16:11", "1"], ["26.03.2012 15:56", "2"], ["26.03.2012 15:57", "6"], ["26.03.2012 15:57", "1"], ["27.03.2012 11:33", "3"], ["27.03.2012 11:36", "1"], ["27.03.2012 11:36", "3"], ["27.03.2012 11:36", "2"], ["27.03.2012 11:36", "1"], ["28.03.2012 11:35", "1"], ["28.03.2012 11:38", "1"], ["28.03.2012 11:59", "1"], ["28.03.2012 12:03", "1"]]

格式化为列表:

  • 29.02.2012 16:11,1
  • 26.03.2012 15:56,2
  • 26.03.2012 15:57,6
  • 26.03.2012 15:57,1
  • 27.03.2012 11:33,3
  • 27.03.2012 11:36,1
  • 27.03.2012 11:36,3
  • 27.03.2012 11:36,2
  • 27.03.2012 11:36,1
  • 28.03.2012 11:35,1
  • 28.03.2012 11:38,1
  • 28.03.2012 11:59,1
  • 28.03.2012 12:03,1

删除 tickOptions 并直接添加 history_data + 在 history_data 周围添加括号有效,但我不太高兴,因为日期刻度为 4 天,我需要更精确的刻度。

<script type="text/javascript">
    $(function(){
        $.jqplot.config.enablePlugins = true;
        var history_data = <?php echo json_encode($history_data); ?>;

        var historyDataRenderer = function(){
            //console.log(history_data);
            for(var i=0;i<history_data.length;i++){
                var randString = (""+Math.random(1568));
                history_data[i][0] = history_data[i][0] + ":"+randString.substring(2, 4);
            }
            console.log(history_data);
            return history_data;
        }
        historyDataRenderer();
        var history_plot = $.jqplot('history_chart', [history_data], {
            title: "Tarifhistorie",
            /*dataRenderer: historyDataRenderer,*/
            axes: {
                xaxis:{
                    renderer: $.jqplot.DateAxisRenderer
                },
                yaxis:{
                    min: 0,
                    max: 10
                }
            },
            highlighter: {
                show: true,
                sizeAdjust: 7.5
            },
            cursor: {
                show: false
            }
        });
    });
</script>
4

0 回答 0