1

我正在尝试获取带有日期的 x 轴。x 数据是时间戳。不知何故，我无法正确处理。

该行具有以下值：

line = [[1334856823000, 2], [1334856853000, 1], [1334856883000, 0], [1334856913000,4],[1334856914000, 13], [1334856943000, 16], [1334856973000, 23], [1334857003000, 24], [1334857033000, 36], [1334857063000, 14], [1334857093000, 1]]

            $.jqplot('container', [line],
              { title: "Snelheidsgrafiek",
                axes: {
                  xaxis: {
                    rederer: $.jqplot.DateAxisRenderer,
                    rendererOptions: {tickRenderer: $.jqplot.canvasAxisTickRenderer},
                    tickOptions: {formatString: '%H:%M'}
                  },
                  yaxis: {
                    min: 0
                  }
                }
            });

现在它显示%H:%M为标签。我尝试了很多变化，但无法实现。

4

2 回答 2

3

就这样吧。您的问题是tickRenderer: $.jqplot.CanvasAxisTickRenderer应该与 处于同一级别renderer，而不是 inside rendererOptions。

请参阅jsfiddle。

编辑

此外，您还缺少使用的导入，CanvasTextRenderer并且CanvasAxisTickRenderer您忘记以大写字母开头C，如下所示：$.jqplot.CanvasAxisTickRenderer.

于 2012-05-08T14:59:05.927 回答
0

试试这个。这是从工作代码中匆忙复制的。我删除了很多内容，以便为您提供更好的概述。也许它在这里和那里缺少一个括号，但它应该让您了解要设置什么以及受影响的变量如何。这肯定 100% 有效。

确保还包含所需的 Javascript 库。

如果您需要更多详细信息，请告诉我...

<script type="text/javascript">(function($) {
            var indizes;
            var plot1; 
            $(document).ready(function() {
                $(function() {
                   $(document).ready(function() {
indizes = [["2011-12-31",0.00],["2012-01-31",6.25],["2012-02-28",12.56],["2012-03-31",17.62],["2012-04-30",18.72],["2012-05-31",12.44],["2012-06-30",15.14],["2012-07-31",20.27],["2012-08-31",20.82],["2012-09-30",24.47],["2012-10-31",25.68],["2012-11-30",26.41],["2012-12-31",28.43],["2013-01-31",32.76],["2013-02-28",36.82],["2013-03-31",42.29],["2013-04-30",43.14],["2013-05-31",45.87],["2013-06-30",40.68],["2013-07-31",50.58],["2013-08-31",46.00],["2013-09-29",56.20],["2013-10-02",55.40]];                            ;

            draw_first();

            function draw_first() {
                plot1 = $.jqplot("chartdiv", [indizes], {
                    seriesColors: ["rgba(0, 189, 255, 1)"],
                    title: '',
                    grid: {
                        background: 'rgba(57,57,57,0.0)',
                        drawBorder: false,
                        shadow: false,
                        gridLineColor: '#333',
                        gridLineWidth: 1
                    },
                    legend: {
                        show: true,
                        placement: 'inside',
                        location: 'nw'
                    },
                    seriesDefaults: {
                        rendererOptions: {
                            smooth: false,
                            animation: {
                                show: true
                            }
                        },
                        showMarker: true,
                        pointLabels: {show: pointlabels},
                        markerOptions: {
                            style: 'filledSquare'
                        }
                    },
                    series: [
                        {
                            label: 'Indizes'
                        }
                    ],
                    axesDefaults: {
                        rendererOptions: {
                            baselineWidth: 2,
                            baselineColor: '#444444',
                            drawBaseline: false
                        }
                    },
                    axes: {
                        xaxis: {
                            renderer: $.jqplot.DateAxisRenderer,
                            tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                            tickOptions: {
                                formatString: "%b",
                                angle: 0,
                                textColor: '#888'
                            },
                            min: "2012-10-01",
                            max: "2013-10-31",
                            tickInterval: "1 month",
                            drawMajorGridlines: true
                        },
                        yaxis: {
                            renderer: $.jqplot.LinearAxisRenderer,
                            pad: 0,
                            rendererOptions: {
                                minorTicks: 1
                            },
                            drawMajorGridlines: false,
                            tickOptions: {
                                formatString: function() {
                                    return '%#.1f %';
                                }(),
                                showMark: false,
                                textColor: '#888'
                            }
                        }
                    }
                });
            } 

        })(jQuery);</script>
于 2013-10-02T12:23:34.690 回答