Put a pain map inside your own page
The embed is the same 3D head and the same legend as the app, with the editor removed. Use it to show a reader what a migraine looks like next to a sinus infection, to let them turn the skin translucent and see how deep a pain sits, or to publish a map somebody made of their own pain. Configure it below and copy the snippet. Nothing is uploaded: everything the embed shows travels in the URL you paste.
Live preview
Paste this into your page
Driving it from your own page
The embed answers postMessage, so your page's own buttons can steer it: step a
reader through a pattern paragraph by paragraph, or turn on x-ray exactly when the text
starts talking about depth. Press these to drive the preview above.
The whole contract
URL settings
| map | A share-link payload: the part after #m= in a HeadPain link. |
|---|---|
| preset | A pattern from the library, for example preset=cluster-headache. |
| demo | A demo map, for example demo=demo-combo. |
| xray | 1 starts with the skin translucent. |
| isolate | Show one pain alone, by name or by number starting at 0. |
| legend | compact (default), full, or off. |
| controls | view (default) or none. |
| rotate | auto turns the head until the visitor touches it. Ignored when the visitor's system asks for reduced motion. |
| spin | Seconds per revolution when rotating. Default 24. |
| camera | theta,phi,distance, for example camera=2.4,1.4,4.2. |
| title | Caption text, or off to hide the caption bar. |
| bg | Six-digit hex background, to blend with your page. |
Messages you can send
| headpain:xray | { on: true } |
|---|---|
| headpain:isolate | { pain: "Migraine" }, a number, or null for all |
| headpain:camera | { camera: [theta, phi, distance] } |
| headpain:reset | back to the front view |
| headpain:state | ask it to report what it is showing |
Messages it sends back
Every message carries source: "headpain". Types are ready,
state, pain (the visitor picked one), zone (the
visitor hovered an area of the head) and error.
What it will not do
An embed never reads the visitor's saved diary. A HeadPain widget on your page can only show what you put in its URL, so it cannot expose a reader's own private maps.