{"id":23669,"date":"2016-08-04T03:01:48","date_gmt":"2016-08-03T17:01:48","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=23669"},"modified":"2016-07-29T21:35:16","modified_gmt":"2016-07-29T11:35:16","slug":"trip-google-chart-london-population-timeline-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/trip-google-chart-london-population-timeline-tutorial\/","title":{"rendered":"Trip Google Chart London Population Timeline Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/population_of_london_timeline.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Trip Google Chart London Population Timeline Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/population_of_london_timeline.jpg\" title=\"Trip Google Chart London Population Timeline Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Trip Google Chart London Population Timeline Tutorial<\/p><\/div>\n<p>As far as the practicalities of using the closely related <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/index' title='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.'>Google Chart<\/a> Line\/Bar\/Area\/Column Charts goes &#8230;<\/p>\n<ul>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/AreaChart\/area_chart.php------GETME\" title=\"area_chart.php\" target=\"_blank\">area_chart.php<\/a> is PHP programming source code  for this <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/AreaChart\/area_chart.php\" title=\"live run\" target=\"_blank\">live run<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart.php-------GETME\" title=\"bar_chart.php\" target=\"_blank\">bar_chart.php<\/a>  is PHP programming source code for this <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart.php\" title=\"live run\" target=\"_blank\">live run<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart.php--------GETME\" title=\"column_chart.php\" target=\"_blank\">column_chart.php<\/a>  is PHP programming source code for this <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart.php\" title=\"live run\" target=\"_blank\">live run<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/LineChart\/line_chart.php-------GETME\" title=\"line_chart.php\" target=\"_blank\">line_chart.php<\/a> is PHP programming source code  for this <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/LineChart\/line_chart.php\" title=\"live run\" target=\"_blank\">live run<\/a><\/li>\n<\/ul>\n<p> &#8230; we discovered today, that there are better representations than others in this set of four regarding the nature of the data you try to represent.  I&#8217;ll explain this with regard to what we wanted to show the data for today.  In the Museum of London on the <i>trip<\/i> that we&#8217;ve talked about recently with respect to mobile device usage, we found this intriguing display in the Museum of London (that we can not find the data of on the &#8220;net&#8221; &#8230; so you&#8217;ll just have to <a target=_blank href='http:\/\/www.museumoflondon.org.uk\/museum-london'>go there<\/a> <font size=1> (and it&#8217;s somewhere in the &#8220;most recent period&#8221; section) &#8230; quick, before <a target=_blank title='Museum of London is moving' href='http:\/\/www.standard.co.uk\/news\/london\/museum-of-london-going-ahead-with-70m-move-to-smithfield-10138884.html'>it moves<\/a><\/font>) graphing the Population of London through history.  So we&#8217;ve written a &#8220;Population of London Timeline&#8221; web application.<\/p>\n<p>Now at this point you may be wondering why &#8230;<\/p>\n<ul>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/AnnotatedTimelineChart\/annotatedtimeline_chart.php---GETME\" title=\"annotatedtimeline_chart.php\" target=\"_blank\">annotatedtimeline_chart.php<\/a> is the changed Annotated Timeline Chart PHP code <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/AnnotatedTimelineChart\/annotatedtimeline_chart.php---GETME\" title=\"annotatedtimeline_chart.php\" target=\"_blank\">here<\/a> for non-Flash mode becoming the default behaviour, and for the ability to switch between non-Flash and Flash (<a target=_blank title='Legacy (system) information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Legacy_system'>legacy<\/a>) modes of use &#8230; and please feel free to try a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/AnnotatedTimelineChart\/annotatedtimeline_chart.php\" title='Click picture'>live run<\/a><\/li>\n<\/ul>\n<p> &#8230; isn&#8217;t included in the list above regarding a &#8220;Population of London Timeline&#8221; web application?  After all, it sounds ideal, but the fact is, when you are dealing with Year data that comes before 1900 their representation can be difficult to achieve given the Integer*4 <font size=1>(sorry to go all Fortran on you)<\/font> (date difference in the smallest unit of time) arrangement behind the representation of dates in some computer programs.  Pity really, because we would like proportion to the timeline, but then again we are not talking regular date data points, so this would have been &#8220;cramped&#8221; for the Annotated Timeline &#8230; so &#8230; my first thought, otherwise was the Column Chart &#8230; but in doing this realized that the Years disappeared with the 38 data points, and that the really small Populations in those early historical Years made them disappear and not be &#8220;clickable&#8221; &#8230; yes, we are using those Google Chart Select Event ideas you can read about a lot on this blog, and that you can get a taste for by perusing the relevant &#8220;similar feeling and concepts&#8221; <a title='Google Chart Select Event Post Readiness Tutorial' href='#gcseprt'>Google Chart Select Event Post Readiness Tutorial<\/a> as shown below, and that you can see in action if you look at our <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/population_of_london_timeline.jpg\" title='Click picture'>tutorial picture<\/a> closely.<\/p>\n<p>So what turned out to be the best of the four Google Charts to use?  The Bar Chart was the best at showing the Years and the small Population data values in those early historical years.  Am sure there are other scenarios where the others are the better fit.<\/p>\n<p>Regarding the research today we&#8217;d like to give thanks to <a target=_blank title='Harvard' href='http:\/\/ocp.hul.harvard.edu\/contagion\/plague.html'>Harvard<\/a> at http:\/\/ocp.hul.harvard.edu\/contagion\/plague.html and to <a target=_blank title='Wikipedia link' href='https:\/\/en.wikipedia.org\/wiki\/History_of_London#Population'>Wikipedia<\/a> at https:\/\/en.wikipedia.org\/wiki\/History_of_London#Population <a target=_blank title='Wikipedia link two' href='https:\/\/en.wikipedia.org\/wiki\/Timeline_of_London'>and<\/a> https:\/\/en.wikipedia.org\/wiki\/Timeline_of_London<\/p>\n<p>So here is the &#8220;Population of London Timeline&#8221; web application <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/population_of_london_timeline.html\">live run<\/a> and its HTML and Javascript programming source code you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/population_of_london_timeline.html_GETME\" title=\"population_of_london_timeline.html\">population_of_london_timeline.html<\/a><\/p>\n<hr>\n<p id='gcseprt'>Previous relevant <a target=_blank title='Google Chart Select Event Post Readiness Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/google-chart-select-event-post-readiness-tutorial\/'>Google Chart Select Event Post Readiness Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/testcase.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Google Chart Select Event Post Readiness Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/post_readiness.jpg\" title=\"Google Chart Select Event Post Readiness Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Google Chart Select Event Post Readiness Tutorial<\/p><\/div>\n<p>Tomorrow we have a new web application that uses the <b>bold<\/b> <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/index' title='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.'>Google Charts<\/a> (and their <a target=_blank title='Google Charts select event help ... from Google' href='https:\/\/developers.google.com\/chart\/interactive\/docs\/events?hl=en'>select events<\/a> &#8220;haven&#8221; for business logic) in the list below &#8230;<\/p>\n<ul>\n<li><b>Area Chart<\/b><\/li>\n<li><b>Bar Chart<\/b> (and Bar Chart Differences)<\/li>\n<li><b>Column Chart<\/b> (and Column Chart Differences)<\/li>\n<li><b>Line Chart<\/b><\/li>\n<li>Map Chart<\/li>\n<li>Pie Chart<\/li>\n<\/ul>\n<p> &#8230; charts which came in the list of ones changed when we presented the <a target=_blank title='Google Chart Select Event Cache Issue Tutorial' href='#gcsecit'>Google Chart Select Event Cache Issue Tutorial<\/a> as shown below.<\/p>\n<p>These Google Chart Line\/Bar\/Area\/Column Chart changes involved &#8230;<\/p>\n<ul>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/AreaChart\/area_chart.php------GETME\" title=\"area_chart.php\" target=\"_blank\">area_chart.php<\/a> is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/AreaChart\/area_chart.php------GETME\" title=\"area_chart.php\" target=\"_blank\">changes<\/a> for this <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/AreaChart\/area_chart.php\" title=\"live run\" target=\"_blank\">live run<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart.php-------GETME\" title=\"bar_chart.php\" target=\"_blank\">bar_chart.php<\/a>  is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart.php-------GETME\" title=\"bar_chart.php\" target=\"_blank\">changes<\/a> for this <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart.php\" title=\"live run\" target=\"_blank\">live run<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart.php--------GETME\" title=\"column_chart.php\" target=\"_blank\">column_chart.php<\/a>  is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart.php-------GETME\" title=\"column_chart.php\" target=\"_blank\">changes<\/a> for this <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart.php\" title=\"live run\" target=\"_blank\">live run<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/LineChart\/line_chart.php-------GETME\" title=\"line_chart.php\" target=\"_blank\">line_chart.php<\/a> is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/LineChart\/line_chart.php-------GETME\" title=\"line_chart.php\" target=\"_blank\">changes<\/a> for this <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/LineChart\/line_chart.php\" title=\"live run\" target=\"_blank\">live run<\/a><\/li>\n<\/ul>\n<p> &#8230; and were done to cater for data POSTed to these charts &#8230; the <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/testcase.html\" title='test case'>live run<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/testcase.html_GETME\" title='testcase.html'>testcase.html<\/a> being a test case for us &#8230; from an HTML form.  Why might we do this?  We talk more tomorrow, but you might well choose to POST to these charts as a default method in preference to a GET method as a means to cater for any or all amounts of data needed to be passed in for processing.  The need for such functionality improvements is often not always apparent at the start of writing a piece of code, because it is only &#8220;down the track&#8221; you realise how that code could come into play as a modular piece of code, with just a small, extra amount of effort &#8230; the effort of today.  We hope to complete this picture tomorrow &#8230; and don&#8217;t forget the <a target=_blank title='Hares and rabbits' href='http:\/\/www.yankeemagazine.com\/article\/marysfarm\/rabbit'>hares and rabbits<\/a>.<\/p>\n<hr>\n<p id='gcsecit'>Previous relevant <a target=_blank title='Google Chart Select Event Cache Issue Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/google-chart-select-event-cache-issue-tutorial\/'>Google Chart Select Event Cache Issue Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Google Chart Select Event Cache Issue Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/cache_issue.jpg\" title=\"Google Chart Select Event Cache Issue Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Google Chart Select Event Cache Issue Tutorial<\/p><\/div>\n<p>We&#8217;re still trying for yet more &#8220;genericity&#8221; with our Google Graphs API, or Google Chart Tools, web and mobile applications today, building on yesterday&#8217;s <a target=_blank title='Google Chart Select Event Email Integration Tutorial' href='#gcseeit'>Google Chart Select Event Email Integration Tutorial<\/a> as shown below, with integration involving <a target=_blank title='Email information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Email'>email<\/a>, yesterday more for non-mobile usage and today, more for mobile platform usage, that we first tried on our recent <strike>&#8220;guinea pig&#8221;<\/strike> <strike>&#8220;guinea fowl&#8221;<\/strike> <font size=1>(so yesterday)<\/font> <a target=_blank title='Guinea Baboon' href='http:\/\/www.google.com\/#q=guinea+baboon'>&#8220;guinea baboon&#8221;<\/a> functionalities (of recent times) &#8230;<\/p>\n<ul>\n<li>Area Chart<\/li>\n<li>Bar Chart (and Bar Chart Differences)<\/li>\n<li>Column Chart (and Column Chart Differences)<\/li>\n<li>Line Chart<\/li>\n<li>Map Chart<\/li>\n<li>Pie Chart<\/li>\n<\/ul>\n<p>It probably comes as no surprise that chart data can be a great conversation starter for meetings or online discussions conducted via email, for example.  They say &#8220;a picture tells a thousand words&#8221; &#8230; MMM look at that pie chart over yonder &#8230; see &#8230; three thousand words &#8230; <font size=1>chortle, chortle<\/font>.<\/p>\n<p>Do you remember yesterday? &#8230;<\/p>\n<blockquote>\n<p>We use <a target=_blank title='Mailto link information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tryit.asp?filename=tryhtml_link_mailto'>mailto<\/a> links to direct the user to their default client mail supervisors to make all this happen.  You will find, with PHP, that you can email without this client email via the use of the <a target=_blank title='PHP mail method information' href='http:\/\/php.net\/manual\/en\/function.mail.php'>mail<\/a> method.<\/p>\n<\/blockquote>\n<p>&#8230; Well, our concentration on <i>mailto<\/i> (that works fine on non-mobile platforms) needed to be balanced with some mobile platform consideration that uses that PHP <i>mail<\/i> method, so as not to navigate too far away in our iOS app&#8217;s WebView.<\/p>\n<p>And we did some work with Google Chart Pie Charts today to add &#8220;select&#8221; event functionality, and to try to stop it using the <a target=_blank title='Cache information from Wikipedoa ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Cache_(computing)'>cache<\/a>, as we want the iOS app reflect changes we make to things, and be able to let the iOS app user recover from an unforseen problem exacerbated by the return to a bad caching scenario.<\/p>\n<p>We found good advice about this cache issue at this <a target=_blank title='Cache useful link' href='http:\/\/stackoverflow.com\/questions\/1479359\/is-there-a-way-to-disable-browser-cache-for-a-single-page'>useful link<\/a>, so, thanks.  You may read from this page that there is an HTML <a target=_blank title='HTML meta tag information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tag_meta.asp'>meta<\/a> tag approach to this, but we prefer a PHP approach, and use, up the top of the PHP the code snippet &#8230;<\/p>\n<p><code><br \/>\nheader( \"Expires: Mon, 20 Dec 1998 01:00:00 GMT\" );<br \/>\nheader( \"Last-Modified: \" . gmdate(\"D, d M Y H:i:s\") . \" GMT\" );<br \/>\nheader( 'Cache-Control: no-store, no-cache, must-revalidate' );<br \/>\nheader( 'Cache-Control: post-check=0, pre-check=0', false );<br \/>\nheader( 'Pragma: no-cache' );<br \/>\n<\/code><\/p>\n<p>&#8230; you will find up the top of the PHP <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php-----GETME\" title=\"map.php\" target=\"_blank\">pie_chart.php<\/a> programming source code.<\/p>\n<p>These Google Chart Pie\/Line\/Bar\/Area\/Column\/Map Chart changes involved &#8230;<\/p>\n<ul>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/AreaChart\/area_chart.php-----GETME\" title=\"area_chart.php\" target=\"_blank\">area_chart.php<\/a> is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/AreaChart\/area_chart.php-----GETME\" title=\"area_chart.php\" target=\"_blank\">changes<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart.php------GETME\" title=\"bar_chart.php\" target=\"_blank\">bar_chart.php<\/a> (<a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart_diff.php-----GETME\" title=\"bar_chart_diff.php\" target=\"_blank\">bar_chart_diff.php<\/a>) is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart.php------GETME\" title=\"bar_chart.php\" target=\"_blank\">changes<\/a> (and <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart_diff.php-----GETME\" title=\"bar_chart_diff.php.php\" target=\"_blank\">changes<\/a>)<\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart.php------GETME\" title=\"column_chart.php\" target=\"_blank\">column_chart.php<\/a> (<a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart_diff.php-----GETME\" title=\"column_chart_diff.php\" target=\"_blank\">column_chart_diff.php<\/a>) is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart.php------GETME\" title=\"colimn_chart.php\" target=\"_blank\">changes<\/a> (and <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart_diff.php-----GETME\" title=\"column_chart_diff.php.php\" target=\"_blank\">changes<\/a>)<\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/LineChart\/line_chart.php------GETME\" title=\"line_chart.php\" target=\"_blank\">line_chart.php<\/a> is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/LineChart\/line_chart.php------GETME\" title=\"line_chart.php\" target=\"_blank\">changes<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Map\/map.php-------GETME\" title=\"map.php\" target=\"_blank\">map.php<\/a> is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/Map\/map.php--------GETME\" title=\"map.php\" target=\"_blank\">changes<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php-----GETME\" title=\"map.php\" target=\"_blank\">pie_chart.php<\/a> is the changed PHP programming source code as per <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php-----GETME\" title=\"pie_chart.php\" target=\"_blank\">changes<\/a><\/li>\n<\/ul>\n<p>Link to Google Chart Tools &#8220;spiritual home&#8221; &#8230; <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/index' title='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.\n'>via Google<\/a>.<br \/>\nLink to Google Chart Tools Area Chart information &#8230; <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/areachart' title='Google Area Charts'>via Google<\/a>.<br \/>\nLink to Google Chart Tools Bar Chart information &#8230; <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/barchart' title='Google Bar Charts'>via Google<\/a>.<br \/>\nLink to Google Chart Tools Column Chart information &#8230; <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/columnchart' title='Google Column Charts'>via Google<\/a>.<br \/>\nLink to Google Chart Tools Line Chart information &#8230; <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/linechart' title='Google Line Charts'>via Google<\/a>.<br \/>\nLink to Google Chart Tools Map Chart information &#8230; <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/map' title='Google Map Charts'>via Google<\/a>.<br \/>\nLink to Google Chart Tools Pie Chart information &#8230; <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/piechart' title='Google Area Charts'>via Google<\/a>.<\/p>\n<p>This extra functionality, available via the suffix \u201c&#038;onclick=y\u201d applied to the Google Chart Area and Bar and Column and Line and Map and Pie Chart title, flows on directly to the iPad iOS App we created and talked about, last, with <a target=_blank href='https:\/\/www.rjmprogramming.com.au\/ITblog\/xcode-swift-ios-application-end-game-primer-tutorial\/' title='Xcode Swift iOS Application End Game Primer Tutorial'>Xcode Swift iOS Application End Game Primer Tutorial<\/a>.<\/p>\n<p>So please try creating your own emailable Google Chart live runs for &#8230;<\/p>\n<ul>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/AreaChart\/area_chart.php\" title=\"area_chart.php\" target=\"_blank\">Area Chart<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BarChart\/bar_chart.php\" title=\"bar_chart.php\" target=\"_blank\">Bar Chart<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ColumnChart\/column_chart.php\" title=\"column_chart.php\" target=\"_blank\">Column Chart<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/LineChart\/line_chart.php\" title=\"line_chart.php\" target=\"_blank\">Line Chart<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Map\/map.php\" title=\"line_chart.php\" target=\"_blank\">Map Chart<\/a><\/li>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php\" title=\"pie_chart.php\" target=\"_blank\">Pie Chart<\/a><\/li>\n<\/ul>\n<p><font size=1>No guinea pigs (nor guinea fowl, nor guinea baboons) were harmed in the making of this blog post.<\/font> <font size=2>Honest, hen!<\/font><\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d18026' onclick='var dv=document.getElementById(\"d18026\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/cache\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d18026' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d19852' onclick='var dv=document.getElementById(\"d19852\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/google-chart\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d19852' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d23669' onclick='var dv=document.getElementById(\"d23669\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/bar-chart\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d23669' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>As far as the practicalities of using the closely related Google Chart Line\/Bar\/Area\/Column Charts goes &#8230; area_chart.php is PHP programming source code for this live run bar_chart.php is PHP programming source code for this live run column_chart.php is PHP programming &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/trip-google-chart-london-population-timeline-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,17,1,36,37],"tags":[130,513,519,538,576,652,1950,997,1729,1311,1319],"class_list":["post-23669","post","type-post","status-publish","format-standard","hentry","category-elearning","category-gui","category-uncategorised","category-trips","category-tutorials","tag-bar-chart","tag-google","tag-google-charts","tag-graph","tag-html","tag-javascript","tag-population","tag-programming","tag-timeline","tag-trip","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/23669"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=23669"}],"version-history":[{"count":10,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/23669\/revisions"}],"predecessor-version":[{"id":23693,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/23669\/revisions\/23693"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=23669"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=23669"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=23669"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}