Pulsating Points with CindyJS

https://github.com/CindyJS/CindyJS/issues/722

by Kajus

HTML

<script src="https://cindyjs.org/dist/latest/Cindy.js"></script>
<script src="https://cindyjs.org/dist/v0.8.7/Cindy.js"></script>
<div id="CSCanvas"></div>

<script>
CindyJS({
  scripts: "cs*",
  ports: [{
    id: "CSCanvas",
    axes: false,
    width: 500,
    height: 500,
    transform: [{
      visibleRect: [-1, 7, 14, -7]
    }],
    grid: 1,
  }],
  autoplay: true,
  geometry: [
    {name:"A", kind:"P", type:"Free", pos:[0, 0]},
    {name:"P", kind:"P", type:"Free", pos:[3, 1], color:[0,0,0]},
    {name:"Q", kind:"P", type:"Free", pos:[3, 3], color:[0,0,0]},
  ],
});

</script>
<script id="csinit" type="text/x-cindyscript">
</script>

<script id="csdraw" type="text/x-cindyscript">

  pv = mod(seconds(),1);
  forall([P,Q], point,
  	fillcircle(point, pv*.5, color->[0,0,0], alpha->1-pv);      
  );
  
</script>