bar width not being correctly calculated

[Tarpon907]

I'm trying to generate a bar graph with no space between the bars. Instead, the bars overlap. bar_width is not set, and bar_space = 0.

When bar_space = 14, I get this, which is what I expected to get with bar_space = 0.

These are my settings.

array(29) {
  ["datetime_keys"]=>
  bool(true)
  ["datetime_text_format"]=>
  array(2) {
    [0]=>
    string(1) "l"
    [1]=>
    string(3) "M d"
  }
  ["back_colour"]=>
  string(5) "white"
  ["back_stroke_width"]=>
  int(0)
  ["stroke_width"]=>
  int(0)
  ["show_axes"]=>
  bool(true)
  ["bar_space"]=>
  int(0)
  ["group_space"]=>
  int(0)
  ["minimum_grid_spacing_v"]=>
  int(30)
  ["grid_division_h"]=>
  int(6)
  ["axis_min_h"]=>
  string(16) "2023-11-29 00:00"
  ["axis_levels_h"]=>
  int(2)
  ["axis_min_v"]=>
  array(2) {
    [0]=>
    int(0)
    [1]=>
    int(29)
  }
  ["axis_max_v"]=>
  array(2) {
    [0]=>
    int(95)
    [1]=>
    int(59)
  }
  ["structured_data"]=>
  bool(true)
  ["structure"]=>
  array(3) {
    ["key"]=>
    string(4) "Date"
    ["value"]=>
    array(2) {
      [0]=>
      string(5) "value"
      [1]=>
      string(7) "overlay"
    }
    ["colour"]=>
    array(2) {
      [0]=>
      string(6) "colour"
      [1]=>
      string(7) "colour2"
    }
  }
  ["axis_font_size"]=>
  string(2) "12"
  ["axis_font"]=>
  string(10) "sans-serif"
  ["axis_stroke_width"]=>
  int(1)
  ["axis_colour"]=>
  string(7) "#777777"
  ["label_font"]=>
  string(10) "sans-serif"
  ["label_font_size"]=>
  int(12)
  ["dataset_axis"]=>
  array(2) {
    [0]=>
    int(0)
    [1]=>
    int(1)
  }
  ["marker_size"]=>
  array(1) {
    [0]=>
    string(1) "1"
  }
  ["show_tooltips"]=>
  bool(true)
  ["tooltip_align"]=>
  string(4) "left"
  ["axis_max_h"]=>
  string(16) "2023-11-30 00:00"
  ["label_v"]=>
  array(2) {
    [0]=>
    string(3) "kWh"
    [1]=>
    string(2) "*F"
  }
}

[goat1000]

This is because you are using datetime keys, and bar graphs don't work very well with the datetime axis.

If you don't set the bar_width option, SVGGraph uses the grid unit and bar_space to calculate it. On a simple bar graph one grid unit is one bar, so it works out.

On your datetime-based graph a grid unit is one hour, but it looks like your bars are spaced 30 minutes apart so they are overlapping. When you set the bar_space to 14 it made the bars 1 hour minus 14 pixels wide.

I don't have a fix for this because bars don't have to be evenly spaced on a datetime axis and could be anywhere.

The best way around it is to set bar_width to a fixed value that gives you the result you want. If you set grid_left and grid_right to fixed values you will be able to divide the distance between them by 48 to get the width of a 30-minute bar. (Assuming your graph is always a 24-hour day and not something like a 23 or 25 hour day when daylight savings switches).

[Tarpon907]

This is my daily example. I also have weekly and monthly charts, sometimes with inconsistent data (days/hours missing in the middle). If I don't use datetime keys, will the data still be properly spaced with irregular keys? Or should I convert my dates to integers, and then use custom labels that convert them back to date strings?

[goat1000]

Personally, I would stick with datetime keys and used a fixed bar width. Calculating the value for bar_width using grid_left, grid_right and the time period is fairly simple.

You could use a non-datetime axis, but to make sure gaps in the data leave gaps in the graph you would have to either add NULL values for them or assign integer keys (something like 0, 1, 2, 3, 4, 7, 10, 11). You could use a callback or structured data to set the axis labels.