npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

node-red-contrib-maps

v0.2.2

Published

Node-RED Maps node

Downloads

76

Readme

node-red-contrib-maps

A Node-RED node implemented by Openlayers 5 to show Iot measures

Node-RED Maps Dashboard

Description

This node package permit to use Openlayers map from Node-RED. The objective is create a new url for the map created, this url path could be configured and updated at runtime.

For the latest updates see the CHANGELOG.md

Installation

npm install node-red-contrib-maps --save

Map configuration

The Map attributes are:

  • Path: The Map Url to be access. An example where path is MAP could be:
http://localhost:1880/MAP
  • Tittle: The map title
  • Payload: The map dataset object

The map payload attributes are:

  • channel: The channel legend
  • dataset: The map dataset

The payload dataset attributes are:

  • lon: longitude point
  • lat: latitude point
  • description: descripion value
  • value: value point
  • unit: value unit
  • color: color marker

Read node help to check the dataset structure for each chart. A Europe Temperature Map dataset could be like this:

[
    {
        "channel": "TEMP",
        "dataset": [
            {
                "lon": -3.703548,
                "lat": 40.417204,
                "name": "9fj04r",
                "description": "Temperature in Madrid",
                "value": 20.5,
                "unit": "°C",
                "iconColor": "Blue"
            },
            {
                "lon": -0.075906,
                "lat": 51.508319,
                "name": "04jgpe",
                "description": "Temperature in London",
                "value": 19,
                "unit": "°C",
                "iconColor": "Yellow"
            },
            {
                "lon": 2.34294,
                "lat": 48.859271,
                "name": "lfj82k",
                "description": "Temperature in Paris",
                "label": "Alert for strong frosts",
                "value": 11.7,
                "unit": "°C",
                "iconColor": "Red"
            },
            {
                "lon": 13.402786,
                "lat": 52.517987,
                "name": "0lw233",
                "description": "Temperature in Berlin",
                "value": 10.8,
                "unit": "°C",
                "iconColor": "Red"
            }
        ]
    }
]

Dependencies

Server side

Client side

  • socker.io-client: Socket.io client side
  • jquery: Multipurpose javascript library
  • bootstrap4: Build responsive, mobile-first projects on the web
  • popper.js: A kickass library used to manage poppers in the web applications
  • Openlayers: OpenLayers makes it easy to put a dynamic map in any web page
  • moment: Parse, validate, manipulate, and display dates and times in JavaScript.
  • jsPDF: The leading HTML5 client solution for generating PDFs

Example

Under example folder you have a json flow to be imported in your node-red instance to test the nodes.