jquery - flot bar chart with equal distance x axis -


i using flot reports. can data flot, confused formatting of it.

for example, flot code looks this:

var views = [    [3747, 7],    [3119, 2],    [3442, 2],    [3748, 1],    [3754, 1],    [2645, 1],    [3534, 1],    [3120, 1],    [2836, 1],    [3571, 1] ]; var ticks = [     3747,     3119,     3442,     3748,     3754,     2645,     3534,     3120,     2836,     3571 ]; var options = {     series: {         bars: {             show: true         }     },     grid: {         hoverable:true,         clickable:true,         tickcolor:"#dddddd",         borderwidth:0     },     bars: {         align: "center",         barwidth: 0.5     },     xaxis: {         ticks: ticks     },     colors:["#fa5833"] }; var data = [{data: views, label: "views"}]; var placeholder = $("#top-views-graph"); var plot = $.plot(placeholder, data, options);  

which shows this:

enter image description here

i have 2 problems this.

  1. the x axis automatically adjusting gaps between each label. want them equal.
  2. i need actual bars extend full width of "grid column"

does know how achieve this?

i have tried documentation , google can't seem find anyway it. have thought lot of people require.

any appreciated :)

/r3plica

flot taking tick values numeric (give me tick @ number) when want them labels.

specify ticks , data this:

var views = [[0,7],              [1,2],              [2,2],              [3,1],              [4,1],              [5,1],              [6,1],              [7,1],              [8,1],              [9,1]];       var ticks = [         [0,'3747'],         [1,'3119'],         [2,'3442'],         [3,'3748'],         [4,'3754'],         [5,'2645'],         [6,'3534'],         [7,'3120'],         [8,'2836'],         [9,'3571']     ]; 

fiddle here.

enter image description here


Comments