PHP/Javascript Google Candlestick Waterfall Chart Tutorial

PHP/Javascript Google Candlestick Waterfall Chart Tutorial

PHP/Javascript Google Candlestick Waterfall Chart Tutorial

We’re returning to Google Graphs API, or Google Chart Tools, and its Candlestick Chart functionality as last talked about, specifically, with previous PHP/Javascript/HTML Google Chart Candlestick Chart Tutorial (as shown below), to develop, further, here, some improved functionality. Specifically we address …

  1. a way to show a Waterfall look
  2. a way to cater for a POST message from an HTML form (so that more data can be handled)
  3. a way to show a customised tooltip

The last two tooltip functionality improvements above, you may remember also being applied to a Pie Chart with PHP and jQuery Google Pie Chart Tooltips Tutorial a couple of days back and to the Map Chart some days back when we published PHP/Javascript/HTML Google Chart Map Onclick Tutorial. As the weeks go on, others will also be attended to.

It is quite likely that now is a good time for you to consult the Candlestick (or Waterfall) Chart information page … via Google.

The Candlestick Chart’s tooltip (content) is heavily weighted towards a standard row number range display, as you might expect, so we looked up whether other ideas can come into play and we stumbled upon this excellent webpage, for which we give hearty thanks.

If you’ve “digested” this information, you’ll see that it calls upon jQuery functionality to help out our usual Javascript client code for the Candlestick (or Waterfall) Charts. It is clever enough to allow an onmouseover (ie. hover event) tooltip to be able to handle HTML functionality, so you’ll see most of the changes to our PHP candlestick_chart.php code revolving around …

  • effectively informing the user when they can intervene to tailor a tooltip (if combined with HTML content it can tailor the actual look of the Candlestick (or Waterfall) Chart as well, because it will show labels rather than percentages), and what they have to do, in general terms (just to set the pattern, for tailoring this, specifically (my favourite word for several days now), to your own requirements)
  • validating this user entry data for what will suit the PHP program and its interface to the Google Chart API usage … lots of encodeURIComponent here!

Having optionally customised tooltips off the candlestick of the Candlestick (or Waterfall) Chart could be used to enhance its functionality considerably, should you be looking for the Candlestick (or Waterfall) Chart to be an interactive reporting tool, perhaps for collaboration purposes, as you can email your Candlestick (or Waterfall) Chart, as well, as we talked about with Google Charts Emailing Primer Tutorial.

So the PHP code changed from that emailing (Google Charts Emailing Primer Tutorial) functionality as per this link.

And so we’ll leave you with a link to a live run (as a GET method).


Previous relevant PHP/Javascript/HTML Google Chart Candlestick Chart Tutorial is shown below.

PHP/Javascript/HTML Google Chart Candlestick Chart Tutorial

PHP/Javascript/HTML Google Chart Candlestick Chart Tutorial

Here is a tutorial that introduces you to Google Graphs API, or Google Chart Tools, and its Candlestick Chart functionality.

Google Chart Tools provide a perfect way to visualize data on your website. From simple line charts to complex hierarchical tree maps, the chart galley provides a large number of well-designed chart types. Populating your data is easy using the provided client- and server-side tools.

Let’s see some PHP code in live action for this tutorial where you define your candlestick chart characteristics and data.

Link to Google Chart Tools “spiritual home” … via Google.
Link to Google Chart Tools Candlestick Chart information … via Google.

Link to some downloadable PHP programming code … rename to candlestick_chart.php.

If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.

This entry was posted in eLearning, Event-Driven Programming, GUI, Tutorials and tagged , , , , , , , , , , , , , , , . Bookmark the permalink.

13 Responses to PHP/Javascript Google Candlestick Waterfall Chart Tutorial

  1. online movies says:

    Subsequently, soon after spending a lot of hours on the internet at past WeÒ€ℒve uncovered anyone that surely does know what they’re discussing thank you quite considerably great weblog post

  2. Spot on with this write-up, I in fact assume this website wants significantly extra consideration. in all probability be again to read way extra, thanks for that info.

  3. This is going to be a fantastic web site, may possibly you be interested in doing an interview about how you developed it? If so e-mail me!

  4. rokit 5 says:

    Oh my goodness! an incredible post dude. Thank you Nonetheless I am experiencing situation with ur rss . DonÒ€ℒt know why Unable to subscribe to it. Is there anyone getting an identical rss difficulty? Anyone who knows kindly respond. Thnkx

  5. I would genuinely like you to become a guest poster on my website..”.;

  6. profit says:

    Hello. fantastic job. I did not imagine this. This is a great story. Thanks!

  7. YOURURL.com says:

    Magnificent website. A lot of useful information here. I’m sending it to several friends ans additionally sharing in delicious. And certainly, thanks for your sweat!

  8. naked party ideas says:

    A blog like yours really should be earning much money from adsense.`*”*’

    http://beenlee008.tumblr.com/post/141999789959/fun-party-favors-for-lively-parties

  9. zobacz tutaj says:

    Please let me know if you’re looking for a writer for kineoris your blog. You have some really great posts and I believe I would be a good asset. If you ever want to take some of the load off, I’d love to write some content for your blog in exchange for a link back to mine. Please shoot me an e-mail if interested. Thank you!

  10. Mmmm says:

    It is actually a nice and helpful piece of information. I‘¦m happy that you simply shared this useful information with us. Please stay us up to date like this. Thank you for sharing.

  11. experienced says:

    sure, study is having to pay off. Is not it good any time you discover a good article? So pleased to get located this post.. Love the posting you furnished..

  12. complete says:

    certainly, investigation is having to pay off. Is not it fantastic after you uncover a great submit? Enjoying the weblog.. thanks for your insight Wonderful opinions you possess here..

  13. star says:

    Isn’t it amazing when you uncover a very good submit? So pleased to get found this publish.. So happy to possess located this post.. My internet searching seem complete.. thanks.

Leave a Reply to rokit 5 Cancel reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>