Skip to content

A Rain Radar Map based on the Rainviewer API for the MagicMirror² platform.

License

Notifications You must be signed in to change notification settings

jalibu/MMM-RAIN-MAP

Repository files navigation

MMM-RAIN-MAP

version Known Vulnerabilities

A Rain Radar Map based on the Rainviewer API for the MagicMirror² platform.

Click here for the Forum Thread.

Contribution welcome.

Support

If you also like this module and want to thank, please rate this repository with a star or donate a small amount that is worth it to you.

Features

  • Displays Rainviewer.com radar layers on OpenStreetMap
    • Every 10 minutes a new weather snapshot is published
    • The snapshots of the last 2 hours are available, which show the weather events of the past
    • Additionally 3 layers are displayed as forecast of the next 30 minutes
  • Option to place multiple markers on map
  • Option for multiple, alternating map positions
  • Option to only show in current rainy weather conditions. Works only together with weather or MMM-OpenWeatherForecast as dependency.
  • (Experimental) Option to hide other modules in case of rain in favor to get more space.

Demo

Screencast.mov

Installing the module

  1. Navigate to the MagicMirror/modules directory and execute the following command

    git clone https://github.com/jalibu/MMM-RAIN-MAP
  2. Add the module configuration into the MagicMirror/config/config.js file (sample configuration):

    {
     module: "MMM-RAIN-MAP",
     position: "top_left",
     config: {
      animationSpeedMs: 400,
      colorScheme: 2,
      colorizeTime: true,
      defaultZoomLevel: 8,
      displayTime: true,
      displayTimeline: true,
      displayClockSymbol: true,
      displayHoursBeforeRain: -1,
      extraDelayLastFrameMs: 1000,
      extraDelayCurrentFrameMs: 3000,
      invertColors: false,
      markers: [
       { lat: 49.41, lng: 8.717, color: "red" },
       { lat: 48.856, lng: 2.35, color: "green" },
      ],
      mapPositions: [
       { lat: 49.41, lng: 8.717, zoom: 9, loops: 1 },
       { lat: 49.41, lng: 8.717, zoom: 6, loops: 2 },
       { lat: 48.856, lng: 2.35, zoom: 6, loops: 1 },
       { lat: 48.856, lng: 2.35, zoom: 9, loops: 2 },
       { lat: 49.15, lng: 6.154, zoom: 5, loops: 2 },
      ],
      mapUrl: "https://a.tile.openstreetmap.de/{z}/{x}/{y}.png",
      mapHeight: "420px", // must be a pixel value (no percent)
      mapWidth: "420px", // must be a pixel value (no percent)
      maxHistoryFrames: -1,
      maxForecastFrames: -1,
      substitudeModules: [],
      updateIntervalInSeconds: 300,
     }
    }

Options

Option Description
animationSpeedMs Determines how fast the frames are played.

Type: int
Default value: 400 (time per frame in milliseconds)
colorizeTime Set true, to colorize history and forecast timestamps.

Type: boolean
Default value: true
colorScheme Set the color scheme for the rain layers. Click here to find your favorite scheme.

Type: number (0 - 8)
Default value: 2 (Universal Blue)
defaultZoomLevel Fallback/default zoom value that is used if it is not explicitly set in a MapPostion.

Type: int
Range: 0 (whole world) - 20 (small building)
Default value: 8
displayTime Set true, to display the time for each frame.

Type: boolean
Default value: true
displayClockSymbol Set true, to display a clock symbol as time prefix.

Type: boolean
Default value: true
displayTimeline Set true, to display a timeline.

Type: boolean
Default value: true
displayHoursBeforeRain This option allows, to show or hide the map depending on the expected or current weather situation. The allowed values and options depend on your weather module which feeds MMM-RAIN-MAP with weather conditions under the hood.

Supported modules and different functionality
Basic options, provided by both modules: If set to 0 the map shows up on rain, if set to -1 the map is always displayed.
  • weather
    When used with type hourly allowes you to use the weather forecast data and to display the map when rain is expected within a defined number of hours by setting a value greater 0.
  • MMM-OpenWeatherForecast
Type: number
Default value: -1
extraDelayLastFrameMs Add an extra delay to pause the animation on the last frame (last available forecast weather situation).

Type: int
Default value: 1000 (time in milliseconds)
extraDelayCurrentFrameMs Add an extra delay to pause the animation on the frame for the current weather situation.

Type: int
Default value: 3000 (time in milliseconds)
invertColors Option to invert the colors of the map tiles. Can be used to display the map in a kind of dark mode.

Type: boolean
Default value: false
markers Optional list of markers on the map.
See examples and Markers-Object documentation below for details.

Type: array[Marker]
Default value: Sample set
mapPositions Required: List of zoom/center positions for the map.
See examples and MapPosition-Object documentation below for details.

Type: array[MapPosition]
Default value: Sample set
mapHeight Height of the map. Must be string with pixels and "px" postfix. Percentage values won't work.

Type: string (pixels)
Default value: '420px'
mapWidth Width of the map. Must be a string with pixels and "px" postfix. Percentage values won't work.

Type: string (pixels)
Default value: '420px'
mapUrl Option to use an alternative map. In most cases you are fine with the default but you can find more maps here.

Type: string
Default value: 'https://a.tile.openstreetmap.de/{z}/{x}/{y}.png'
Alternative uncolored map: 'https://tiles.wmflabs.org/bw-mapnik/${z}/${x}/${y}.png'
maxHistoryFrames Maximum number of history frames. There is one frame every 10 minutes. Setting this to 6 would show history radar layers of the last hour until now. If set to -1, all available history frames are shown.
As of today, the API provides 12 history frames -> 2h.

Type: int
Default value: -1
maxForecastFrames Maximum number of forecast frames. There is one frame every 10 minutes. Setting this to 2 would show forecast radar layers from now to 20 minutes in the future. If set to -1, all available forecast frames are shown.
As of today, the API provides 3 forecast frames -> 30min.

Type: int
Default value: -1
substitudeModules (Experimental) If displayOnlyOnRain is turned on, you can define a list of module names that are hidden in favor of the map.

Type: array[string]
Default value: []
Example: ['MMM-Jast', 'calendar']
timeFormat Option to override the MagicMirror's global time format to 12 or 24 for this module.

Type: int
Default value: [Global Config] or 24
updateIntervalMs Update interval for fetching new radar frames from the RainViewer.com API. (New frames are released every 10 minutes)

Type: int
Default value: 300000 (time in milliseconds)

Marker Object

Option Description
lat Required: Marker's latitude.

Type: float
lng Required: Marker's longitude.

Type: float
color Marker's color.

Possible values: 'black','blue','gold','green','grey','orange','red','violet','yellow'
Type: string

MapPosition Object

Option Description
lat Required: Position's latitude.

Type: float
lng Required: Position's longitude.

Type: float
zoom Either set a zoom level or defaultZoomLevel is used.

Range: 0 (whole world) - 20 (small building)
Type: number
loops Number of loops/iterations until the map moves to the next position. If no number is set, a value of 1 is used.

Type: number

Contribution and Development

This module is written in TypeScript and compiled with Rollup.
The source files are located in the /src folder. Compile target files with npm run build.

Contribution for this module is welcome!

Thanks to