Question

我正在尝试每月绘制一个带有单个数据点的图表。我在每个月的第一天将这个发送到jqPlot作为单点：

$.jqplot('actualChart', [[['2011-10-01',0.296],['2011-11-01',0.682]]], {
    title: programSelection.options[programSelection.selectedIndex].text,
    axes: {
        xaxis: {
            renderer: $.jqplot.DateAxisRenderer,
            rendererOptions: { tickRenderer: $.jqplot.CanvasAxisTickRenderer },
            tickOptions: { formatString: '%b' }
        }
    }
}

我正在使用Ajax加载图表数据。一些数据集具有比其他数据集更多的数据点 - 在上面的示例中仅有2个点，x轴刻度（其中'％b'表示仅显示为10月和11月）沿着轴自动渲染，但是经常，例如，九月...十月...十月...十月...十月...十一月 - 沿着显示的线的常规点。我只想在10月初开始一次嘀嗒，在11月初开始做另一次。

我花了很多时间搜索，似乎为此做了tickInterval，但添加了

tickInterval: '1 month'

只是让x轴，数据点和线条消失 - 这就是我所指的破碎功能！指定任何其他间隔，例如

tickInterval: '2 days'

也打破了它。

解决方法是手动提供刻度，例如

ticks: ['2011-10-01','2011-11-01']

这个确实将刻度线放在正确的位置，但是

a）是一个不应该被要求的麻烦，

b）在图形数据点的任一端丢失了漂亮的填充，因此两端的点都出现在图形的边缘。当然，除非添加任何一方的手动勾选，但在上面的10月至11月示例中，我不希望在任何一方提供整月，因为有趣的数据仅占用图的中间三分之一。

任何人都可以帮我吗？提前谢谢。

编辑 - 找到了一个解决方案：为轴提供 min 属性似乎解决了这个问题（无论出于何种原因...... bug？），所以除非有人有任何更好的想法我都会这样做！

Answer 1

我找到了解决方案！您需要将tickinterval指定为javascript时间戳。所以假设你想要1个小时。这将是1000 * 60 * 60 = 3600000（javascript时间戳以毫秒为单位）。

所以你会写：tickInterval：'3600000'，

在这里工作。

Answer 2

tickInterval:'1 day'有效。你可以尝试：

xaxis: {
        renderer: $.jqplot.DateAxisRenderer,
        rendererOptions: { tickRenderer: $.jqplot.CanvasAxisTickRenderer },
        tickOptions: { formatString: '%b' },
        tickInterval: '1 day'
       }

Answer 3

由于我认为你无法回答你自己的问题（我遇到了同样的问题），我会将你的解决方案作为答案发布，因为它也解决了我的问题：

为轴提供min属性似乎确实解决了这个问题（无论出于何种原因...... bug？），所以除非有人有任何更好的想法，否则我会这样做！

Answer 4

您应该在绘图数据上指定时间戳。正如日期轴的jqplot示例所述：

注意，虽然jqPlot将解析大多数人类可读日期，但最可能的情况是尽可能使用javascript时间戳。此外，最好指定日期和时间，而不仅仅是日期。这是由于浏览器处理本地时间与使用裸日期的UTC不一致。

您可以在此处查看：http://www.jqplot.com/deploy/dist/examples/date-axes.html

我提到它是因为我在2天前偶然发现了这个问题。我通过传递时间戳并定义比'1天'更大的tickInterval来解决它。

Answer 5

我查看了jqplot.dateAxisRenderer.js，看起来需要调用reset函数才能设置this.tickInterval变量。我隐约回想起你可以手动重置渲染器，但请注意，滴答间隔是以毫秒格式指定的（至少，我没有快速浏览任何翻译）。

我认为这只是一个错误。

在旁注中，我注释掉了函数中唯一的min.getUtcOffset（）调用，因为它引入了不需要的“漂移”（我想要本地时间），并导致图形在左侧被切断

jqPlot DateAxis tickInterval不工作

5 个答案: