{"id":47695,"date":"2020-01-17T03:01:36","date_gmt":"2020-01-16T17:01:36","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=47695"},"modified":"2020-01-16T22:17:49","modified_gmt":"2020-01-16T12:17:49","slug":"worldbank-api-comparison-year-google-chart-mobile-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-comparison-year-google-chart-mobile-tutorial\/","title":{"rendered":"Worldbank API Comparison Year Google Chart Mobile Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API Comparison Year Google Chart Mobile Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_mobile.jpg\" title=\"Worldbank API Comparison Year Google Chart Mobile Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API Comparison Year Google Chart Mobile Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s <a title='Worldbank API Comparison Year Pie Chart Differences Tutorial' href='#wapicypcdt'>Worldbank API Comparison Year Pie Chart Differences Tutorial<\/a> involved <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> <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/diffchart' title='Google Pie Charts'>Pie Chart Difference<\/a> graphics that &#8230;<\/p>\n<ul>\n<li>needed work to be functional on mobile platforms, allowing for some Javascript tweaking of the options of those Google ChartPie Chart Difference options &#8230; with the &#8230;\n<li>&#8220;parent&#8221; supervisory <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> has HTML (and Javascript and CSS) you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html-------GETME\" title=\"worldbank_population_data.htm\">worldbank_population_data.htm<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html-------GETME\" title=\"worldbank_population_data.htm\">this way<\/a> &#8230; supplying a screen width &#8230;<br \/>\n<code><br \/>\n  var whsuffix='';<br \/>\n  var deviceWidth = window.orientation == 0 ? window.screen.height: window.screen.width;<br \/>\n  var deviceHeight = window.orientation == 0 ?  window.screen.width : window.screen.height;<br \/>\n  var rectis=document.body.getBoundingClientRect();<br \/>\n  if (('' + rectis.width).replace('px','').replace(\/0\/g,'') != '' && ('' + rectis.height).replace('px','').replace(\/0\/g,'') != '') {<br \/>\n        deviceWidth=('' + rectis.width).replace('px','');<br \/>\n        deviceHeight=('' + rectis.height).replace('px','');<br \/>\n  }<br \/>\n  whsuffix='&swidth=' + ('' + eval(('' + deviceWidth).replace('px','')) * 1.0) + '&sheight=' + ('' + eval(('' + deviceHeight).replace('px','')) * 1.0);<br \/>\n<\/code><br \/>\n &#8230; via a suffix to its URL call of the &#8230;\n<\/li>\n<li>&#8220;child&#8221; supervised you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php--------GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php--------GETME\" title=\"worldbank_population_data.php\">this way<\/a><br \/>\n&lt;?php<br \/>\n<code><br \/>\n$widea=620;<br \/>\nif (isset($_GET['swidth'])) {<br \/>\n  $widea=$_GET['swidth'];<br \/>\n  $widea\/=3.0;<br \/>\n} else if (isset($_POST['swidth'])) {<br \/>\n  $widea=$_POST['swidth'];<br \/>\n  $widea\/=3.0;<br \/>\n}<br \/>\n$widea=round($widea);<br \/>\n\/\/<br \/>\n\/\/ later ... in an <b>echo \" some HTML \"<\/b> bit ...<br \/>\n\/\/<br \/>\n&lt;input type='hidden' name='moreopt' value=' width: <b>\" . $widea . \"<\/b>, height: 1200, chartArea: {  width: \\\"<b>86<\/b>%\\\", height: \\\"70%\\\" }, '&gt;&lt;\/input&gt;<br \/>\n<\/code><br \/>\n?&gt;<br \/>\n &#8230; we think we&#8217;ve come up with a better compromise for all &#8230; and today we turn a lot of attention to &#8230;\n<\/li>\n<li>start improving the Year &#8220;through to&#8221; Year functionality calling on &#8230;\n<li><a target=_blank title='Google Chart Area Chart information' href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/areachart'>Area Chart<\/a> interfacing <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 target=_blank title='Google Chart Bar Chart information' href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/barchart'>Bar Chart<\/a> interfacing <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><\/li>\n<li><a target=_blank title='Google Chart Column Chart information' href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/columnchart'>Column Chart<\/a> interfacing <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><\/li>\n<li><a target=_blank title='Google Chart Line Chart information' href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/linechart'>Line Chart<\/a> interfacing <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<p> &#8230; what we like to think of as <a target=_blank title='?' href='https:\/\/www.youtube.com\/watch?v=UIXHcOjJpxY#t=3m50s'>&#8220;the statistical charts&#8221;<\/a>, improving &#8230;<\/p>\n<ol>\n<li>emoji flags<\/li>\n<li>legend size &#8230; and in so doing, opening the door to &#8230;<\/li>\n<li>future parameterization of these chart options, via a &#8220;parent&#8221;&#8216;s business logic (without having to change the Charts so much again)<\/li>\n<\/ol>\n<p> &#8230; also affecting &#8230;\n<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php------------------GETME\">pie_chart.php<\/a> changed <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php------------------GETME\">this way<\/a><\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart_diff.php--------GETME\">pie_chart_diff.php<\/a> changed <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart_diff.php--------GETME\">this way<\/a><\/li>\n<\/ul>\n<p>As you may well be familiar with, here is a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">live run<\/a> link to try this WorldBank data reporting yourself.<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=_blank  href='\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-comparison-year-google-chart-mobile-tutorial\/'>Worldbank API ComparisonYear Google Chart Mobile Tutorial<\/a>.<\/p-->\n<hr>\n<p id='wapicypcdt'>Previous relevant <a target=_blank title='Worldbank API Comparison Year Pie Chart Differences Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-comparison-year-pie-chart-differences-tutorial\/'>Worldbank API Comparison Year Pie Chart Differences 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\/worldbank_population_data.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API Comparison Year Pie Chart Differences Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_pcd.jpg\" title=\"Worldbank API Comparison Year Pie Chart Differences Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API Comparison Year Pie Chart Differences Tutorial<\/p><\/div>\n<p>When you compare two year data sets with the web application of yesterday&#8217;s <a title='Worldbank API World Country Reporting Revisit Tutorial' href='#wapiwcrrtzz'>Worldbank API World Country Reporting Revisit Tutorial<\/a> you are likely to be accessing the <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> <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/diffchart' title='Google Pie Charts'>Pie Chart Differences<\/a> tool using Google&#8221;smarts&#8221; to compare two data sets via three graphical components.<\/p>\n<p>Those &#8220;graphical components&#8221; are each &#8220;entities&#8221; in terms of servicing any Google Charts &#8220;select&#8221; event logic.  In order to still have some &#8220;select&#8221; (onclick) event logic we needed to compromise in two ways &#8230;<\/p>\n<ul>\n<li>onmouseover tooltips could not be supported<\/li>\n<li>the smaller Pie Chart slices two small to display a percentage value have not be zeroed into<\/li>\n<\/ul>\n<p> &#8230; and so we become keen to help out here in two ways &#8230;<\/p>\n<ol>\n<li>try to make the legend not need clicking (and so size it to be a full list, at least for single letter executions) &#8230; thanks to <a target=_blank title='Useful link' href='https:\/\/stackoverflow.com\/questions\/16980002\/how-to-prevent-legend-labels-being-cut-off-in-google-charts'>this useful link<\/a>, thanks, <b>for lead to<\/b> &#8230;<br \/>\n<code><br \/>\n&lt;form onsubmit='return preiframeviaurl();' target='myiframe' id='myform' style='display:none;' method='POST' action='\" . $preudiff . $udiff . \".php'&gt;<br \/>\n&lt;input type='hidden' name='title' id='title' value='\" . $reportmode2 . \" by World Country \" . $startswith . \" for Year \" . $tbit . \"'&gt;&lt;\/input&gt;<br \/>\n\" . $onclick . \"<br \/>\n&lt;input type='hidden' name='task' id='task' value='\" . $reportmode . \"'&gt;&lt;\/input&gt;<br \/>\n&lt;input type='hidden' name='desc' id='desc' value='\" . $reportmode . \"'&gt;&lt;\/input&gt;<br \/>\n&lt;input type='hidden' name='label' id='label' value='Year'&gt;&lt;\/input&gt;<br \/>\n&lt;input type='hidden' name='value' id='value' value='\" . str_replace('%2c','',str_replace('%2C','',$valuelist)) . \"'&gt;&lt;\/input&gt;<br \/>\n&lt;input type='hidden' name='onclick' value='y'&gt;&lt;\/input&gt;<br \/>\n<b>&lt;input type='hidden' name='moreopt' value=' width: 620, height: 1200, chartArea: {  width: \\\"50%\\\", height: \\\"70%\\\" }, '&gt;&lt;\/input&gt;<\/b><br \/>\n&lt;input type='hidden' name='data' id='data' value='\" . explode(\"&data=\",$url)[1] . \"'&gt;&lt;\/input&gt;\" . \"\\n\" . $idata2 . \"\\n\" . \"<br \/>\n&lt;input id='mysubmit' type='submit' value='Draw Pie Chart'&gt;&lt;\/input&gt;<br \/>\n&lt;\/form&gt;<\/code>\n<\/li>\n<li>make sure a full data list appears (along with emoji flags and population numbers) in the Javascript prompt window value part<\/li>\n<\/ol>\n<p>This involved the &#8220;supervisory child&#8221; &#8230;<\/p>\n<ul>\n<li>&#8220;child&#8221; supervised you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php-------GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php-------GETME\" title=\"worldbank_population_data.php\">this way<\/a> &#8230; supervising &#8230;<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart_diff.php-------GETME\">pie_chart_diff.php<\/a> changed <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart_diff.php-------GETME\">this way<\/a><\/li>\n<\/ul>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=_blank  href='\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-comparison-year-pie-chart-differences-tutorial\/'Worldbank API Comparison Year Pie Chart Differences Tutorial<\/a>.<\/p-->\n<hr>\n<p id='wapiwcrrtzz'>Previous relevant <a target=_blank title='Worldbank API World Country Reporting Revisit Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-reporting-revisit-tutorial\/'>Worldbank API World Country Reporting Revisit 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\/worldbank_population_data.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API World Country Reporting Revisit Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_revisit.jpg\" title=\"Worldbank API World Country Reporting Revisit Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API World Country Reporting Revisit Tutorial<\/p><\/div>\n<p>We&#8217;re revisiting the PHP web application of <a title='Worldbank API World Country Reporting Regex Tutorial' href='#wapiwcrrt'>Worldbank API World Country Reporting Regex Tutorial<\/a> for a few days to &#8230;<\/p>\n<ul>\n<li>add some emoji flags<\/li>\n<li>fix some event logic weaknesses, starting today with the single year Worldbank Data incarnations (thanks to <a target=_blank href='https:\/\/datahelpdesk.worldbank.org\/knowledgebase\/articles\/898581-api-basic-call-structure' title='World Bank API'>World Bank API<\/a>), but not finished as far as comparison years Worldbank Data incarnations<\/li>\n<li>fix Mixed Content issues to allow for seamless SSL https: or http: URL usage<\/li>\n<\/ul>\n<p>So, today, both &#8220;parent&#8221; HTML and &#8220;child&#8221; PHP changed today so that &#8230;<\/p>\n<ul>\n<li>&#8220;parent&#8221; supervisory <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> has HTML (and Javascript and CSS) you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html------GETME\" title=\"worldbank_population_data.htm\">worldbank_population_data.htm<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html------GETME\" title=\"worldbank_population_data.htm\">this way<\/a><\/li>\n<li>&#8220;child&#8221; supervised you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php------GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php------GETME\" title=\"worldbank_population_data.php\">this way<\/a><\/li>\n<\/ul>\n<p> &#8230; overseeing <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> <a target=_blank href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/piechart' title='Google Pie Charts'>Pie Chart<\/a> interfacing that changed as per <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php-----------------GETME\">pie_chart.php<\/a> changed <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php-----------------GETME\">this way<\/a> and <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart_diff.php------GETME\">pie_chart_diff.php<\/a> changed <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart_diff.php------GETME\">this way<\/a>.<\/p>\n<p>Try a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\">live run<\/a> link for yourself to see where we are going with this.<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=_blank  href='\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-reporting-revisit-tutorial\/'>New Worldbank API World Country Reporting Revisit Tutorial<\/a>.<\/p-->\n<hr>\n<p id='wapiwcrrt'>Previous relevant <a target=_blank title='Worldbank API World Country Reporting Regex Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-reporting-regex-tutorial\/'>Worldbank API World Country Reporting Regex 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\/worldbank_population_data.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API World Country Reporting Regex Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_regex.jpg\" title=\"Worldbank API World Country Reporting Regex Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API World Country Reporting Regex Tutorial<\/p><\/div>\n<p>Don&#8217;t know why, but have often equated <i>regex<\/i> work in Javascript or PHP with &#8220;RegEx Rangers&#8221;, or some such other &#8220;superhero&#8221; categorization.  That is because to wield RegEx principles is a bit like swinging a sword through the &#8220;butter&#8221; of coding problems.  Its use can feel arcane, but using it can solve so many issues and simplify projects, it is unbelievable.  Trouble I&#8217;ve always found is that I like to be presented with a RegEx &#8220;ask&#8221; as a user, but don&#8217;t think a lot of people like it.  An upcoming tutorial, though, will show the wonders of a &#8220;RegEx&#8221; scenario for a text editing job we did recently &#8230; we&#8217;ll keep you posted on that.<\/p>\n<p>But back to today&#8217;s &#8220;RegEx&#8221; thinking, building on top of yesterday&#8217;s <a title='Worldbank API World Country Reporting Range Tutorial' href='#wawcrrt'>Worldbank API World Country Reporting Range Tutorial<\/a>.  We ended up asking the user for optional &#8220;RegEx&#8221; matching criteria for <b><i>name<\/i><\/b> matches between the <a target=_blank title='Worldbank data source' href='http:\/\/wdi.worldbank.org\/'>Worldbank<\/a> <a target=_blank title='Worldbank API documentation' href='https:\/\/datahelpdesk.worldbank.org\/knowledgebase\/articles\/898581-api-basic-call-structure'>API<\/a> data&#8217;s &#8230;<\/p>\n<ul>\n<li><i>key<\/i> (or <b>name<\/b>)<\/li>\n<li><i>value<\/i> (numerical)<\/li>\n<\/ul>\n<p> &#8230; properties, to add to the pre-existing, and still available, the &#8220;starting with&#8221; <b><i>name<\/i><\/b> filtering functionality we&#8217;ve had working ever since <a title='Worldbank API World Country Population Report Tutorial' href='#wawcprt'>Worldbank API World Country Population Report Tutorial<\/a> as shown way below.<\/p>\n<p>RegEx &#8220;thinking&#8221; exists for both server and client parts of web applications, for us, consecutively with &#8230;<\/p>\n<ul>\n<li>PHP (<a target=_blank title='PHP regex' href='http:\/\/php.net\/manual\/en\/function.preg-match.php'>RegEx<\/a>)<\/li>\n<li>Javascript (<a target=_blank title='Javascript regex' href='http:\/\/www.w3schools.com\/jsref\/jsref_obj_regexp.asp'>RegEx<\/a>)<\/li>\n<\/ul>\n<p> &#8230; and we use it with serverside PHP today, under the auspices of the <a target=_blank title='PHP regex' href='http:\/\/php.net\/manual\/en\/function.preg-match.php'>preg_match<\/a> function, though we most often use RegEx thinking with the Javascript <a target=_blank title='Javascript string replace function information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/jsref_replace.asp'><i>replace<\/i><\/a> function, as the way to make substitutions for more than one occurrence, (the one occurrence design being) a default &#8220;curiosity&#8221; (but can be useful too) about Javascript&#8217;s version of substitution.  You may know this RegEx usage of the Javascript replace function as &#8220;global substitution&#8221;.<\/p>\n<p>If you&#8217;re new to RegEx thinking let me outline just a few tips &#8230;<\/p>\n<ul>\n<li>^ can mean &#8220;start of&#8221;<\/li>\n<li>$ can mean &#8220;end of&#8221;<\/li>\n<li>. can sometimes mean &#8220;one existant character wildcard&#8221; &#8230; or sometimes it is % or ? for this in other &#8220;systems&#8221;<\/li>\n<li>* can often mean &#8220;zero or more of preceding character wildcard&#8221;<\/li>\n<li>[] and () bracketing rules are pretty crucial for the more esoteric usages &#8230; also study | usage<\/li>\n<\/ul>\n<p>In our tutorial picture we are showing &#8220;land$&#8221; countries that would feature, if <i>Greenland<\/i> goes independent one day &#8230;<\/p>\n<ul>\n<li>Greenland &#8230; &#8220;full of ice&#8221; <a target=_blank title='?' href='http:\/\/www.thecine-files.com\/the-player-robert-altman-1992\/'>&#8230; and &#8230;<\/a><\/li>\n<li>Iceland &#8230; &#8220;full of green&#8221;<\/li>\n<\/ul>\n<p>Again, both &#8220;parent&#8221; HTML and &#8220;child&#8221; PHP changed today so that &#8230;<\/p>\n<ul>\n<li>&#8220;parent&#8221; supervisory <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> has HTML (and Javascript and CSS) you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html-----GETME\" title=\"worldbank_population_data.htm\">worldbank_population_data.htm<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html-----GETME\" title=\"worldbank_population_data.htm\">this way<\/a><\/li>\n<li>&#8220;child&#8221; supervised you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php------GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php------GETME\" title=\"worldbank_population_data.php\">this way<\/a><\/li>\n<\/ul>\n<p> &#8230; to facilitate better (optional) Country <b><i>name<\/i><\/b> filtering for users of the web application.<\/p>\n<hr>\n<p id='wawcrrt'>Previous relevant <a target=_blank title='Worldbank API World Country Reporting Range Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-reporting-range-tutorial\/'>Worldbank API World Country Reporting Range 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\/worldbank_population_data.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API World Country Reporting Range Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_range.jpg\" title=\"Worldbank API World Country Reporting Range Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API World Country Reporting Range Tutorial<\/p><\/div>\n<p>If you&#8217;ve been keeping up to date with the latest thread of blog postings regarding our &#8220;Worldbank API World Country Reporting Project&#8221; web application, you&#8217;ll notice that there is no mention of a <a target=_blank title='Worldbank data source' href='http:\/\/wdi.worldbank.org\/'>Worldbank<\/a> <a target=_blank title='Worldbank API documentation' href='https:\/\/datahelpdesk.worldbank.org\/knowledgebase\/articles\/898581-api-basic-call-structure'>API<\/a> <a target=_blank title='World Bank indicators information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/World_Development_Indicators'>indicators<\/a> in the blog title.  That is because we still have &#8220;generic&#8221; matters to consider, but that is not an imposition to the web application design today.  Today, as well as &#8230;<\/p>\n<ul>\n<li>the original alphabetic <i>starting with<\/i> country filter (to <i>key<\/i> below) &#8230; we&#8217;ve added, today, a &#8230;<\/li>\n<li><b>value <i>&#8220;range&#8221;<\/i> filter<\/b> (to <i>value<\/i> below) applied to the reporting theme&#8217;s numerical value<\/li>\n<\/ul>\n<p> &#8230; and because everything reported on has a &#8230;<\/p>\n<ul>\n<li><i>key<\/i> (or name)<\/li>\n<li><i>value<\/i> (<b>numerical<\/b>)<\/li>\n<\/ul>\n<p> &#8230; basis, we can apply today&#8217;s <b>value <i>&#8220;range&#8221;<\/i> filter<\/b> generically &#8220;across the board&#8221; (for any of the indicators &#8220;Population&#8221; and &#8220;Gross Domestic Product&#8221;, so far).<\/p>\n<p>Why do we use the word &#8220;filter&#8221; here?  Well, a filter limits something, and we&#8217;re limiting the maximum amount of output data reported on, by, optionally, taking what a user says about the minimum and maximum (numerical) value ranges for data reporting.<\/p>\n<p>In the case of <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>, when there is lots of data too close together to view it definitively, it does some clever data reduction, and we have a means today, to get in under that data reduction to more esoteric reporting possibilities, as a result of our new filter, used well by the user.<\/p>\n<p>Let&#8217;s show you how a cluttered <a id='aciframe' href='#aciframe' onclick=\"document.getElementById('ciframe').style.display='block'; document.getElementById('ciframe').src='http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php?startswith=C&#038;year=2015&#038;yearvs=-2011&#038;justletters=y'; \">http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php?startswith=C&#038;year=2015&#038;yearvs=-2011&#038;justletters=y<\/a> &#8230;<\/p>\n<p><iframe id='ciframe' style='width:100%;height:800px;display:none;' src='about:blank' title='Cluttered'><\/iframe><\/p>\n<p> &#8230; can become uncluttered <a id='aniframe' href='#aniframe' onclick=\"document.getElementById('niframe').style.display='block'; document.getElementById('niframe').src='http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php?startswith=C&#038;year=2015&#038;yearvs=-2011&#038;max=40000000&#038;justletters=y'; \">http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php?startswith=C&#038;year=2015&#038;yearvs=-2011&#038;max=40000000&#038;justletters=y<\/a> for those smaller values, by using this <b>value <i>&#8220;range&#8221;<\/i> filter<\/b> below &#8230;<\/p>\n<p><iframe id='niframe' style='width:100%;height:800px;display:none;' src='about:blank' title='Not so cluttered'><\/iframe><\/p>\n<p>So yet again, both &#8220;parent&#8221; HTML and &#8220;child&#8221; PHP changed today so that &#8230;<\/p>\n<ul>\n<li>&#8220;parent&#8221; supervisory <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> has HTML (and Javascript and CSS) you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html----GETME\" title=\"worldbank_population_data.htm\">worldbank_population_data.htm<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html----GETME\" title=\"worldbank_population_data.htm\">this way<\/a><\/li>\n<li>&#8220;child&#8221; supervised you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php-----GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php-----GETME\" title=\"worldbank_population_data.php\">this way<\/a> that if you examine you can see the use of PHP cookie methods for the first time here (as we usually use Javascript), specifically, reading and creating (via PHP <a target=_blank href='http:\/\/php.net\/manual\/en\/function.setcookie.php' title='PHP setcookie method'>setcookie<\/a> method) <a target=_blank title='Cookie information from w3schools' href='http:\/\/www.w3schools.com\/js\/js_cookies.asp'><i>HTTP Cookies<\/i><\/a> as per the code &#8230;<br \/>\n<code><br \/>\nfunction rangeget($basis) {<br \/>\n  global $reportmode;<br \/>\n  $cookie_name = \"Worldbank_\" . str_replace(\" \",\"_\",$reportmode) . \"_\" . $basis;<br \/>\n  if (isset($_COOKIE[$cookie_name])) {<br \/>\n    return $_COOKIE[$cookie_name];<br \/>\n  }<br \/>\n  return 0.0;<br \/>\n}<br \/>\n<b><\/b><br \/>\nfunction rangeset($basis, $val) {<br \/>\n  global $reportmode, $startswith;<br \/>\n  if ($startswith == \"\") {<br \/>\n   $cookie_name = \"Worldbank_\" . str_replace(\" \",\"_\",$reportmode) . \"_\" . $basis;<br \/>\n   $cookie_value = $val;<br \/>\n   setcookie($cookie_name, $cookie_value, time() + (86400 * 30), \"\/PHP\/\"); \/\/ 86400 = 1 day<br \/>\n   return $val;<br \/>\n  }<br \/>\n  return rangeget($basis);<br \/>\n}<br \/>\n<\/code>\n<\/li>\n<\/ul>\n<p>And so yet again, we would welcome you trying this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> for yourself to try out the new value range filtering functionality that we also talk about at WordPress 4.1.1&#8217;s <a target=_blank title='Worldbank API World Country Reporting Range Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-reporting-range-tutorial\/'>Worldbank API World Country Reporting Range Tutorial<\/a>.<\/p>\n<hr>\n<p id='wawcgdpt'>Previous relevant <a target=_blank title='Worldbank API World Country Gross Domestic Product Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-gross-domestic-product-tutorial\/'>Worldbank API World Country Gross Domestic Product 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\/worldbank_population_data.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API World Country Gross Domestic Product Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_gdp.jpg\" title=\"Worldbank API World Country Gross Domestic Product Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API World Country Gross Domestic Product Tutorial<\/p><\/div>\n<p>We&#8217;ve changed onion types today in our quest for the ultimate <a target=_blank title='onions' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/?s=onion'>&#8220;onion of the 4th dimension&#8221;<\/a> concept this project, that being our <font size=1>&#8230; oops, the goalposts have shifted &#8230;<\/font>  web application project &#8220;Worldbank API World Country <strike>Population<\/strike> Report Project&#8221; where we extend the &#8220;scope&#8221; of the <a target=_blank title='World Bank indicators information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/World_Development_Indicators'>&#8220;indicators&#8221;<\/a> we can report on to those we presented yesterday with <a title='Worldbank API World Country Population Period Tutorial' href='#wacppt'>Worldbank API World Country Population Period Tutorial<\/a>, those being the original &#8230;<\/p>\n<ul>\n<li>Population &#8230; and today we add to that, the World Bank &#8220;indicator&#8221; &#8230;<\/li>\n<li><a target=_blank title='Gross Domestic Product information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Gross_domestic_product'><b>Gross Domestic Product<\/b><\/a><\/li>\n<\/ul>\n<p> &#8230; and here you may have sneaked a peek below to see that &#8230;<\/p>\n<ul>\n<li>nothing codewise has been added to in terms of &#8220;pieces of code&#8221; &#8230; we thank the excellence of (the organization of the) <a target=_blank title='Worldbank data source' href='http:\/\/wdi.worldbank.org\/'>Worldbank<\/a> <a target=_blank title='Worldbank API documentation' href='https:\/\/datahelpdesk.worldbank.org\/knowledgebase\/articles\/898581-api-basic-call-structure'>API<\/a> for this, as the form of the GDP data is not enough different to that of the Population data to warrant us thinking that we needed to change anything other than versions &#8230; and &#8230;<\/li>\n<li>nothing codewise has been renamed in terms of &#8220;pieces of code&#8221; &#8230; and that is us &#8230; we&#8217;re not embarrassed that a &#8220;guinea pig&#8221; for an idea gets extended into a bigger picture &#8230; so long as &#8220;Worldbank&#8221; is there in the name somewhere<\/li>\n<\/ul>\n<p>This &#8220;guinea pig&#8221; method of extending a project has its advantages and disadvantages as most methods of doing things (inherently) have (their own) advantages and disadvantages.  The &#8220;guinea pig&#8221; approach may suffer if things become complex later when you try to fit in another &#8220;extended&#8221; concept that is a bit of a &#8220;square hole&#8221; being forced into our &#8220;round socket&#8221; &#8230; (&#128516;&#128150;&#128308;).  Conversely, if things stay simple enough, why not use methods like &#8230;<\/p>\n<ul>\n<li>plugging in a programmatic <a target=_blank title='Computer Science variable information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Variable_(computer_science)'>&#8220;variable&#8221;<\/a> where once there was a &#8220;hardcoding&#8221; &#8230; and &#8230;<\/li>\n<li>plugging in (the equivalent of) an HTML select element &#8220;dropdown&#8221; where once there was a titular piece of text<\/li>\n<\/ul>\n<p> &#8230; to keep on pushing out the &#8220;onion&#8221; types <font size=1>&#8230; we know you&#8217;re out there<\/font> <font size=2>&#8230; come an&#8217; show us the cut of your jib<\/font>!<\/p>\n<p>Yet again, both &#8220;parent&#8221; HTML and &#8220;child&#8221; PHP changed today for the new extended &#8220;indicator&#8221; reporting (adding GDP to pre-existing Population indicator(s)), so that &#8230;<\/p>\n<ul>\n<li>&#8220;parent&#8221; supervisory <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> has HTML (and Javascript and CSS) you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html---GETME\" title=\"worldbank_population_data.htm\">worldbank_population_data.htm<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html---GETME\" title=\"worldbank_population_data.htm\">this way<\/a><\/li>\n<li>&#8220;child&#8221; supervised you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php----GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php----GETME\" title=\"worldbank_population_data.php\">this way<\/a><\/li>\n<\/ul>\n<p>And yet again, we would welcome you trying this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> for yourself to try out this new &#8220;layer&#8221; of functionality &#8220;positioning&#8221;.<\/p>\n<hr>\n<p id='wacppt'>Previous relevant <a target=_blank title='Worldbank API World Country Population Period Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-population-period-tutorial\/'>Worldbank API World Country Population Period 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\/worldbank_population_data.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API World Country Population Period Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_others.jpg\" title=\"Worldbank API World Country Population Period Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API World Country Population Period Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s <a title='Worldbank API World Country Population Trend Tutorial' href='#wawcptt'>Worldbank API World Country Population Trend Tutorial<\/a> started us on the topic of &#8220;trends&#8221; with data and our <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> Pie Chart Differences representation of <a target=_blank title='Worldbank data source' href='http:\/\/wdi.worldbank.org\/'>Worldbank<\/a> <a target=_blank title='Worldbank API documentation' href='https:\/\/datahelpdesk.worldbank.org\/knowledgebase\/articles\/898581-api-basic-call-structure'>API<\/a> derived data took the form of the first of &#8230;<\/p>\n<ul>\n<li>snapshot (of two different snapshotted times) &#8230; but today we turn our attention to &#8230;<\/li>\n<li><b>period of time<\/b> (of several regular snapshotted times)<\/li>\n<\/ul>\n<p> &#8230; and for the purposes of this latter &#8220;chart&#8221; reporting we like, around here, still talking in terms of <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>, in order of our opinion &#8220;regarding quality of reporting purpose&#8221; with regard to this Worldbank API Population data reporting &#8230;<\/p>\n<ul>\n<li>Line Chart<\/li>\n<li>Column Chart<\/li>\n<li>Bar Chart<\/li>\n<li>Area Chart<\/li>\n<\/ul>\n<p> &#8230; all Google Chart &#8220;types&#8221; looking for the same basic form of data, the hint, in the first place, why we associate these all together with that new <i>period of time<\/i> reporting options we&#8217;ve integrated into the web application at the &#8220;parent&#8221; HTML supervisor level by, for every new <i>option<\/i> from yesterday of the form <i>[year] compared to<\/i> in that top lefthand HTML select element &#8220;dropdown&#8221;, we also add in an associated <i>[year] through to<\/i> &#8220;dropdown&#8221; <i>option<\/i> which, if selected, will present the user with the opportunity to select the type of Google Chart they&#8217;d like to see from the list of four chart types as described above.<\/p>\n<p>Again, both &#8220;parent&#8221; HTML and &#8220;child&#8221; PHP changed today for that <b>period of time<\/b> concept of reporting, so that &#8230;<\/p>\n<ul>\n<li>&#8220;parent&#8221; supervisory <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> has HTML (and Javascript and CSS) you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html--GETME\" title=\"worldbank_population_data.htm\">worldbank_population_data.htm<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html--GETME\" title=\"worldbank_population_data.htm\">this way<\/a><\/li>\n<li>&#8220;child&#8221; supervised you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php---GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php---GETME\" title=\"worldbank_population_data.php\">this way<\/a><\/li>\n<\/ul>\n<p>And again, we would welcome you trying this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.htm\" title=\"Click picture\">web application<\/a> for yourself, to get this into perspective regarding perhaps, your own opinions about the pros and cons, strengths and weaknesses of the various very useful Google Chart ideas we appreciate for those reporting tasks, helping support the adage &#8220;every picture is worth a thousand words&#8221;.<\/p>\n<hr>\n<p id='wawcptt'>Previous relevant <a target=_blank title='Worldbank API World Country Population Trend Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-population-trend-tutorial\/'>Worldbank API World Country Population Trend 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\/worldbank_population_data.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API World Country Population Trend Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_trend.jpg\" title=\"Worldbank API World Country Population Trend Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API World Country Population Trend Tutorial<\/p><\/div>\n<p>The <a target=_blank title='onions' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/?s=onion'>&#8220;onion of the 4th dimension&#8221;<\/a> way to go (after yesterday&#8217;s <a title='Worldbank API World Country Population Report Tutorial' href='#wawcprt'>Worldbank API World Country Population Report Tutorial<\/a> as shown below) for our latest web application project &#8220;Worldbank API World Country Population&#8221; we like is to now start thinking of a means to show &#8220;trends&#8221; in population.  With this in mind there is a ready made <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> Pie Chart Differences to help here.  With the Google Chart Pie Chart Differences we&#8217;ll supply two different years worth of data, and the cleverness of this Google Chart product is called into play to show three Pie Charts, namely &#8230;<\/p>\n<ul>\n<li>original year&#8217;s Pie Chart <a target=_blank title='Worldbank data source' href='http:\/\/wdi.worldbank.org\/'>Worldbank<\/a> <a target=_blank title='Worldbank API documentation' href='https:\/\/datahelpdesk.worldbank.org\/knowledgebase\/articles\/898581-api-basic-call-structure'>API<\/a> data<\/li>\n<li><b>&#8220;compared to&#8221; year<\/b>&#8216;s Pie Chart data<\/li>\n<li>a Google Chart Pie Chart Differences &#8220;trend&#8221; Pie Chart showing an &#8220;inner ring&#8221; Pie Chart within an &#8220;outer ring&#8221; Pie Chart where you can get a sense of &#8220;trends&#8221; that are taking place<\/li>\n<\/ul>\n<p> &#8230; that is manifested in the &#8220;parent&#8221; HTML code by changing the previous hardcoded <i>&#8220;Year&#8221;<\/i> word with an HTML select element &#8220;dropdown&#8221; element to define that optional <b>second &#8220;compared to&#8221; year of interest<\/b>.<\/p>\n<p>The other new functionality today is a &#8220;share&#8221; via Email emoji (HTML <i>a<\/i> link &#8220;button&#8221;) that latches on to the user&#8217;s Email client program via <a target=_blank title='' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/middle-word-game-share-tutorial\/'>Middle Word Share Tutorial<\/a>&#8216;s approach, namely &#8230;<\/p>\n<blockquote><p>\nmailto:[emailAddress]?subject=[Subject]&#038;body=[URLtoLinkTo] type of href property (on that link). As you can imagine, it is possible to piece together a Javascript encodeURIComponent() version of [URLtoLinkTo] value via the current webpage\u2019s document.URL\n<\/p><\/blockquote>\n<p> &#8230; the curious variation being that we don&#8217;t think of the &#8220;parent&#8221; HTML&#8217;s <i>document.URL<\/i> here (in blurb above), but, rather, it is more useful to consider the &#8220;child&#8221; HTML iframe element PHP&#8217;s <i>document.URL<\/i> both as an easier to code concept, and the simplifier of &#8220;length of data&#8221; GET vs POST HTML form element originated data issues.  You see, if your data getting to the Pie Chart is over a certain length, it will be POSTed and you would lose the opportunity to Email this (in that <i>mailto:<\/i> email client program way), because you rely on real GET method URLs for this approach.  At the &#8220;view&#8221; of the middle &#8220;child&#8221; PHP, though, it gets its calls, always, in a GET URL way, so it is, counterintuitively, the best (and simplest) place to intervene and code for this Email &#8220;share&#8221; functionality.<\/p>\n<p>Both &#8220;parent&#8221; HTML and &#8220;child&#8221; PHP changed today, so that &#8230;<\/p>\n<ul>\n<li>&#8220;parent&#8221; supervisory <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html\" title=\"Click picture\">web application<\/a> has HTML (and Javascript and CSS) you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html-GETME\" title=\"worldbank_population_data.html\">worldbank_population_data.html<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html-GETME\" title=\"worldbank_population_data.html\">this way<\/a><\/li>\n<li>&#8220;child&#8221; supervised you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php--GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> changed in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php--GETME\" title=\"worldbank_population_data.php\">this way<\/a><\/li>\n<\/ul>\n<p>We would welcome you trying this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html\" title=\"Click picture\">web application<\/a> for yourself, to get this into perspective.<\/p>\n<hr>\n<p id='wawcprt'>Previous relevant <a target=_blank title='Worldbank API World Country Population Report Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-population-report-tutorial\/'>Worldbank API World Country Population Report 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\/worldbank_population_data.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API World Country Population Report Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data_report.jpg\" title=\"Worldbank API World Country Population Report Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API World Country Population Report Tutorial<\/p><\/div>\n<p>In yesterday&#8217;s <a title='Worldbank API World Country Population Primer Tutorial' href='#wawcppt'>Worldbank API World Country Population Primer Tutorial<\/a>, as shown below, we noted &#8230;<\/p>\n<blockquote><p>\nthe data is presented in some way shape or form with the Pie Chart, but for all the advantages of <i>lots of information in the one place<\/i>, it does suffer a bit with <i>clutter<\/i>\n<\/p><\/blockquote>\n<p> &#8230; and today we show some practical strategies to be more clear (less <i>cluttered<\/i>) with the data, should the user, optionally, be interested, here.<\/p>\n<p>In practical terms, we built a supervisory HTML &#8220;parent&#8221; you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html_GETME\" title=\"worldbank_population_data.html\">worldbank_population_data.html<\/a> (with this new <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html\" title=\"Click picture\">live run<\/a> link) on top of yesterday&#8217;s &#8220;duck with the legs moving fast&#8221; hard working &#8220;child&#8221; HTML iframe element housed PHP <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php-GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> (changed <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php-GETME\" title=\"worldbank_population_data.php\">this way<\/a> to accomodate this move).<\/p>\n<p>If you had to break up a huge chunk of <a target=_blank title='Worldbank data source' href='http:\/\/wdi.worldbank.org\/'>Worldbank<\/a> <a target=_blank title='Worldbank API documentation' href='https:\/\/datahelpdesk.worldbank.org\/knowledgebase\/articles\/898581-api-basic-call-structure'>API<\/a> data related to World Countries and their Population, what would you research as an idea to do this?   No doubt a lot of people would agree with how we approach it, that being &#8230;<\/p>\n<p><code><br \/>\nreport via a \"starting with\" <i>alphabetic<\/i> criteria<br \/>\n<\/code><\/p>\n<p>Makes sense?  We hope so, and we&#8217;ll also ask for a <i>Year<\/i> of interest, with the caveat that we should offer the user the &#8220;absolute thinking&#8221; that would say if you are doing a report on &#8230;<\/p>\n<p><code><br \/>\nPopulation by World Country A for year 2015<br \/>\n<\/code><\/p>\n<p> &#8230; for example, you should offer the user to show Pie Charts for the two scenarios below &#8230;<\/p>\n<ul>\n<li>World Country A Populations compared to each other &#8230; or &#8230;<\/li>\n<li>World Country A Populations compared to each other and a Non-A Population entry (which totals all non-A country populations)<\/li>\n<\/ul>\n<p>We could present these functionality options in an HTML select element &#8220;dropdown&#8221;, but we think today, we&#8217;ll use a top menu of HTML <i>a<\/i> links to interface to the user of this &#8220;parent&#8221; supervisory <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.html\" title=\"Click picture\">web application<\/a> we welcome you to try out for yourself.<\/p>\n<hr>\n<p id='wawcppt'>Previous relevant <a target=_blank title='Worldbank API World Country Population Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-world-country-population-primer-tutorial\/'>Worldbank API World Country Population Primer 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\/worldbank_population_data.php\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Worldbank API World Country Population Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.jpg\" title=\"Worldbank API World Country Population Primer Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Worldbank API World Country Population Primer Tutorial<\/p><\/div>\n<p>Today we&#8217;re revisiting the absolutely astonishing resource that the <a target=_blank title='Worldbank data source' href='http:\/\/wdi.worldbank.org\/'>Worldbank<\/a> <a target=_blank title='Worldbank API documentation' href='https:\/\/datahelpdesk.worldbank.org\/knowledgebase\/articles\/898581-api-basic-call-structure'>API<\/a> website provides.  Such free public sources of data are very much appreciated in our books.  <font size=1>Not so much in our pamphlets, but definitely in the books.<\/font>  Revisiting we thought, perhaps, we heard you ask <font size=1>&#8230; or were you passing wind<\/font>?   Glad you asked.  Remember when we presented <a title='PHP Worldbank Growth of Merchandise Trade Tutorial' href='#pwgomtt'>PHP Worldbank Growth of Merchandise Trade Tutorial<\/a>, as shown below?   Then, we used <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> Bubble Chart to present reams of information.  Today, we again broach &#8220;reams&#8221; of Wordbank Population data per country to present a Google Chart Pie Chart report.<\/p>\n<p>On our &#8220;first draft&#8221; of this web application project we create just the one pie chart, but we do that, along the way showing you a couple of things &#8230;<\/p>\n<ul>\n<li>the &#8220;reams&#8221; of data is processed on the understanding it could be sent to an HTML iframe as a URL plonked into that iframe element&#8217;s <i>src<\/i> property <font size=1>(as if)<\/font>, or if that URL is too long then that data is plugged into the HTML form and then sent (POSTed) to that same HTML iframe (whose <i>name<\/i> is the same as the form element&#8217;s target=<i>name<\/i>) via an HTML form element whose <i>action<\/i> property is set to &#8230;<br \/>\n<code><br \/>\n<a target=_blank title='Google Chart Pie Chart' href='http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php'>http:\/\/www.rjmprogramming.com.au\/PHP\/PieChart\/pie_chart.php<\/a><br \/>\n<\/code>\n<\/li>\n<li>the data is presented in some way shape or form with the Pie Chart, but for all the advantages of <i>lots of information in the one place<\/i>, it does suffer a bit with <i>clutter<\/i><\/li>\n<\/ul>\n<p> &#8230; and so we try some strategies to help with those <i>clutter<\/i> issues above in blog postings to come.<\/p>\n<p>In the meantime, why not try a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php\" title=\"Click picture\">live run<\/a> of the underlying PHP (serverside) web application you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/worldbank_population_data.php_GETME\" title=\"worldbank_population_data.php\">worldbank_population_data.php<\/a> featuring &#8230;<\/p>\n<ul>\n<li>use of PHP <a target=_blank title='PHP file_get_contents() method information' href='http:\/\/php.net\/manual\/en\/function.file-get-contents.php'>file_get_contents()<\/a> to extract &#8230;<\/li>\n<li><a target=_blank title='JSON information from w3schools' href='https:\/\/www.w3schools.com\/js\/js_json_intro.asp'>JSON<\/a> data is extracted and parsed to help piece together that URL to the Google Chart Pie Chart, as mentioned way above<\/li>\n<\/ul>\n<hr>\n<p id='pwgomtt'>Previous relevant <a target=_blank title='PHP Worldbank Growth of Merchandise Trade Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/php-worldbank-growth-of-merchandise-trade-tutorial\/'>PHP Worldbank Growth of Merchandise Trade 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\/BubbleChart\/growth_of_merchandise_trade.php\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"PHP Worldbank Growth of Merchandise Trade Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BubbleChart\/growth_of_merchandise_trade.jpg\" title=\"PHP Worldbank Growth of Merchandise Trade Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">PHP Worldbank Growth of Merchandise Trade Tutorial<\/p><\/div>\n<p>We&#8217;ve said it before, and (no doubt) we&#8217;ll say it again &#8230; there are great public data sources out there for you to explore.<\/p>\n<p>As far as international data goes the <a target=_blank title='Worldbank data source' href='http:\/\/wdi.worldbank.org\/'>Worldbank<\/a> series of statistics is great, so, thanks.<\/p>\n<p>Today we combine the Worldbank data for <a target=_blank title='Growth of Merchandise Trade 2003-2013' href='http:\/\/wdi.worldbank.org\/table\/6.1'>Growth of Merchandise Trade 2003-2013<\/a> with the wonderful <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> Bubble Chart to create (52 = (first letters of country name) 26 x 2 (concepts: Exports and Imports)) reporting charts of interest, we hope.  Again, as with any reporting subject, it is a personal thing, whether the subject matter of a report is of interest, but you could say that about so many things in life.<\/p>\n<p>So, we offer some PHP source code you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BubbleChart\/growth_of_merchandise_trade.php_GETME\" title='growth_of_merchandise_trade.php'>growth_of_merchandise_trade.php<\/a> and a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BubbleChart\/growth_of_merchandise_trade.php\" title=\"Click picture\">live run<\/a> link as well, the full loading of which requires patience.<\/p>\n<p><b><i>Stop Press<\/i><\/b><\/p>\n<p>Tomorrow we go over what was needed to change PHP code above to be more mobile friendly &#8230;<\/p>\n<blockquote>\n<ul>\n<li><a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BubbleChart\/growth_of_merchandise_trade.php-GETME\" title=\"growth_of_merchandise_trade.php\" target=\"_blank\">growth_of_merchandise_trade.php<\/a> <a href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/BubbleChart\/growth_of_merchandise_trade.php-GETME\" title=\"growth_of_merchandise_trade.php\" target=\"_blank\">changes<\/a> (to cater for select event (mobile touch) functionality) and <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/BubbleChart\/growth_of_merchandise_trade.php\" title='growth_of_merchandise_trade.php'>live run<\/a> link for yesterday&#8217;s web application<\/li>\n<\/ul>\n<\/blockquote>\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='#d19609' onclick='var dv=document.getElementById(\"d19609\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/php\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d19609' 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='#d28262' onclick='var dv=document.getElementById(\"d28262\"); 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='d28262' 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='#d28278' onclick='var dv=document.getElementById(\"d28278\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/report\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d28278' 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='#d28303' onclick='var dv=document.getElementById(\"d28303\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/trend\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d28303' 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='#d28318' onclick='var dv=document.getElementById(\"d28318\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/chart\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d28318' 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='#d28331' onclick='var dv=document.getElementById(\"d28331\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/variable\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d28331' 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='#d28360' onclick='var dv=document.getElementById(\"d28360\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/cookie\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d28360' 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='#d28409' onclick='var dv=document.getElementById(\"d28409\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/regex\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d28409' 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='#d47683' onclick='var dv=document.getElementById(\"d47683\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/pie-chart\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d47683' 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='#d47688' onclick='var dv=document.getElementById(\"d47688\"); 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='d47688' 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='#d47695' onclick='var dv=document.getElementById(\"d47695\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/mobile\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d47695' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Yesterday&#8217;s Worldbank API Comparison Year Pie Chart Differences Tutorial involved Google Charts Pie Chart Difference graphics that &#8230; needed work to be functional on mobile platforms, allowing for some Javascript tweaking of the options of those Google ChartPie Chart Difference &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/worldbank-api-comparison-year-google-chart-mobile-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,14,37],"tags":[2543,130,199,231,518,630,699,795,932,944,997,1319,3196],"class_list":["post-47695","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-tutorials","tag-area-chart","tag-bar-chart","tag-chart","tag-column-chart","tag-google-chart","tag-ipad","tag-line-chart","tag-mobile","tag-php","tag-pie-chart","tag-programming","tag-tutorial","tag-worldbank-api"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/47695"}],"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=47695"}],"version-history":[{"count":7,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/47695\/revisions"}],"predecessor-version":[{"id":47702,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/47695\/revisions\/47702"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=47695"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=47695"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=47695"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}