BOM Radar

by luenwarneke

HTML

<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css">

<div id="map" style="width: 500px; height: 500px;"></div>

JavaScript

var coeff = 1000 * 60 * 10; // every 10 min
var timeout = 500; // frame change every 3 secs
var frameCount = 10; // 6 instances of images shown on bom site
var run = true;
var radarLayers = [];
var times = [];
var info;
L.TileLayer.bomRadar = L.TileLayer.extend({
	options: {
    //maxNativeZoom: 10,
		//baseUrl: "https://api.weather.bom.gov.au/v1/rainradar/tiles/{time}/{z}/{x}/{y}.png",
		attribution: 'Weather from <a href="https://weather.bom.gov.au/">BOM</a>'
	},
  onAdd: function(map) {


    // Setup
    run = true;
    for (i = 0; i < frameCount; i++) {
    	var time = getRadarTime(i);
      //console.log(i+" "+time);
    	times.push(time);
      //times[i] = time;
    	radarLayers[i] = L.tileLayer("https://api.weather.bom.gov.au/v1/rainradar/tiles/"+time+"/{z}/{x}/{y}.png", {
    		layers: time,
    		format: 'image/png',
    		transparent: true,
    		opacity: 0.0,
        minNativeZoom: 5,
        maxNativeZoom: 10
    	});
      radarLayers[i].addTo(map).bringToFront();
    }

    // Add Date Control
    info = L.control.radarinfo({ position: 'bottomright' });
    info.addTo(map);

    function getRadarTime(i) {
      var x = 1;
      if (Number(new Date().getUTCMinutes().toString().slice(-1)) <= 5) { // BOM image isn't available straight away so wait 5 min.
        //console.log(Number(new Date().getUTCMinutes().toString().slice(-1)));
        //console.log("x=0");
        x = 0;
      }
      var date = new Date(new Date()-(coeff*((frameCount-x)-i)));
      var year = date.getUTCFullYear().toString();
      var month = (date.getUTCMonth() + 1).toString().padStart(2, '0');
      var day = date.getUTCDate().toString().padStart(2, '0');
      var hours = date.getUTCHours().toString().padStart(2, '0');
      var minutes = new Date(Math.floor(date.getTime() / coeff) * coeff).getUTCMinutes().toString().padStart(2, '0');
      return year+month+day+hours+minutes;
    }

    function updateRadar(i) {
      var time = getRadarTime(i);
     ...