I apologise if this question is too opinion based. If that's the case I'll delete it.
I'm looking for advice on creating a rather simple widget/GUI for displaying charts with time series data. My idea is to have the user input a date which is used to query the database. The query will return about 20k rows that I'm hoping can be stored in a dataframe in memory to avoid querying the database again.
For the layout I would like to have a grid of 2x3 charts where the user can select three items per chart to uniquely identify the product and select if it should be a line or scatter plot. There are no requirements for the style of layout around the charts, this is mainly about showing the charts, not a beauty contest.
For each product there are eight different time series that I would like in a dropdown, the user can choose 1-3. If its a line chart, time will be on the first axis and if its a scatter the user chooses a pair of time series. The input data should be dropdown with the possible values based on the dataframe. For now, its not needed that the user can change the layout of the charts.
I have looked into ipywidget but its impossible for me to have the users use Jupyter. ipywidget should be available in pycharm pro, but not all users will have the pro version and even having some of them open pycharm is a real stretch. I think the ipywidget would be a good solution, if I was able to roll it out to everyone.
I have also looked in to PyQtGraph but I don't want to massage the data into numpy arrays. Then there's Tkinter and embedding matplotlib charts but I don't want to spend a week on configuring the placement of buttons.
So I'm a little lost on what could be a viable solution. The GUI itself should be simple and just be able to show these six charts, based on user input. Ideally it would work with matplotlib, seaborn and plotly, in case I want to change something in the future.
Please let me know if you have a solution for how this can be done. Is it something like Flask or dash that can do this?
I tried Corralien's solution with streamlit. I've used used plotly to create the charts. As a starting point, this is what I'll be using. plotly creates a chart grid that streamlit can show directly. I guess the code itself is self explanatory.
import plotly.graph_objects as go
from plotly.subplots import make_subplots
import streamlit as st
fig = make_subplots(rows=2, cols=3)
fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6], mode='lines'), row=1, col=1)
fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6], mode='lines'), row=1, col=2)
fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6], mode='lines'), row=1, col=3)
fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6], mode='markers'), row=2, col=1)
fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6], mode='markers'), row=2, col=2)
fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6], mode='markers'), row=2, col=3)
st.plotly_chart(fig)
This outputs the chart grid as is and does what I asked for. To begin with, I'll hard code how the charts look and only have the user select which product to look at. Later I'll add more user input to change the charts and combine different products.
Related
I am attempting to work on an image segmentation task from Kaggle (https://www.kaggle.com/hsankesara/unet-image-segmentation/data). I am running this on a docker container that I've set up on a server running in an Ubuntu console.
I'm relatively new to this, so I'm quite unsure about how to view the images produced by matplotlib within the docker container I've produced. The code just runs, and then exits - I'm left uncertain about what the outputs of the code are (as in what the filters for the CNN are) and I can't see any of the plots.
Many thanks!
You can save the plots as a .png or .jpg files and download it from the Ubuntu server. This will help you view the plots as image file in your local system.
you can save the plots using
import matplotlib. some plot function as plt
do some plotting
`plt.save('path to save')
An example from Matplotlib.pyplot.savefig() in Python
# importing required modules
import matplotlib.pyplot as plt
# creating plotting data
xaxis =[1, 4, 9, 16, 25, 36, 49, 64, 81, 100]
yaxis =[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
# plotting
plt.plot(xaxis, yaxis)
plt.xlabel("X")
plt.ylabel("Y")
# saving the file.Make sure you
# use savefig() before show().
plt.savefig("squares.png")
After saving this file you can simply use some client to transfer data from the server.
For FTP you can use FileZilla Client
Hope this solves the problem!!
I'm trying to compare the GDP-per-capita of the world's countries' to each countries' COVID-19 death total. Every time I try to turn it into a scatter plot, it displays the same plot as would be displayed using the plt.plot() command. Here is my code:
import pandas as pd
from matplotlib import pyplot as plt
plt.style.use('seaborn-whitegrid')
data = pd.read_csv(r'/Users/john.smith/covid-data.csv')
gdp = data["gdp_per_capita"]
deaths = data["total_deaths"]
plt.scatter(gdp, deaths)
plt.title('GDP-per-Capita Compared to COVID-19 Death Total')
plt.xlabel('GDP-per-Capita')
plt.ylabel('Confirmed Deaths')
plt.tight_layout()
plt.show()
While running this code, the following graph is produced. This is obviously not the scatter plot I'm trying to get, and it's worth noting that the only thing that changes when I use the plt.scatter() command is that the points on the plot just get very large.
I ran a test of the whole Matplotlib module entirely on a different file. When I use normal variables without importing from a CSV file, like this:
x = [7, 3, 8, 3]
y = [1, 5, 7, 4]
plt.scatter(x, y)
Then the code works perfectly fine and produces a scatter plot. I have been digging for hours online to try and find a solution, and have tried to use other methods of importing CSVs or creating scatter plots but nothing is working. Thank you for any tips.
Answer is courtesy of G. Anderson in the comments above.
As it turns out I just didn't have experience with the xlim() and ylim() commands, so the individual points in the scatter plot just overlapped very tightly in vertical lines. The reason this happened is simply because the original view window was too wide for this large of a dataset.
I did some slight additional research to try and put two plots onto a single figure with one being zoomed in, here's the code:
figs, axs = plt.subplots(2)
figs.suptitle('GDP-per-Capita Compared to COVID-19 Death Total')
axs[0].scatter(gdp, deaths)
axs[1].scatter(gdp, deaths)
plt.axis([10000, 20000, 10000, 20000])
This produced some nice plots I can use:
I'm going to look into ways to make the two plots much more readable.
started to learn using matplotlib to create graphs. But I tried various plots and they are all displaying in a wired way. I can only see the top left corner of a figure. I tried Chrome and Microsoft Edge. Both of them had the same issue. Here is an example of what I got:
I only see the top left cornor of the figure.
Here is some code that should definately work in Jupyter. If this code plots properly, then there is probably nothing wrong with your software. Give this code a try and see what happens.
from matplotlib import pyplot as plt
x = [5, 2, 9, 4, 7]
y = [10, 5, 8, 4, 2]
plt.hist(y)
plt.show()
so using the bare minimum code to produce a chart in plotly.py:
from plotly.offline import plot
from plotly.graph_objs import Scatter
plot([Scatter(x=[1, 2, 3, 4, 5], y=[3, 2, 1, 2, 3])])
produces a nice chart with a modebar on top of it. I would like to embed my chart in a website where the bar seems really intrusive. In plotly.js there's a really simple way to disable to modebar as shown here. The solution in plotly.js is merely giving additional parameter: Plotly.newPlot('myDiv', data, layout, {displayModeBar: false});
I know there's a way to save static image from plotly where the modebar is obviously disabled, but that would lose the interactive hover-actions on the plot itself, which are useful, whereas the bar that comes with it is not really that useful in my case. What I'm wondering is if there's a way to do remove the modebar in a similiar fashion to how plotly.js works?
One solution, I suppose would be to always go through the produced HTML-file and add every part of the hover bar to r.modeBarButtonsToRemove, which could turn troublesome in the long run.
I've been able to do it using the config key word argument, like this:
graph = py.plot(
figure,
output_type='div',
auto_open=False,
show_link=False,
config=dict(
displayModeBar=False
)
)
I am a little late here. But just a side note, this won't disable the functions of the top bar so when you hover it will still zoom and pan (which is extremely annoying on plots that are viewed from a mobile device). But making it a static plot isn't a good solution because I still want users on a computer to be able to hover over the points on the plot.
I solved this by changing two of the figure layout settings.
xaxis_fixedrange and yaxis_fixedrange need to be set to True if you want to disable zooming.
So I'm trying to understand how a figure is structured. My understanding is the following:
you have a canvas (if you've got a gui or something similar), a figure, and axes
you add the axes to the figure, and the figure to the canvas.
The plot is held by the axes, so for example:
import matplotlib.pyplot as plt
fig = plt.figure()
ax = fig.add_subplot(111)
ax.plot([1, 2], [1, 4])
fig.show()
I would expect would create a figure however I just get a blank window... Also, it seems canvas is not needed at all?
any help appreciated thank you!
here it says the above code should work... or has a similar example
https://github.com/thehackerwithin/PyTrieste/wiki/Python7-MatPlotLib
You shouldn't be poking at the canvas unless you really know what you are doing (and are embedding mpl into another program). pyplot has a bunch of nice tools that takes care of most of the set up for you.
There is a separation between the user layer (figures, axes, artists, and such) and the rendering layer (canvas, renderer, and such). The first layer is user facing and should be machine independent. The second layer is machine specific, but should expose none of that to
the user.
There are a varity of 'backends' that take care of the translation between the two layers (by providing sub-classes of canvas and such). There are interactive backends (QtAgg, GtkAgg, TkAgg,...) which include all the hooks into a gui toolkit to provide nice windows and non-interactive backend (PS, pdf, ...) that only save files.
figures hold axes which hold artists (and axis). Those classes will talk to the rendering layer, but you (for the most part) do not need to worry about exactly how.