eekk
December 7, 2017, 6:46pm
#1
Hey, Iâ€™ve been trying to plot some shapes in plotly, but I canâ€™t seem to get an arc shape to work.

I.e., using the SVG

`M 10 10 A 10 10 0 0 1 20 10`

for example, like

```
trace=dict(x=[5,10], y=[5,10],
mode='markers',
marker=dict(size=9, color='orange'))
axis=dict(showline=True, zeroline=False, showgrid=False)
layout=dict(width=450, height=450, autosize=False,
xaxis=dict(axis, **dict(range=[1,20])),
yaxis=dict(axis,**dict(range=[1, 20])),
shapes=[dict(type='path',
layer='below',
path="M 10 10 A 10 10 0 0 1 20 10",
fillcolor='red',
line=dict(color= 'red')
)]
)
fig=dict(data=[trace], layout=layout)
iplot(fig)
```

doesnâ€™t plot the shape at all. Is there a workaround to make the arc command work ?

empet
December 7, 2017, 6:56pm
#2
@eek Plotly does not provide the command `A`

for elliptical arc.

Here https://github.com/plotly/plotly.js/blob/master/src/components/shapes/constants.js are listed the available commands for paths.

Thx for your reply! No wonder A is always not working in the path command.
Do you happen to know how can I draw a arc with custom degree(lets say 90 degree circle)?

1 Like

Any word on how to do this or support for arc paths?

empet
October 8, 2019, 9:03pm
#5
@extraymond , @openafox

You can draw both arcs of circle or ellipse, and filled circle or ellipse calling a function that defines the corresponding svg paths:

```
import numpy as np
import plotly.graph_objects as go
def ellipse_arc(x_center=0, y_center=0, a=1, b =1, start_angle=0, end_angle=2*np.pi, N=100, closed= False):
t = np.linspace(start_angle, end_angle, N)
x = x_center + a*np.cos(t)
y = y_center + b*np.sin(t)
path = f'M {x[0]}, {y[0]}'
for k in range(1, len(t)):
path += f'L{x[k]}, {y[k]}'
if closed:
path += ' Z'
return path
fig = go.Figure()
# Create a minimal trace
fig.add_trace(go.Scatter(
x=[0],
y=[0.2],
marker_size=0.1
));
fig.update_layout(width =600, height=400,
xaxis_range=[-5.2, 5.2],
yaxis_range=[-3.2, 3.2],
shapes=[
dict(type="path",
path= ellipse_arc(a=5, b=3, start_angle=-np.pi/6, end_angle=3*np.pi/2, N=60),
line_color="RoyalBlue"),
dict(type="path",
path = ellipse_arc(x_center=2, a= 0.5, b= 1.5, closed=True),
fillcolor="LightPink",
line_color="Crimson")
]
);
fig.show()
```

If a=b youâ€™ll get an arc of circle (if layout.width=layout.height), otherwise an arc of ellipse.

1 Like

mutia
March 23, 2020, 10:20am
#6
hello If I want to change your script to giving the parameter x, y, width, height with(width and height as diameter) like

matplotlib ellipse function

https://matplotlib.org/api/_as_gen/matplotlib.patches.Ellipse.html

what is the modification that I need to do?

I tried to replicate this matplotlib function to plotly but I donâ€™t know how, Iâ€™ve tried to see the source code but there is no formula to draw the ellipse in there

empet
March 23, 2020, 12:16pm
#7
Hi @mutia

`width`

and `height`

in the matplotlib ellipse definition are `2*a`

, `2*b`

while `xy =[x_center, y_center]`

.