Skip to content
A module for the MagicMirror project which creates a SVG bar chart based on a list gathered from a json request.
JavaScript CSS
Branch: master
Clone or download
Latest commit 07f79e5 Jun 24, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.gitattributes Initial commit Apr 28, 2018
MMM-JsonGraph.css Black text May 6, 2018
MMM-JsonGraph.js Calculate height Jun 24, 2018
README.md Add more info May 19, 2018
example1.png Update readme file May 16, 2018
node_helper.js Add debug info May 8, 2018

README.md

MMM-JsonGraph

A module for the MagicMirror project which creates a SVG bar chart based on a list gathered from a json request.

Example 1

End result:

Raw json response:

{
    "fitbitWeekOverviewItems": [
        {
            "steps": 10256,
            "displayText": "Today\t10256 steps"
        },
        {
            "steps": 13214,
            "displayText": "Friday\t13214 steps"
        },
        {
            "steps": 10554,
            "displayText": "Thursday\t10554 steps"
        },
        {
            "steps": 12942,
            "displayText": "Wednesday\t12942 steps"
        },
        {
            "steps": 9478,
            "displayText": "Tuesday\t9478 steps"
        },
        {
            "steps": 10690,
            "displayText": "Monday\t10690 steps"
        },
        {
            "steps": 12792,
            "displayText": "Sunday\t12792 steps"
        }
    ]
}

Configuration:

{
	module: 'MMM-JsonGraph',
	position: 'top_right',
	header: 'Fitbit steps last 7 days',
	config: {
		url: 'https://xyz/abc/get.json',
		arrayName: 'fitbitWeekOverviewItems',
		xAxisName: 'steps',
		textValue: 'displayText',
		updateInterval: 60000
	}
},

Installation

git clone https://github.com/timdows/MMM-JsonGraph.git

Config Options

Option Default Description
url "" The full url to get the json response from
arrayName null Define the name of the variable that holds the array to display
xAxisName "" Should be of the type number in order to determine the width of the bar
textValue "" The name of the variable in the array that holds text to display over the bar
updateInterval 15000 Milliseconds between the refersh
You can’t perform that action at this time.