Adding snow to Google Slides with the help of Google Apps Script

Note: TypeError: Cannot find function insertShape in object Slide error. There is an open issue ticket reporting this problem

If you are looking for a way to add snowflakes to your Google Slide thanks to Google Apps Script this is very easy to do. As Google Apps Script uses a JavaScript syntax there is a lot of existing code you can repurpose. Originally looking to make an animated effect I came across this example on thecodeplayer.com. Whilst animating didn’t work in Google Slides the flake generation was very easy to modify. If you would like to add some snow you can make a copy of this Slides template and follow the instructions. So you can see how it’s done the code is copied at the end of this post.

Happy Google Apps Scripting in 2018!

Make it snow in Google Slides

// @OnlyCurrentDoc

function onOpen() {
  var ui = SlidesApp.getUi();
  // Or DocumentApp or FormApp.
  ui.createMenu('Make it Snow')
      .addItem('Add Flakes', 'drawFlakes')
      .addItem('Clear Flakes', 'clearFlakes')
      .addToUi();
}

// Modified from http://thecodeplayer.com/walkthrough/html5-canvas-snow-effect
function drawFlakes(){
  // just grabbing and adding flakes to the first slide
  var slideDeck = SlidesApp.getActivePresentation();
  var slide = slideDeck.getSlides()[0];
  
  // slide dimensions
  var W = slideDeck.getPageWidth(); // window.innerWidth;
  var H = slideDeck.getPageHeight();
  
  // snowflake particles
  var mp = 500; //max particles
  var particles = [];
  
  // loop through and get a random flake properties
  for(var i = 0; i < mp; i++) {
    particles.push({
      x: Math.random()*W, //x-coordinate
      y: Math.random()*H, //y-coordinate
      r: Math.random()*4+1, //radius
      d: Math.random()//*mp //density
    })
    var p = particles[particles.length-1];
    // insert a flake
    var flake = slide.insertShape(SlidesApp.ShapeType.ARC, p.x, p.y, p.r, p.r);
    // set the fill and border
    flake.getFill().setSolidFill('#ffffff', p.d)
    flake.getBorder().setTransparent();
  }
}

function clearFlakes(){
  var slide = SlidesApp.getActivePresentation().getSlides()[0];
  var flakes = slide.getShapes();
  for (var f = 0; f < flakes.length; f++) {
    // remove only arcs (used to created flakes)
    if (flakes[f].getShapeType() == SlidesApp.ShapeType.ARC){
      flakes[f].remove();
    }
  }
}