Plotly.js: Support plotting to Smith Charts

[kiranshila]

Hey everyone!

I think adding support to plot to Smith Charts would be extremely beneficial to everyone working in RF/Microwave engineering.

It basically is a modified polar plot with a Mobius transform mapping complex numbers onto a polar plane.

There are several implementations across a few plotting backends: PGFPlots has it in LaTeX, PySmithChart and Matplotlib have it in Python, it's native in MATLAB, and InspectDR has it in Julia. But none of them implement interactability as well as the leading CAD software which utilizes Smith Charts in design work.

I think Plotly is perfect for this as it can provide a true cross-platform interactive means by which to visualize complex data for radio engineers.

I am more than happy to do a PR, I just need some guidance on how to start working on what is effectively a new axis type.

[joshuaprewitt]

I agree that it would be really useful to have a smith chart, which can be used when analyzing RF waveforms.

https://cds.cern.ch/record/1417989/files/p95.pdf

[rfriedma]

I would also like to see smith charts in plotly. I use plotly successfully for displaying engineering data and it would be great to provide a consistent experience to my users for this visualization as well.

[etpinard]

Merged into https://github.com/plotly/plotly.js/issues/2221 - until this gets more traction.

[lstuemke]

I have implemented Smith Charts using Plotly for my own personal use. I would love to help add this feature to Plotly if possible. Here are some screenshots of what I've done.

One with increased resolution:

[kiranshila]

@lstuemke - Awesome!!! @Gloamglozer and I are working on a PR. Would you like to join? This would be an excellent addition to Plotly and you seem to have a lot of the groundwork figured out.

[lstuemke]

Yeah absolutely, I'll help out any way I can.

[jensb]

+1

I'd love to have this as well.

[samuel-schuepbach]

Were you able to add this to plotly? This feature would be extremely helpful for us as well.
Thanks

[Gloamglozer]

Luke, jensb, and Samuel,

So far I've just sketched out the attributes of a smith datatype as per

the core developers advice. Still waiting on their feedback

Check out 'smith_api.md' in the root of the project here
https://github.com/Gloamglozer/plotly.js/tree/smith

If you guys are interested in being in the loop with the plot.ly guys, just
send me your emails and i'll get you guys in on the email chain so you can
see their thoughts.

-- Eric

On Wed, Apr 15, 2020 at 10:44 AM Samuel Schüpbach [e-mail]
wrote:

Were you able to add this to plotly? This feature would be extremely
helpful for us as well.
Thanks

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/plotly/plotly.js/issues/4074#issuecomment-614082369,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AFZA25JK7JUJGIZ4L3T5523RMXB4LANCNFSM4IGEGMWA
.

--
--Eric Valentino

[lstuemke]

@Gloamglozer , I would like to help out with this but not sure the best way to send you my email. I don't really want to post it here. Suggestions?

[lstuemke]

In the meantime, if you just want to visualize your data you can always plot your mag/angle data using Plotly's Polar Charts. They won't have the Smith gridlines, but it could be a useful workaround before Smith is released.

[Gloamglozer]

I don't really have a pressing need for them right now, I just think it
would be cool to include them. I'm thinking of maybe using them in a
website down the road.

Concerning communication, maybe we can communicate with those guys over
GitHub, i know it has that KanBan function now, not sure if there's a good
chat function. There was talk of a Slack channel, it would be cool to have
some sort of project tracking with whatever we use.

I'll try and revive the issue with them after i'm off work today.

For now, here is the content of Nicholas Krutchen's email to me from a
while back:

---

Hi folks! (moving Jack to bcc, adding Étienne even though he's on vacation)

I'm glad you're excited to contribute! This seems like a fun and
challenging problem indeed! Probably the best place to start would be a
call with someone on our Plotly.js team, and our tech-lead is on holiday
until the 27th, so it might be best to wait until he's back to kick things
off. I'm also cc'ing Alex, who has more experience than me in adding new
subplot types, in case he wants to chime in.

In terms of high-level guidance, I would say that you should be thinking
along the lines of adding two things to the library: a subplot type and a
trace type.

1. First of all a new subplot type called "smith", similar to how we
   have a subplot type called "polar", so this means a set of objects in the
   layout part of the schema to control and configure the subplot. This will
   be the most challenging part, as you'll also need to design and implement
   all of the interactions in terms of what happens when the user clicks and
   drags in the plot: the zooming and panning interactions etc.
2. In tandem with that, you'll need a new kind of trace called
   "scattersmith", similar to how we have "scatterpolar", which will draw
   itself onto a given smith-type subplot. This means you'll be able to
   have, say, 2 smith subplots in a figure, with each of them having 2
   scattersmith traces on them, for a total of 4 traces i.e. 4 legend items.

If you can start studying how scatterpolar traces and polar subplots
interact, you'll get a sense of what's involved. We have a few different
types of subplots, each of which has a scatter-like trace that targets it,
and there is a lot of reuse across these components, which is both a
blessing and a curse: you get a lot for free, but you need to really grok
how things fit together.

I would recommend that once you've had a chance to study the
polar/scatterpolar pairing, you could write up a short proposal for what
the schema of attributes would look like for these new objects which we
could discuss on the call. I.e. once this is implemented, what would end up
in this page https://plot.ly/javascript/reference/, similar to the
scatterpolar https://plot.ly/javascript/reference/#scatterpolar and polar
https://plot.ly/javascript/reference/#layout-polar sections? This is
usually how we like to start major new projects: by designing the external
API first (usually keeping it as similar as possible to pre-existing
elements) and then seeing what can be reused and what net-new code needs
writing. This API proposal usually ends up guiding the test plan, as we'll
want to have tests for most or all of the API.

In terms of the workflow for contributing, a good starting point is
our contributing
guide, https://github.com/plotly/plotly.js/blob/master/CONTRIBUTING.md and
Mojtaba can maybe walk you through some pull requests that added new
trace-types https://github.com/plotly/plotly.js/pull/2954 (which we do
reasonably often, we have about 40 now) and a new subplot-type
https://github.com/plotly/plotly.js/pull/2200 (which is quite rare, as we
only have a handful) to give you a sense of what's needed here.

Cheers,
Nicolas

On Wed, Apr 15, 2020 at 11:23 AM Luke Stuemke [e-mail]
wrote:

In the meantime, if you just want to visualize your data you can always
plot your mag/angle data using Plotly's Polar Charts
https://plotly.com/javascript/polar-chart/. They won't have the Smith
gridlines, but it could be a useful workaround before Smith is released.

[image: image]
https://user-images.githubusercontent.com/49922901/79354954-13b1ab00-7f0b-11ea-9aa8-19e824e4cebf.png

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/plotly/plotly.js/issues/4074#issuecomment-614105151,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AFZA25IDF6EKHKQV5W2OEITRMXGOZANCNFSM4IGEGMWA
.

--
--Eric Valentino

[samuel-schuepbach]

We are currently using plotly plots quite extensively in our application and are planning to use some sort of smith chart feature in the near future.
So it would be perfect if we could use a plotly smith chart as well.

Keep me up to date if I can help you contributing in some way.

As for the communication, a slack channel might atually be quite useful.

Thank you for the updates.

[Gloamglozer]

Cool! I will make sure you are in the conversation, we’ll take opinions on
how to collaborate in a Github issue maybe. Seeming like it makes sense to
consolidate effort as much as possible

On Wed, Apr 15, 2020 at 12:10 PM Samuel Schüpbach [e-mail]
wrote:

We are currently using plotly plots quite extensively in our application
and are planning to use some sort of smith chart feature in the near future.
So it would be perfect if we could use a plotly smith chart as well.

Keep me up to date if I can help you contributing in some way.

As for the communication, a slack channel might atually be quite useful.

Thank you for the updates.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/plotly/plotly.js/issues/4074#issuecomment-614132718,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AFZA25MYUHJ2EOSWZ2Z6JBDRMXMA5ANCNFSM4IGEGMWA
.

>

--Eric Valentino

[Gloamglozer]

@lstuemke @rfriedma @samuel-schuepbach @jensb @kiranshila @ilPesce41 @nicolaskruchten

Made a slack for discussion of this here:
https://join.slack.com/t/plotly-js-smith/shared_invite/zt-dlpgredf-L1hhcbnxOQZp0ZmVyiA1_A

Thinking we can just track progress using GithubProjects here:
https://github.com/Gloamglozer/plotly.js/projects/1

As initially suggested by @nicolaskruchten the next step is to sketch out the API for the new smith plot type. We should all have a look and agree on the setup of the API, then have a call with the plotly guys to make sure it looks good to them too and make sure what we're proposing will work well with everything else.

After the API is done division of work will be a lot easier and we will all have the big picture in mind

[nicolaskruchten]

Hi @Gloamglozer, I'm sorry I haven't been able to respond to your email yet. I will try to get to it this week and get this train moving again!

[ajundi]

I have implemented Smith Charts using Plotly for my own personal use. I would love to help add this feature to Plotly if possible. Here are some screenshots of what I've done.

One with increased resolution:

Hi Luke,
Would it be possible to add this to plotly or post the source code in your repo so I can use it? I don't know how to create something like this. Thanks :)

[jensb]

This looks beautiful. I'd give it +j\infinity stars to be included.

[lstuemke]

This totally fell off my radar @jensb. Let me get back in touch with @Gloamglozer and see where we're at.

Edit: I'm not sure how to get in contact with any of you. Don't particularly want to post my email address here. @kiranshila, @Gloamglozer, do you have a method of communication setup for this project?

[vik-s]

Hey, was the smith chart ever incorporated into plotly?

[Gloamglozer]

No, it looks like @ajundi had a good start. Adding smith charts was a big
ambitious for me not knowing JS (coming from C and Python), suggest he
makes a fork and PR, you can mention me in that fork

On Tue, Nov 10, 2020 at 9:01 AM Vikram Sekar [e-mail]
wrote:

Hey, was the smith chart ever incorporated into plotly?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/plotly/plotly.js/issues/4074#issuecomment-724720384,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AFZA25KDEWHLI7PHIKVRCXTSPFBT3ANCNFSM4IGEGMWA
.

--
--Eric Valentino

[nicolaskruchten]

@ajundi that looks really amazing! If you want to submit a pull request so we can see how you did it, we'd be happy to review it and work towards getting it incorporated into Plotly!

cc @alexcjohnson check this out!

[lstuemke]

@nicolaskruchten - Hi Nicolas, it looks like @ajundi was just referencing my post to ask me a question. Anyway, I'd love to help get this incorporated into Plotly.

[nicolaskruchten]

@lstuemke right, my mistake, sorry! Either way, if we can get this into a PR we'd love to help.

[vik-s]

Exciting! I would love to see this in plotly. My lack of JS know-how may not help development, but if I can help in testing in python, please let me know. I'm writing a streamlit app to plot RF sparameter data, and plotly would be a prime plotting tool. Smith charts would be awesome obviously!