Build a plot from JSON with plotly.js

Question

I have built a plot using plotly.py and convert it to JSON file:

plotly.io.write_json(fig, 'name.json')

After creating the JSON file I need to build the same plot using plotly.js as well. How can build it from generated JSON file? File consists of two main parts. first part is data (parameter of about 100+ lines from plot) and second part is layout of plot. Is there any standard function in plotly.js to build a plot from JSON generated by plotly rules?

I'm not a python expert, but you should be able to parse the JSON to a dictionary via json.loads and then pass that dictionary to plotly via plotly.io.show(dict) as in the first example here: plotly.com/python/creating-and-updating-figures — mit
– mit, Commented Mar 24, 2020 at 9:38

Stigson · Accepted Answer · 2022-04-22 17:43:51Z

2

This is possible in javascript by first importing your file and then grabing the data, layout and config keys.

import testData from './name.json';

Plotly.newPlot('myDiv', testData.data, testData.layout, testData.config);

<head>
    <!-- Load plotly.js into the DOM -->
    <script src='https://cdn.plot.ly/plotly-2.11.1.min.js'></script>
</head>

<body>
    <div id='myDiv'><!-- Plotly chart will be drawn inside this DIV --></div>
</body>

answered Apr 22, 2022 at 17:43

Stigson

211 silver badge3 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Community Over a year ago

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.

Collectives™ on Stack Overflow

Build a plot from JSON with plotly.js

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related