apexcharts-card icon indicating copy to clipboard operation
apexcharts-card copied to clipboard

Support column position (offset)

Open Cougar opened this issue 2 years ago • 5 comments

Checklist

  • [x] I am running the latest version of the card
  • [x] I checked if there isn't another feature request opened with the same request
  • [x] I checked that the feature is not already available in the dev branch

Is your feature request related to a problem? Please describe.

I have a sensor for electricity price for the next hour. This sensor also includes prices for the future hours in the attribute list. All timestamps are start times. I'd like to show these future prices in graph.

With column type graph, it looks like this:

imgur-2022_03_22-10:05:27

It is 10:05 at the moment but from this graph it visually looks like it is already in the middle of hour. Around 10:40, the "now" line will be on the next column (price for 11:00-12:00).

Describe the solution you'd like

I' like to see graph like this:

imgur-2022_03_22-10:10:09

Here you can see that we are in the beginning of this tariff. At 11:00 the line will be in the middle of two columns but this is fine because I know that the price changes every hour.

Describe alternatives you've considered

Only way to fix it visually is to shift timestamps by 30 min. This is what I did for the previous graph. However, these times will be 30 min off when you hover to the graph. You see 10:30 when you looking the same 10:00-11:00 range price:

imgur-2022_03_22-10:05:37

Additional context

I propose to add series.display_offset as an simple and universal attribute to shift graph but I'm aware that this is usable only for columns. Another more complex (from code standpoint) would be an attribute like series.column_position with possible values like left (can be used for calculated historic data like hourly/daily/weekly/etc totals) , middle (current one) and right (the one I need).

I put this proposal here to see if there is a broader interest for such feature or if anyone already working with something like that.

Cougar avatar Mar 22 '22 08:03 Cougar

There's no way to do that with the library I use unfortunately.

RomRider avatar Apr 09 '22 12:04 RomRider

I definately second @Cougar 's motion and for the exactly same reason. I'm sure there are also others, who would welcome it, if the used library some day allows.

Another observation: In @Cougar 's chart the extrema "ring" is in the middle of the column, mine looks like this:

image

How is the centering done?

MEKadan avatar Apr 11 '22 18:04 MEKadan

My workaround is to add time_delta: +30min for the series and format the tooltip to show just the hours. Kind of hacky but works.

  tooltip:
    x:
      format: HH.00

probus avatar Oct 25 '23 10:10 probus

I also recently tackled it for 30m data.

My solution was to offset the series by 15m, and then apply a custom formatter to the tooltips to reverse offset all the times by 15m.

edwardhorsford avatar Feb 22 '24 11:02 edwardhorsford