Plot axis scaling

Anvil Q&A
1

I recently discovered Anvil in connection with a Raspberry Pi Pico W microcontroller and have built a simple app to take the outputs of a BME280 sensor (temp, humidity, pressure) and display them as plots in my app and then to return the values to the Pico for display as text on an LCD. I was surprised and pleased how easy it was (and how nice it all looks).

The default autoscales the y-axes. While this is in many ways convenient, the value variations are slow and the differences are very small at first. The plots are very messy until a reasonable range of values has been established. I would therefore like to be able to use fixed y-axis scaling.
I could add two rows to the stored data table to at least set the minimum axis ranges, but is there a better way to set the scales? I couldn’t find anything in the docs.

Any help would be much appreciated.

2

Welcome to Anvil!

How exactly are you plotting the data? Sample code would be helpful.

1 Like
3

Thanks anthonys.
I found a solution that works well for my purposes. I edit the “y” values in the first two rows of my data table to force the initial plot scale to something reasonable and then let it autoscale once it goes outside those ranges.
Nevertheless it would be useful to know how to do fixed scaling properly.
In answer to your question, I simply included three plot modules into my app and edited the values to match. Nothing fancy.
The corresponding code is:

class Form1(Form1Template):
def init(self, **properties):
# Set Form properties and Data Bindings.
self.init_components(**properties)

# Any code you write here will run before the form opens.
self.plot_AT.visible = True
# self.plot_AT.height = "100"
self.plot_AT.layout.title = "Ambient Temperature"
self.plot_RH.layout.title = "Rel. Humidity"
self.plot_AP.layout.title = "Barometric Pressure"

self.plot_AT.layout.xaxis.title = "Time"
self.plot_RH.layout.xaxis.title = "Time"
self.plot_AP.layout.xaxis.title = "Time"

self.plot_AT.layout.yaxis.title =  "deg C"
self.plot_RH.layout.yaxis.title =  "%"
self.plot_AP.layout.yaxis.title =  "hPa"

self.update_graph()

def update_graph(self):
with server.no_loading_indicator:
data = app_tables.bme280outputs.search()
self.plot_AT.data = go.Scatter(
x=[r[‘Time’] for r in data],
y=[r[‘AT’] for r in data],
)
self.plot_RH.data = go.Scatter(
x=[r[‘Time’] for r in data],
y=[r[‘RH’] for r in data],
)
self.plot_AP.data = go.Scatter(
x=[r[‘Time’] for r in data],
y=[r[‘AP’] for r in data],
)

Thanks again,
Bob

1 Like
4

I think this is what you’re looking for :slight_smile:

fig = go.Figure(data=go.Scatter(x=x, y=y, mode='lines'), layout_yaxis_range=[<insert bottom limit here>,<insert top limit here>])

This was derived from stack overflow:

1 Like
5

Thanks very much. I will certainly try that and will let you know how I get on.
I tried looking into the Plotly documents earlier, but was rather overwhelmed.
I see that Matplotlib is also possible with Anvil. I have a bit more experience with that (with Python on the Raspberry Pi) but don’t know if I can use it with MicroPython.

1 Like
6

If you wanted to take two steps here is an example app from @richard.lewis from this thread:

Where he asked about casting a matplotlib to an image shown in the client from a server module.

I modified it to include the fix @eli described to solve his problem as written.

The server module should be able to access all the info from the data tables just like the client, but even faster.

2 Likes