---
source: https://www.jointjs.com/blog/demo-wednesday-electric-generator
generated: 2026-10-06
format: markdown
---

We've published a new demo: [Electric Generator](https://www.jointjs.com/demos/electric-generator)

Do you want to animate elements in a diagram? You can use the [transition](https://resources.jointjs.com/docs/jointjs/v3.6/joint.html#dia.Element.prototype.transition) feature on the model attributes or write a custom element view and take advantage of the fact that JointJS shapes are made up of SVG, which can be set in motion using the [Web Animation API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API). See the latter approach in action in this [CodePen](https://codepen.io/jointjs/pen/poKRaRY/321e97edc7793da01a46e701324f1557).

See the Pen [JointJS: Electric Generator](https://codepen.io/jointjs/pen/poKRaRY) by JointJS ([@jointjs](https://codepen.io/jointjs))
on [CodePen](https://codepen.io).

For more examples of JointJS and JointJS+, see our [CodePen profile](https://codepen.io/jointjs) and our [official documentation](https://resources.jointjs.com/?_ga=2.157485114.162715808.1653039446-2112624975.1653039446).

To see all the awesome demos we've created so far, check out our [Github Discussions](https://github.com/clientIO/joint/discussions?discussions_q=label%3A%22Demo+Wednesday%22).

Every Wednesday we share diagramming tips, interesting features and news in JointJS. Learn with us, get content delivered straight to your inbox and become a real diagramming pro: