Google Charts and Rebol

Important Google have deprecated the Google Image Charts API and will cease to work [at some point].

Red The Charts script has been updated to work with Red (at the time of writing v0.6.3). Examples here are written for Rebol 2 and may need tweaks to work with Red.

• Google Charts for Rebol

There’s very few ways to conveniently include a chart in a web page or document than to use the Google Charts API.  However, it’s really not that much fun stitching together the constituent parts of a good looking chart.  Enter Rebol.

Usage

This script allows you to build Google Charts using more familiar, readable and malleable terms than editing the oft cryptic URL.

The CHART function returns a URL that is ready to use.  It can be embedded in HTML, copied and pasted to a browser or included in a Rebol/View application.  Indeed, it’s easy enough to view any of these examples in Rebol/View:

view layout [image chart [...]]

In Red, you can use COMPOSE:

view compose [image (chart [...])]

Basic Line Chart

‘Line’ is the default Chart Type.  If you only provide data, you will get the resulting image:

chart [data: [10 95 60 95 10]]

Basic Bar Chart

Types can be specified, either by the preset words (line, line/xy, sparkline, bar, bar/horizontal, pie, pie/flat, map) or by the chart types set in the Google API:

chart [type: 'bar data: [10 95 60 95 10] bars: [55 8]]

Data Sets

Data can be supplied as a single or multiple sets.  The default scale is 0-100.

data: [1 2 3 4]
data: [[1 2] [3 4] [5 6]]

For simple data encoding, the scale is 0-1:

data: [0.1 0.2 0.3]
simple: true

Styles

Basic styles can be supplied:

color: red
area: [color solid 255.153.0]
area: [[color solid 255.140.204][chart solid 0.204.204]]
bars: [40 5 10] ; width space group-space

Markers

Work in progress: allows you to add various markers to a chart:

markers: [
    financial 0.0.204 0 1x4 10
    circle 204.0.0 0 1x-1 3
]

See Google’s Compound Charts page for more info on how markers work.

Examples

Generic Pie Chart:

chart [
    title: "Chart Example"
    type: 'pie
    size: 350x150
    labels: ["Red" "Green" "Blue"]
    data: [50 40 10]
    colors: reduce [red green blue]
    area: [color solid 244.244.240]
]

Example in response to Generate a Google PIE Chart:

do http://reb4.me/r/google-charts

clipdata: {Adsense Revenue^-300
Sponsors^-500
Gifts^-50
Others^-58}

chart [
    title: "Revenue"
    size: 650x300
    type: 'pie

    ; extract raw data
    data: parse/all clipdata "^/^-"
    labels: extract data 2
    data: extract/index data 2 2

    ; format data and labels
    sum: 0
    forall data [sum: sum + data/1: to-integer data/1]
    forall data [change data round 100 * data/1 / sum]
    forall labels [
        labels/1: rejoin [labels/1 " " data/(index? labels) "%"]
    ]
]