Polar plots using Panel

Panel
1

Hello,

I’m been trying to generate polar plots to add them into my panel applications. I have tried many different packages (bokeh, holoviews, plotly etc.) without any luck.

Below is a minimum working example using plotly

import numpy as np
import panel as pn
import plotly.graph_objs as go
pn.extension("plotly")
# hv.extension("plotly")

fig = go.Figure()
fig.add_trace(
    go.Scatterpolar(
        r=np.random.uniform(low=-20, high=10, size=(360,)),
        theta=np.arange(-180,180),
        fill="toself",
        fillcolor=None,
        line_color="green",
    )
)
fig.update_layout(polar=dict(radialaxis=dict(visible=True)))
fig.show()

Showing the plotly figure directly produces the desired polar plot.

image
image1241×1162 158 KB

Whereas adding the same figure to a panel object (pane, Column, etc.) does not produce the same plot.

pn.pane.Plotly(fig,width=600,height=600)

image

Thanks in advance

2

After lots of trial and error I finally got Matplotlib to generate the required plot so that it could be added to panel.


# Importing the required modules
import matplotlib.pyplot as plt
import numpy  as np
import pandas as pd
import panel as pn
pn.extension()

r = np.random.uniform(low=-20, high=10, size=(360,))
theta = np.arange(-180, 180)

# Creating a new figure and setting up the resolution
fig = plt.figure(dpi=200)

# Change the coordinate system from scaler to polar
ax = fig.add_subplot(projection='polar')

# Generating the X and Y axis data points
theta = np.deg2rad(theta)
# theta = np.deg2rad(np.arange(-180,180,1))

# plotting the polar coordinates on the system
plt.polar(theta,r,)

# Setting the axis limit
ax.set_ylim(-30,10)

# Displaying the plot
# plt.plot()
pn.Column(fig)

image
image707×638 133 KB

plotly verison
image

3

Hi @killcoder

I believe the problem is that Panel uses Plotly.js v 2.25.1. And the plot you want to display needs a more recent version.

You can workaround the issue by importing the Plotly.js directly.

image
image684×584 90.2 KB

import numpy as np
import panel as pn
import plotly.graph_objs as go


pn.extension(js_files={"plotly": "https://cdn.plot.ly/plotly-2.31.1.min.js"})

fig = go.Figure()
fig.add_trace(
    go.Scatterpolar(
        r=np.random.uniform(low=-20, high=10, size=(360,)),
        theta=np.arange(-180,180),
        fill="toself",
        fillcolor=None,
        line_color="green",
    )
)
fig.update_layout(polar=dict(radialaxis=dict(visible=True)))
pn.pane.Plotly(fig, width=600, height=600).servable()
4

I’ve made a feature request to update Panels version of Plotly.js

Update Plotly js to latest version to support polar plots. · Issue #6741.

5

Thanks @Marc, I now have plotly polar plots appearing in my panel apps.

1 Like