This post has been long overdue. This post will show you how to pass a date parameter to a line chart. The parameter values will show different series values (traffic count in this case) based on your date selection. 1. Set up chart options Set up the chart option. Notice that there's no hard-coded data. [...]
In this post, I will show how to set up a Pie Chart using Highcharts, PHP, JSON and MySQL. This example displays the percentage breakdown of web marketing efforts. 1. Create MySQL table The SQL Script: CREATE TABLE `web_marketing` ( `name` varchar(50) DEFAULT NULL, `val` decimal(10,2) DEFAULT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1; /*Data for [...]
In my previous post "How to load MySQL results to Highcharts using JSON", the x-axis values were hard-coded. Some of you guys were wondering how to set the x-axis values dynamically as well. So I came up with this example. 1. Set up the chart options Set up the chart options without rendering the chart. [...]
The great people at Balance Media built this amazing vertical timeline Javascript component. Timeline is a great data visualization tool. It uses Google Spreadsheet as data source so it was easy to make it work very quickly. However, for my app, I wanted it to display MySQL data without going through the Google Spreadsheet. [...]
In my previous post "Using Highcharts with PHP and MySQL", a few people noticed that if there's a null value in the MySQL data, plot line won't be drawn for the entire series. Here's an example of tsv data with null values: Friday, July 1, 2011 00:00:00 1274 Friday, July 1, 2011 01:00:00 null Friday, [...]
In my previous post "Using Highcharts with PHP and MySQL", the database table results were output as tab-separated values. Since JSON is more widely used data format, it makes sense to provide sample code that uses JSON. Additionally, this post will show Highcharts with multiple series. 1. Database table I've included the sql file to create the [...]
If you are using Highcharts as metrics tools, you probably thought about adding indicators for allowable minimum and maximum thresholds. Any points that go below or above allowable range will visually jump out and you can take appropriate actions. In this post, I want to show how this can be achieved. 1. Set the minimum and maximum [...]
I've been asked many times if you can displaying Google Spreadsheet data on a web page or within a web application. I knew this was possible using Google Spreadsheet API so I decided to provide a sample code. In the latest version of Google Spreadsheet API, there are Protocol API and Java API. I will be [...]
I like Highcharts. There are many JavaScript-based charting components out there but I particularly enjoyed using this JavaScript library. In this post, I want to step you through how to use Highcharts with PHP and MySQL. 1. Download Highcharts and jQuery libraries. I prefer jQuery as the prerequisite library but it supports Prototype and Mootools as well. [...]