- GraidleChart contains a free PHP graphing class that creates and displays several types of graphical diagrams: vertical or horizontal bar, line, spider, or pie graphs for incorporation into a website or application.
You must create an array (or several arrays) of numeric values (data points), and optional, another array with names /numbers for the other axis, in the same order to be associated with the values from the first array. Then you can use graidle class to generate a PNG chart of your data.
GraidleChart can auto adjust the scale and axis of the graph with positive and /or negative numbers.
- Download GraidleChart.
- A Newer PHP library for creating graph and plots in php it is to this page:
https://coursesweb.net/php-mysql/jpgraph-graph-charts-plots-php
Examples:
1. Simple vertical bars that show the number of points of five names.
<?php
include('graidlechart/graidle.php');

// array with data points for each name
$data = array('N_1'=>12, 'N_2'=>23.5, 'N_3'=>8, 'N_4'=>9.8, 'N_5'=>21);

// set 2 numeric arrays, one with names (for x-axis), another with the points (y-axis)
$names = array_keys($data);
$points = array_values($data);

// create object of graidle class (define Title)
$graph = new graidle('Number of points');
$graph->setColor('#a7b8ed');
$graph -> setValue($points,'b'); // set series values, type of graph (b=bar)

$graph -> setSecondaryAxis(1,0); // display secondary x-axis grid
$graph -> setWidth(300); // graphic chart width
$graph -> setHeight(180); // graphic chart height
$graph -> setXValue($names); // add the names to x-axis
$graph->setDivision(10); // set division on scale axis
$graph->setBgCl('#efefef'); // background color
$graph -> setExtLegend(); // to show values to each bar

$graph -> create(); // create chart
$graph -> carry(); // outputs the graph

/*
 To save the chart, use carry2file() method, with: 'dir_name', 'file_name' (without extension)
 Ex.: save "graphic_chart_1.png" in directory "charts/"
 $graph->carry2file('charts/', 'graphic_chart_1');
*/
?>

Result:
Graphic Chart simple bar

2. Graphic chart with two lines that show the progress of the accesses, and visitors number in a week.
<?php
include('graidlechart/graidle.php');

// array with number of accesses, and visitors in a week
$acc = array(1200, 1558, 1678, 1500, 1625, 1480, 998);
$vis = array(310, 288, 350, 305, 455, 282, 255); 

// create object of graidle class (define Title)
$graph = new graidle('Accesses & Visitors');
$graph->setColor('#a7b8ed');
$graph -> setValue($acc,'l', 'Accesses'); // set line (l=line) for accesses (adding with legend)
$graph -> setValue($vis,'l', 'Visitors'); // set line for visitors

$graph -> setSecondaryAxis(1,0); // display secondary x-axis grid
$graph -> setWidth(450); // graphic chart width
$graph -> setHeight(180); // graphic chart height
$graph->setBgCl('#fefeff'); // background color

$graph -> create(); // create chart
$graph -> carry(); // outputs the graph
?>

Result:
Graphic Chart Line

3. Pie graphic chart that represents the number of tourist, by countries.
<?php
include('graidlechart/graidle.php');

// array with number of tourists, by countries
$data = array('USA'=>5500, 'Brazil'=>3000, 'France'=>2800, 'Spain'=>3700, 'Italy'=>1400); 

// set 2 numeric arrays, one with countries (for legend), another with tourists number
$cnt = array_keys($data);
$tor = array_values($data);

// create object of graidle class (define Title)
$graph = new graidle('Representation tourists 2012');
$graph->setColor('#a7b8ed');
$graph -> setValue($tor,'p'); // set pie chart (p=pie)

$graph -> setLegend($cnt); // to add a legend
$graph -> setExtLegend(2); // to display percentage, and numbers
$graph -> setWidth(420); // graphic chart width

$graph -> create(); // create chart
$graph -> carry(); // outputs the graph
?>

Result:
Pie Graphic Chart

- More examples, and documentation you can find in the archive with GraidleChart.
graidle Web Site.

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which tag defines the clickable areas inside the image map?
<map> <img> <area>
<img src="image.jpg" usemap="#map1">
<map name="map1">
  <area shape="rect" coords="9, 120, 56, 149" href="#">
  <area shape="rect" coords="100, 200, 156, 249" href="#">
</map>
Which CSS property defines what is done if the content in a box is too big for its defined space?
display overflow position
#id {
  overflow: auto;
}
Click on the event which is triggered when the mouse is positioned over an object.
onclick onmouseover onmouseout
document.getElementById("id").onmouseover = function(){
  document.write("Have Good Life");
}
Indicate the PHP variable that contains data added in URL address after the "?" character.
$_SESSION $_GET $_POST
if(isset($_GET["id"])) {
  echo $_GET["id"];
}
GraidleChart Create Graphic Charts

Last accessed pages

  1. Multiple Select Dropdown List with AJAX (15558)
  2. Moving html element to a random direction (84)
  3. XHTML References - Old (15)
  4. Star shapes with CSS (4464)
  5. Get and Modify content of an Iframe (12618)

Popular pages this month

  1. Read Excel file data in PHP - PhpExcelReader (387)
  2. Register and show online users and visitors (355)
  3. PhpSpreadsheet - Read, Write Excel and LibreOffice Calc files (327)
  4. Insert, Select and Update NULL value in MySQL (256)
  5. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (254)