PHP Classes

cSpeedometer: Render a speed meter as image or HTML5 canvas

Recommend this page to a friend!
  Info   Screenshots Screenshots   View files View files (3)   DownloadInstall with Composer Download .zip   Reputation   Support forum (4)   Blog    
Ratings Unique User Downloads Download Rankings
StarStarStarStar 69%Total: 801 All time: 4,278 This week: 114Up
Version License PHP version Categories
speed-meter 1.3.1GNU General Publi...5.2HTML, PHP 5, Graphics
Description 

Author

This class can render a speed meter as image or HTML5 canvas.

It can generate an image with a round speed meter and a pointer pointing to the current speed over three ranges of speeds displayed in red, yellow or green.

The class can generate the image in JPEG, PNG and GIF format, or as HTML5 with JavaScript code that can render the speed meter image in a canvas object.

This class create a speedometer images for use in dashboards or control panels GIF, JPG, PNG or using HTML5 canvas and SVG tags.

The red, yellow and greed speed ranges and the colors of the speed pointer are configurable parameters.

Innovation Award
PHP Programming Innovation award nominee
January 2013
Number 2


Prize: One copy of the Zend Studio
Speed meters are often used as a visual artifact to show how the user is doing or the current state of something of the user interest.

This class can render a speed meter on the browser side using HTML5 canvas objects instead of just images dynamically generated on the server side.

Manuel Lemos
Picture of Omar Ortiz
  Performance   Level  
Name: Omar Ortiz <contact>
Classes: 5 packages by
Country: Mexico Mexico
Age: 54
All time rank: 6398 in Mexico Mexico
Week rank: 312 Up6 in Mexico Mexico Up
Innovation award
Innovation award
Nominee: 2x

Details

Steps to generate a speedometer: 1. Include cspeedometer.php library in your script require_once("cSpeedometer.php"); 2. Create an array with the selected colors if you want to change default colors. See color method for defined colors, See __construct method for custom colors. the array only need the colors that you want to change examples: $colors = array(BCKGND=>"pink",BORDER => "darkBlue",SPEED=>"darkRed",SPD_IND=>"black",SPD_MARK=>"darkGreen",RED_ZN=>"red",GRN_ZN=>"green",YLW_ZN="yellow"); $colors = array(BCKGND=>"pink",BORDER => "darkBlue",SPEED=>"darkRed"); 2. create a cSpeedometer object $sp1 = new cSpeedometer(250,$colors); 1st parameter is the size in pixels, default is 500 2nd parameter is colors array see (2.) 3. Set max value (default is 100) $sp1->setMaxValue(150); 3. Set min value (default is 0) $sp1->setMinValue(10); 4. Set speed $sp1->setValue(35); 5. if you need a green zone then set de green zone $sp1->setGZone(100,150); 1st parameter is the starting point of green zone 2nd parameter is the ending point of green zone 6. if you need a yellow zone then set de yellow zone $sp1->setYZone(50,100); 1st parameter is the starting point of yellow zone 2nd parameter is the ending point of yellow zone 7. if you need a red zone then set de red zone $sp1->setRZone(10,50); 1st parameter is the starting point of red zone 2nd parameter is the ending point of red zone 8. Create the image or de canvas $sp1->getImage("GIF","sp3"); 1st parameter is the format (GIF, PNG, JPG), default is PNG 2nd parameter is the name of the file (without extension) if you omit this parameter, the image is output to screen The image is generate in tmp directory, see FILE_PATH constant defined in cSpeedometer.php library echo $sp1->getCanvas("sp1",2,true); 1st parameter is the id to use in canvas 2nd parameter is the number of decimals in seepd and marks 3th parameter active gradient effect in yellow zone echo $sp1->getSVG("sp1",2); 1st parameter is the id to use in svg object 2nd parameter is the number of decimals in seepd and marks

Screenshots  
  • canvas.jpg
  • screenshot
  • sp1.png
  • svg.jpg
  Files folder image Files  
File Role Description
Plain text file cSpeedometer.php Class Class file
Accessible without login Plain text file example.php Example Example file
Accessible without login Plain text file readme.txt Doc. readme file

 Version Control Unique User Downloads Download Rankings  
 0%
Total:801
This week:0
All time:4,278
This week:114Up
User Ratings User Comments (3)
 All time
Utility:85%StarStarStarStarStar
Consistency:89%StarStarStarStarStar
Documentation:89%StarStarStarStarStar
Examples:89%StarStarStarStarStar
Tests:-
Videos:-
Overall:69%StarStarStarStar
Rank:322
 
Sublime, fantastic, excellent work!
9 years ago (daniele borini)
80%StarStarStarStarStar
On my system, I had to create the tmp dir.
11 years ago (Gary G Johnson)
80%StarStarStarStarStar
This is a good class :-)
11 years ago (José Filipe Lopes Santos)
80%StarStarStarStarStar