Получить линейное распределение по тикам линейного графика jqplot

Question

Я хотел бы предоставить tickInterval на визуализаторе диаграммы jqPlot для получения линейного распределения по оси.

 $.jqplot.config.enablePlugins = true;
    var chartData = [[1, 224], [3, 672], [5, 1120],[15,2240]];

    function PlotChart(chartData) {


    var plot2 = $.jqplot('chart1', [chartData], {
        title: 'Mouse Cursor Tracking',
        seriesDefaults: {
            renderer: $.jqplot.CanvasAxisLabelRenderer,
            rendererOptions: {
                smooth: true
            },
            pointLabels: {
                show: true
            }
        },
        axes: {
            xaxis: {
                label: 'Number of Cookies',
                renderer: $.jqplot.CategoryAxisRenderer,
                // renderer to use to draw the axis,     
                tickOptions: {
                    formatString: '%d'
                }
            },
            yaxis: {
                label: 'Calories',
                tickOptions: {
                    formatString: '%.2f'
                }
            }
        },
        highlighter: {
            sizeAdjust: 7.5
        },
        cursor: {
            show: true
        }
   });
} PlotChart(chartData);

пример jsfiddle

Выше приведен пример графика, как он выглядит в настоящее время.
Я хотел бы предоставить пункты 1, 5, 10, 15, 20 на xaxis (tickInterval - 5) и по отношению к 1,3,5,15 участкам необходимо находиться в координатной плоскости для сопоставления значений [[1, 224], [3, 672], [5, 1120],[15,2240]]

Где в настоящее время его распространяют согласно xticks что неравномерно Любая помощь приветствуется!

Я пытался получить его с помощью мин / макс и tickInterval собственность, но кажется, что это не подходит хорошо.

Answer 1

Если вы хотите указать tickIntervals на оси X, вы можете сделать это следующим образом.

$.jqplot.config.enablePlugins = true;
var chartData = [[1, 224], [3, 672], [5, 1120],[15,2240]];

function PlotChart(chartData) {

var plot2 = $.jqplot('chart1', [chartData], {
    title: 'Mouse Cursor Tracking',
    seriesDefaults: {
        renderer: $.jqplot.CanvasAxisLabelRenderer,
        rendererOptions: {
            smooth: true
        },
        pointLabels: {
            show: true
        }
    },
    axes: {
        xaxis: {
            label: 'Number of Cookies',
            min:0,
            max:20,
            tickInterval:5,
            // renderer to use to draw the axis,     
            tickOptions: {
                formatString: '%d'
            }
        },
        yaxis: {
            label: 'Calories',
            tickOptions: {
                formatString: '%.2f'
            }
        }
    },
    highlighter: {
        sizeAdjust: 7.5
    },
    cursor: {
        show: true
    }
});
}
PlotChart(chartData);

ссылка jsFiddle

Вы можете рассчитать min, max а также tickInterval перед построением графика. Надеюсь, это поможет.

Answer 2

НЕ используя renderer: $.jqplot.CategoryAxisRenderer у тебя все получится