Using the built-in API is a quick and simple way to create a chart. However, you'll have to know the exact data structure of the chart you want to create.

Open Flash Chart 2 uses JSON as its data format, which means you can use any method you like to create a JSON string, then pass it to open-flash-chart.swf and viola! you get your chart. If you're not familiar with JSON, that's OK, you'll see that it's quite simple to work with.

For example, the JSON for a pie chart representing browser market share may look like this:

{
  "elements": [
    {
      "type": "pie",
      "alpha": 0.8,
      "animate": [
        {
          "type": "fade"
        },
        {
          "type": "bounce",
          "distance": 5
        }
      ],
      "start-angle": 0,
      "tip": "#percent#",
      "colours": [
        "#a8bc38",
        "#bcd04c",
        "#d0e460",
        "#e4f574",
        "#f8ff88"
      ],
      "values": [
        {
          "value": 66.82,
          "label": "Internet Explorer"
        },
        {
          "value": 22.05,
          "label": "Firefox"
        },
        {
          "value": 8.23,
          "label": "Safari"
        },
        {
          "value": 0.70,
          "label": "Opera"
        },
        {
          "value": 2.20,
          "label": "Other"
        },
      ]
    }
  ],
  "title": {
    "text": "Browser market share",
    "style": "color: #f0f0f0; font-size: 20px"
  },
  "bg_colour": "#202020"
}

That's not too hard to understand, is it?

In order to create the chart using the built-in API, you'll have to know what the JSON for the chart data looks like. The best place to look for each chart element's format is on Open Flash Chart 2 JSON format page.

Once you have the JSON structure in mind, it will be straightforward to create the chart using the built-in API:


$data = array(
  'Internet Explorer' => 66.82,
  'Firefox' => 22.05,
  'Safari' => 8.23,
  'Opera' => 0.70,
  'Other' => 2.20,
);

$pie = ofc_api_element('pie');
$pie->set('alpha', 0.8);

$fade = ofc_api_element('fade');

$bounce = ofc_api_element('bounce');
$bounce->set('distance', 5);

$pie->set('animate', array($fade, $bounce));
$pie->set('start-angle', 0);
$pie->set('tip', '#percent#');
$pie->set('colours', ofc_api_color_theme('green'));

foreach ($data as $key => $value) {
  $item = array(
    'value' => $value,
    'label' => $key,
  );

  $pie->add('value', $item);
}

$chart = ofc_api_chart();

$chart->add('element', $pie);

$title = array(
  'text' => 'Browser market share',
  'style' => 'color: #f0f0f0; font-size: 20px',
);

$chart->set('title', $title);
$chart->set('bg_colour', '#202020');

Now $chart has the same data structure as the JSON string above, you may want to

return $chart;

if it's in a function, or you may want to

print ofc_api_render($chart);

if it's just a quick PHP snippet.

You may want to read on how to render the chart data.

Comments

driki_’s picture

I think one should use print open_flash_chart_api_render($chart);