Interactive Scientific Plots with Plotly

Plotly.js produces publication-quality interactive figures with built-in hover, zoom, and pan. Enable it with plotly: true. Math rendering works alongside Plotly when you also set math: true.

Double-Well Potential — 3D Surface

The potential energy function $V(x, y) = (x^2 - 1)^2 + y^2$ creates a characteristic double-well landscape used in molecular dynamics:

Probability Density — Contour Map

Probability density $|\psi_{2,1}(x,y)|^2$ for a 2D quantum harmonic oscillator:

Fundamental Constants — Parallel Coordinates

Comparing six dimensionless physical constants across different unit systems (normalised):

Usage

---
title: My Post With Plotly
plotly: true
---

Place a <div id="myPlot" style="height:400px;"> container in your post, then call Plotly.newPlot('myPlot', data, layout, config) inside a <script> block. Use {responsive: true} in the config for proper resizing on all screen sizes.

Each script block should use the self-polling pattern to wait for Plotly to load:

(function poll() {
  if (typeof Plotly === 'undefined') { setTimeout(poll, 50); return; }
  Plotly.newPlot('myPlot', data, layout, { responsive: true });
})();