RGraph: HTML5 canvas graph library - LED Grid documentation

The LED grid can be used to represent simple letters and numbers.

The example file is here.

<script>
    window.onload = function ()
    {
        var led = new RGraph.LED('myCanvas', '456461');
        led.Set('chart.dark', '#666');
        led.Set('chart.light', 'rgba(255,255,255,1)');
        led.Draw();
    }
</script>

Available properties

You can use these properties to control how the LED grid apears.

chart.dark Color of the darkened (ie unlit) lights
Default: #eee
chart.light Color of lit lights
Default: #f66
chart.background The color of the background.
Default: white
chart.zoom.mode Can be used to control whether the zoom is in thumbnail or canvas mode. Possible values are: thumbnail and canvas.
Default: canvas
chart.zoom.factor This is the factor that the graph will be zoomed by (bigger values means more zoom)
Default: 1.5
chart.zoom.fade.in Whether the zoomed canvas fades in or not. This also can be used to control the fade in for the zoom in thumbnail mode.
Default: true
chart.zoom.fade.out Whether the zoomed canvas fades out or not. This also can be used to control the fade in for the zoom in thumbnail mode.
Default: true
chart.zoom.hdir The horizontal direction of the zoom. Possible values are: left, center, right
Default: right
chart.zoom.vdir The vertical direction of the zoom. Possible values are: up, center, down
Default: down
chart.zoom.delay The delay (in milliseconds) between frames.
Default: 50
chart.zoom.frames The number of frames in the zoom animation.
Default: 10
chart.zoom.shadow Whether or not the zoomed canvas has a shadow or not.
Default: true
chart.zoom.thumbnail.width When the zoom is in thumbnail mode, this is the width (in pixels) of the thumbnail.
Default: 75
chart.zoom.thumbnail.height When the zoom is in thumbnail mode, this is the height (in pixels) of the thumbnail.
Default: 75