Only now I realized that the [previous support](https://alshedivat.github.io/al-folio/blog/2021/distill/#interactive-plots) for [plotly](https://plotly.com/) was enabled by exporting an HTML from python code. This adds support for [plotly.js](https://plotly.com/javascript/). --------- Signed-off-by: George Araújo <george.gcac@gmail.com>
1.6 KiB
1.6 KiB
| layout | title | date | description | tags | categories | chart | ||
|---|---|---|---|---|---|---|---|---|
| post | a post with plotly.js | 2025-03-26 14:24:00 | this is what included plotly.js code could look like | formatting charts | sample-posts |
|
This is an example post with some plotly code.
```plotly
{
"data": [
{
"x": [1, 2, 3, 4],
"y": [10, 15, 13, 17],
"type": "scatter"
},
{
"x": [1, 2, 3, 4],
"y": [16, 5, 11, 9],
"type": "scatter"
}
]
}
```
Which generates:
{
"data": [
{
"x": [1, 2, 3, 4],
"y": [10, 15, 13, 17],
"type": "scatter"
},
{
"x": [1, 2, 3, 4],
"y": [16, 5, 11, 9],
"type": "scatter"
}
]
}
Also another example chart.
```plotly
{
"data": [
{
"x": [1, 2, 3, 4],
"y": [10, 15, 13, 17],
"mode": "markers"
},
{
"x": [2, 3, 4, 5],
"y": [16, 5, 11, 9],
"mode": "lines"
},
{
"x": [1, 2, 3, 4],
"y": [12, 9, 15, 12],
"mode": "lines+markers"
}
],
"layout": {
"title": {
"text": "Line and Scatter Plot"
}
}
}
```
This is how it looks like:
{
"data": [
{
"x": [1, 2, 3, 4],
"y": [10, 15, 13, 17],
"mode": "markers"
},
{
"x": [2, 3, 4, 5],
"y": [16, 5, 11, 9],
"mode": "lines"
},
{
"x": [1, 2, 3, 4],
"y": [12, 9, 15, 12],
"mode": "lines+markers"
}
],
"layout": {
"title": {
"text": "Line and Scatter Plot"
}
}
}