Flot Fixed Chart width.

[dav...@theredtheory.com]

Hey all.

How would i set a fixed grid with on all my flot charts?  I haven't been able to find anything in the docs or though my searches.

Thanks!

[Ced]

The grid is based on your settings for ticks.
For a fixed size grid, you use set the tickSize option on the x and y axes.

xaxis: {
  tickSize: 10
},
yaxis: {
  tickSize: 10
}

[nguyen dang Thanh]

i don't understand your question. Do you meadn width as pixel, so set width of your "#placeholder" div

if i want to set width of xaxis or yaxis, use options

min:

max:

[dav...@theredtheory.com]

Yes. I mean width as pixles. I am sorry for my ambiguous question. I would like both graphs to be the exact same width and line up with the red line on the right. 

I have set both graph containers to 700px but for some reason the bottom graph is smaller.

Below is my code, as you can see its the same;

                // Top Chart

$.plot($("#emp_size"), [

   {

       data: emp_size,

        bars: { show: true, align: 'center', barWidth: 0.5 },

        color : 'red',

   }],

   {

       xaxis: { ticks: emp_labels },

       yaxis:{ tickFormatter: function (val, axis) { return val + "%"} }    

   }

);

// Bottom Chart

$.plot($("#issue_types"), [

   {

       data: issue_types,

        bars: { show: true, align: 'center', barWidth: 0.5 },

        color : 'red'

   }],

   {

       xaxis: { ticks: issue_labels },

       yaxis:{ tickFormatter: function (val, axis) { return val + "%"} }    

   }

);

[Ced]

There's been some work done lately that deals with label widths.  I don't know if this is intended behavior or not.  However, in the case you've shown it's definitely difficult to deal with.

This problem does not exist with version 0.7.
In 0.8, I was able to force the graphs to the same size by explicitly setting xaxis.labelWidth to the same value for both graphs. However, this will cause the longer labels to wrap into multiple lines.

[dav...@theredtheory.com]

The really weird issue is that i have also tried to set label widths and its not changing the graph size. I may just have to deal with the graphs being different sizes.

[dnschnur]

Could you show us how you're using labelWidth?  That should work.

[dav...@theredtheory.com]

I haven't been using labelWidth. Are you saying if i set all my labels to a specific width i could get all the graphs on the page to be the same size?

[dnschnur]

The labelWidth option lets you set an explicit width for the x-axis, making the plot area a consistent size.