jq plot - 获得线性x轴刻度

时间:2012-03-19 05:41:15

标签: jqgrid jqplot

我有一个jqPlot图表,如下图所示。

我使用LinearAxisRenderer作为x轴。

但x轴值为0,1,1,2,2等。

有没有办法让值为0,1,2,3等。

提前致谢。

enter image description here

代码:

 $.jqplot(ctrlId, [graphPt], {
        title: chartTitle,
        seriesDefaults: {
            renderer: $.jqplot.BarRenderer,
            pointLabels: { show: true, location: 'e', edgeTolerance: -15, formatString: '%s' },
            shadow: false,
            rendererOptions: {
                barDirection: 'horizontal',
                barMargin: 2
            }
        },
        axesDefaults: {
            renderer: $.jqplot.canvasAxisTickRenderer,
            min: 0,      // minimum numerical value of the axis.  Determined automatically.
            pad: 1.3,       // a factor multiplied by the data range on the axis to give the
            // axis range so that data points don't fall on the edges of the axis.

            tickOptions: {
                mark: 'outside',    // Where to put the tick mark on the axis 'outside', 'inside' or 'cross',
                markSize: 95,                  // 
                showGridline: false, // wether to draw a gridline (across the whole grid) at this tick,
                show: true,         // wether to show the tick (mark and label),
                showLabel: true,    // wether to show the text label at the tick,
                formatString: '%d'   // format string to use with the axis tick formatter
            },
            showTicks: true,        // wether or not to show the tick labels,
            showTickMarks: true    // wether or not to show the tick marks
        },

        axes: {
            yaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            },
            xaxis: {
                 renderer: $.jqplot.LinearAxisRenderer,
                tickOptions: {
                    mark: 'cross', 
                    markSize: 2
                }
            }
        }
    });

2 个答案:

答案 0 :(得分:6)

tickinterval属性添加到xaxis设置。

xaxis: {
             renderer: $.jqplot.LinearAxisRenderer,
            tickOptions: {
                mark: 'cross', 
                markSize: 2,   
            },
            tickInterval: 1 //ADD THIS
        }

来自jqplot documentation

tickInterval - 刻度线之间的单位数。与numberTicks互斥。

答案 1 :(得分:0)

不要忘记添加'max'和'min'属性。如果你正在单独操纵xaxis ticks。我已经失去了很多时间。

xaxis: {
            renderer: $.jqplot.LinearAxisRenderer,
            tickOptions: {
                mark: 'cross', 
                markSize: 2,   
            },
            tickInterval: 1 
            max :0,
            min :100
        }