Meshviewer (frontend for ffmap-backend) with client history
Switch branches/tags
Nothing to show
Clone or download
Pull request Compare This branch is 9 commits ahead, 89 commits behind rubo77:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
doc README extended May 2, 2015
img forcegraph: optimize background image Apr 2, 2015
js/clientdiagram show lost node status in client diagram May 21, 2015
lib Merge remote-tracking branch 'upstream/master' May 21, 2015
scss insert statistics image in infobox of node May 19, 2015
.travis.yml travis: use config.js.example for CI Apr 20, 2015 Client history added May 2, 2015
Gruntfile.js grunt: record git-revision in index.html Apr 19, 2015
LICENSE change LICENSE to AGPL 3 Apr 11, 2015 Merge remote-tracking branch 'upstream/master' May 21, 2015
app.js map: draw only labels present on map using rtrees Apr 19, 2015
bower.json Client history added May 2, 2015
config.js.example config: introduce maxAge setting Apr 26, 2015
helper.js helper/has_location: validate coordinates (+-90, +-180) Apr 10, 2015
index.html Client history added May 2, 2015
package.json grunt: record git-revision in index.html Apr 19, 2015
style.css switch to sass Mar 31, 2015

Meshviewer (with Client History)

This fork adds client history diagrams to the node detail view.

Meshviewer is a frontend for ffmap-backend.




  • npm
  • bower
  • grunt-cli
  • Sass (>= 3.2)

Installing dependencies

Install npm and Sass with your package-manager. On Debian-like systems run:

sudo apt-get install npm ruby-sass

Execute these commands on your server as a normal user to prepare the dependencies:

git clone
cd meshviewer
npm install
npm install bower grunt-cli
node_modules/.bin/bower install


Copy config.js.example to config.js and change it to match your community.

dataPath (string)

dataPath must point to a directory containing nodes.json and graph.json (both are generated by ffmap-backend). Don't forget the trailing slash! Data may be served from a different domain with CORS enabled. Also, GZip will greatly reduce bandwidth consumption.

siteName (string)

Change this to match your communities' name. It will be used in various places.

mapSigmaScale (float)

This affects the initial scale of the map. Greater values will show a larger area. Values like 1.0 and 0.5 might be good choices.

showContact (bool)

Setting this to false will hide contact information for nodes.

maxAge (integer)

Nodes being online for less than maxAge days are considered "new". Likewise, nodes being offline for less than than maxAge days are considered "lost".

nodeInfos (array, optional)

This option allows to show client statistics depending on following case-sensitive parameters:

  • name caption of statistics segment in infobox
  • href absolute or relative URL to statistics image
  • thumbnail absolute or relative URL to thumbnail image, can be the same like href
  • caption is shown, if type is link (no thumbnail in infobox)

To insert current node-id in either href, thumbnail or caption you can use the case-sensitive template string {NODE_ID}.

Examples for nodeInfos:

"nodeInfos": [
  { "name": "Clientstatistik"
    "href": "nodes/{NODE_ID}.png",
    "thumbnail": "nodes/{NODE_ID}.png",
    "caption": "Knoten {NODE_ID}"
  { "name": "Uptime",
    "href": "nodes_uptime/{NODE_ID}.png",
    "thumbnail": "nodes_uptime/{NODE_ID}.png",
    "caption": "Knoten {NODE_ID}"

In order to have statistics images available, you have to run the backend with parameter --with-rrd or generate them in other ways.

Configure Client History

  • configure the scripts in py/
  • call them regularly via crontab or something similar:

Example: /opt/meshviewer/py/ < /var/www/meshviewer/json/nodes.json


Just run the following command from the meshviewer directory:


This will generate build/ containing all required files.