Open Flash Chart это проект Open Source который позволяет разработчикам создавать симпатичные диаграммы для их web страниц или приложений. Данный проект распространяется по лицензии LGPL. Open Flash Chart (http://teethgrinder.co.uk/open-flash-chart-2/) это коллекция Flash апплетов, которые включаются в вашу web страницу, и отображает данные полученные от web сервера.
Новая версия (2) использует данные JSON и ActionScript 3 для генерирования диаграмм. Для создания диаграммы вам необходимо генерировать какие-то закодированные данные JSON и применить немного JavaScript.
Я продемонстрирую процесс создания диаграмм на небольшом примере. Мы будем использовать специальную PHP библиотеку (данная библиотека так же доступна для Perl, Python, Ruby, .NET, Google Web Toolkit и JAVA libraries). Итак, отправляйтесь по адресу http://teethgrinder.co.uk/open-flash-chart-2/, скачайте и разархивируйте код.
Давайте сгенерируем dummy данные JSON:
<?php
include 'php-ofc-library/open-flash-chart.php';
// сгенерировать случайные данные
srand((double)microtime()*1000000);
$max = 20;
$tmp = array();
for( $i=0; $i<9; $i++ ) {
$tmp[] = rand(0, $max);
}
$title = new title( date("D M d Y") );
$bar = new bar();
$bar->set_values( array(1,2,3,4,5,6,7,8,9) );
$chart = new open_flash_chart();
$chart->set_title( $title );
$chart->add_element( $bar );
echo $chart->toString();
?>
Сохраните файл как data.php в той же директории, где вы разархивированию скачанный код.
PHP код сгенерирует данные JSON подобные вот этим:
{"elements":[
{"type":"bar",
"values":[11,3,14,4,17,11,14,17,0]}],
"title":{"text":"Wed May 26 2010"}
}
Теперь дело за HTML и JavaScript:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Open Flash Chart</title>
<link rel="stylesheet" type="text/css" href="my.css">
<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF(
"open-flash-chart.swf", "my_chart", "550", "200",
"9.0.0", "expressInstall.swf",
{"data-file":"data.php"}
);
</script>
</head>
<body>
<div id="container">
<div id="my_chart"></div>
</div>
</body>
</html>
Как вы видете, мы вставили диаграмму на страницу с помощью swfobject (он так же находится в массиве), так что IE не будет заколебывать нас своими сообщениями. В SWFobject мы передаём некие параметры, такие как width (ширина) и height (высота), а так же id элемента в котором будет сгенерирована диаграмма. Сохраните этот файл как index.php всё в той же папке, что и прежде.
Вот и всё. Крутость Open Flash Chart заключается в быстрой скорости работы и лёгком внедрении на сайт.
Дополнительную информацию по более детальному изучению возможностей данной библиотеки, пройдите на сайт: http://teethgrinder.co.uk/open-flash-chart-2/