Hello, it’s getting fun to work with the new UI! Now I would like to integrate charts. I have read somewhere that the new UI is so powerful that tools like Grafana are no longer needed to generate graphs as shown in the example.
I have no idea how to start. Can anyone give me an example?
I’m mainly using RRD4J for this right now. I tried it briefly with InfluxDB and it didn’t work but I didn’t look into whether that was my problem or a bug yet.
I have rrd4j set as my default and I currently have a profile to save everything. There is a reason for this. In MainUI you will find scattered here and there a button labeled “Analyze”. Clicking on that will generate a chart of what ever you are looking at. Here is the chart I see when I click on “Analyze All” on my Humidity card in the “Properties” tab. I show this because I didn’t set anything up to generate this chart. All I had to do was build the semantic model so my humidity sensors are properly tagged and make sure the humidity Items are saved to the default persistence.
You can change how the chart looks in controls and change the time period by clicking D in the upper right corner.
You can even put the chart of an Item behind the Item’s card so no matter where you look at it you can see a history of it’s state.
And there’s that "Analyze button again.
I bring these up to point out that a lot of charting capability “just happens”. You don’t have to do much of anything to get them.
If you want to create a chart manually though, go to Settings -> Pages and click the + icon at the bottom right. Choose “Chart” from the list.
I don’t know what everything here does so you’ll have to play around . To create a simple line chart:
At any time you can toggle the live view in the bottom right corner or by typing ctrl-r.
Save the page as you go (ctrl-s, button at top right).
When done, depending on the settings you chose, you will see a new entry in the left menu for the new chart page.
Obviously this doesn’t cover everything but it should give you enough to get started.
Hi,
Thanks for the introduction! For most cases the first approach, clicking on the default widget, is sufficient. The second approach, one chart per page is not interesting for me.
I think of a “Default Chart Widget” which I can assign directly to the item or group via metadata. Here you could probably develop your own widget, but I don’t have the starting point.
Who said one chart per page? You can put as many charts on one page as you want. Just add another Grid (or one of the other ones). That’s why I have step 4.
Thank you, so far understood. But I like to combine different things like switches, status and diagrams. This is also propagated in the model approach of OH3.
What I have in mind is the possibility to combine diagrams in the pages with other things.
Maybe this can be done with the corresponding default widgets for the automatically generated views?
I had the same question but i am not sure if its possible as charts are pages and its probably not possible to use them as widgets
On a side note, could you share the YAML for this one? seems good. thanks!!
So i am testing OH3 in a VM as well and ported some of my functionalities from OH2 to OH3.
I started generating pages and my approach was to create tabbed pages, one overview and one graph page.
While i can see my volumes from each speaker in a graph very nicely, i’m not able to show any switches in a graph. On the “analyze button” within the items i can see that there are persisted values, but a graph on a graph’s page is always empty.
Is there a known bug or am i missing anything?
If I remember correctly, the default database stores only numbers.
Okay, but why do i have persistency data on the item’s “analyze button” then?
rrd4j can save switches and contacts too. Here’s a chart of one of my contacts saved to rrd4j.
However, notice that it’s an area chart, not a line chart. What type of chart are you trying to create?
i tried a line chart, what is an area chart? Aggregate series?
I don’t know for sure. This is how it charts by default when I click, on Analyze. When I open “controls” it says it’s an Area chart. I don’t know much more than that.
Yes i see the same in the “analyze” chart… Hm! Maybe this is not possible right now in the charts pages…
Hmm, could be dependent on the binding you use. It would be interesting to compare how switches are tagged herein.
Anything that you can do from Analyze should be possible from the Charts Pages. It’s the same code that drives both.
Also, you can click on the Analyze tab and save the chart that is created and use that elsewhere.
Beyond that I don’t know. We’ll need someone who knows more than I do to figure that out.
No, a Switch Item is a Switch Item and it doesn’t matter to Persistence (or anything else in OH) what type of binding it’s linked to. That’s sort of the whole point of Items in the first place.
Yeah, that’s a good hint, saving the chart from the analyze-button works! Will have a look in the “code” section what differs from mine! Thanks!!!
Due to the hint of @rlkoshak i found out the differences to show a switch item on a charts page.
If you add a time series in the pages chart builder a time series looks something like:
- component: oh-time-series
config:
gridIndex: 0
xAxisIndex: 0
yAxisIndex: 0
type: line
name: Bewohner
item: presence
If you generate a chart from the “Analyze Button” the time series looks like:
- component: oh-time-series
config:
name: Bewohner
gridIndex: 0
xAxisIndex: 0
yAxisIndex: 0
type: line
areaStyle: {}
slots:
markArea:
- component: oh-mark-area
config:
name: presence
item: presence
With that in mind you are able to generate Switch-Charts from within the pages-section! Thanks!
Hello,
actually I am playing with the chart function of the main UI, very nice, thank you @ysc for this.
Can somebody give me a hint how to format the number on the axis in the code section. Actually I have a the number on the y axis like this example: 1,168.5 and I want to have this format: 1168,5.
Any Ideas?
Thank you!
Thanks @rlkoshak for sharing the way to prepare the chart page.
Let me ask a question related to Graphs as a part of Analyze for every Item.
Initialy it worked well, but suddenly, after I took time to define more precisely the semantic classes for all the Point, it display just the value for the Item, but after clicking Analyze, it is without any graph line.
Example what I set-up. For all Thermostat Thing Items i defined Point-Measurement instead of pure Point, and Point-SetPoint instead of Point.
Anyone has same experience and possible solution for it?
UPDATE: As I also have former OH2 items&sitemaps, I see that the Channels defined via Items can be well analyzed with a graph.
Hi
Wondering how to display multiple separated graph on chart page. Adding additional grid on OH3.4 only superimpose graphs on a chart.
