{"id":44593,"date":"2019-04-14T03:01:59","date_gmt":"2019-04-13T17:01:59","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=44593"},"modified":"2019-04-13T19:35:00","modified_gmt":"2019-04-13T09:35:00","slug":"australian-postcode-place-distances-map-chart-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/australian-postcode-place-distances-map-chart-tutorial\/","title":{"rendered":"Australian Postcode Place Distances Map Chart Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/PHP\/australia_place_crowfly_distances.php\"><img decoding=\"async\" style=\"float:left;border: 15px solid pink;\" alt=\"Australian Postcode Place Distances Map Chart Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/australiaplacecrowflydistances.jpg\" title=\"Australian Postcode Place Distances Map Chart Tutorial\"   \/><\/a><p class=\"wp-caption-text\">Australian Postcode Place Distances Map Chart Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s &#8220;where of life&#8221; themed <a title='Australian Postcode Place Distances Primer Tutorial' href='#appdpt'>Australian Postcode Place Distances Primer Tutorial<\/a> lacked something  &#8230; <a target=_blank title='?' href='https:\/\/www.youtube.com\/watch?v=uhiCFdWeQfA'>anyone, anyone<\/a>? &#8230; yes, <a target=_blank title='Anaximander information from Wikipedia, thanks' href='https:\/\/en.wikipedia.org\/wiki\/Anaximander'>Anaximander<\/a> &#8230; a map <font size=1>&#8230; and you&#8217;d like to swap my horse for one<\/font> <font size=2>&#8230; well okay, there&#8217;s one called Ed out the back<\/font> &#8230; but we digress.<\/p>\n<p>Queue the great <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 title='Google Chart Map Chart' href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/map'>Map Chart<\/a> (which can transition very easily to <a target=_blank title='Google Chart Map Chart' href='https:\/\/developers.google.com\/chart\/interactive\/docs\/gallery\/geochart'>Geo Chart<\/a>, where &#8220;from&#8221; to &#8220;to&#8221; lines are drawn) and which can be called in an HTML iframe element to add that visual interest to <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/australia_place_crowfly_distances.php-GETME\" title=\"australia_place_crowfly_distances.php\">our changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/australia_place_crowfly_distances.php-GETME\">australia_place_crowfly_distances.php<\/a>&#8216;s  <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/PHP\/australia_place_crowfly_distances.php\" title=\"Click picture\">live run<\/a> link.<\/p>\n<p>There isn&#8217;t anything much better than a map to trip plan, or study geography, in our books <font size=1>&#8230; but alas we ran out of pamphlettes today &#8230; sorrrrrrryyyyyy<\/font>.<\/p>\n<hr>\n<p id='appdpt'>Previous relevant <a target=_blank title='Australian Postcode Place Distances Primer Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/australian-postcode-place-distances-primer-tutorial\/'>Australian Postcode Place Distances Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/PHP\/australia_place_crowfly_distances.php\"><img decoding=\"async\" style=\"float:left;border: 15px solid pink;\" alt=\"Australian Postcode Place Distances Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/australia_place_crowfly_distances.jpg\" title=\"Australian Postcode Place Distances Primer Tutorial\"   \/><\/a><p class=\"wp-caption-text\">Australian Postcode Place Distances Primer Tutorial<\/p><\/div>\n<p>It&#8217;s time to return to a &#8220;where of life&#8221; web application tutorial.  Why?  No, &#8220;where&#8221;.  Who&#8217;s <a target=_blank title=\"?\" href='https:\/\/www.youtube.com\/watch?v=RatKhtboq2E'>on second<\/a>.  But, seriously, the reason is that we found a great <a target=_blank title='https:\/\/www.matthewproctor.com\/australian_postcodes' href='\/\/www.matthewproctor.com\/australian_postcodes'>Australian Postcode resource<\/a> for geodata lookups of these Australian placenames or postcodes &#8230; thanks.<\/p>\n<p>Combine this &#8230;<\/p>\n<ul>\n<li>Australian postcode (or placename) latitude and longitude &#8230; with &#8230;<\/li>\n<li>another Australian postcode (or placename) latitude and longitude &#8230; and we can &#8230;<\/li>\n<li>show the user a great circle distance between the two places &#8230; as well as a link to &#8230;<\/li>\n<li><a target=_blank title='Google Maps Directions' href='http:\/\/www.google.com\/maps\/dir\/'>Google Maps Directions<\/a> map between the two places &#8230; and there you can imagine we have a bit of a &#8230;<\/li>\n<li>trip planner<\/li>\n<\/ul>\n<p> &#8230; on our hands.<\/p>\n<p>We can add our own client <b>geographical position<\/b> into the mix via &#8230;<\/p>\n<p><code><br \/>\n    function getLocation() {<br \/>\n      if (navigator.geolocation) {<br \/>\n       try {<br \/>\n        <b><a target=_blank title='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Geolocation\/getCurrentPosition' href='http:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Geolocation\/getCurrentPosition'>navigator.geolocation.getCurrentPosition<\/a>(showPosition);<\/b><br \/>\n        setTimeout(later, 2000);<br \/>\n        } catch(err) {<br \/>\n        setTimeout(later, 2000);<br \/>\n        }<br \/>\n      } else {<br \/>\n        document.getElementById('you').innerHTML='(0,0)';<br \/>\n        if (document.getElementById('inlat') && document.getElementById('inlong')) {<br \/>\n          document.getElementById('inlat').value=userlatitude;<br \/>\n          document.getElementById('inlong').value=userlongitude;<br \/>\n        }<br \/>\n        if (document.getElementById('ipostcode')) {<br \/>\n          document.getElementById('ipostcode').click();<br \/>\n          newthree();<br \/>\n        }<br \/>\n      }<br \/>\n    }<br \/>\n <br \/> <br \/>\n    function showPosition(position) {<br \/>\n      if (userlatitude == 0.0 && userlongitude == 0.0) {<br \/>\n        userlatitude=eval('' + position.coords.latitude);<br \/>\n        userlongitude=eval('' + position.coords.longitude);<br \/>\n        if (document.getElementById('inlat') && document.getElementById('inlong')) {<br \/>\n          document.getElementById('inlat').value=userlatitude;<br \/>\n          document.getElementById('inlong').value=userlongitude;<br \/>\n        }<br \/>\n        if (document.getElementById('ipostcode')) {<br \/>\n          document.getElementById('ipostcode').click();<br \/>\n          newthree();<br \/>\n        }<br \/>\n      }<br \/>\n    }<br \/>\n<\/code><\/p>\n<p> &#8230; that you can see involved in the PHP <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/australia_place_crowfly_distances.php_GETME\" title=\"australia_place_crowfly_distances.php\">australia_place_crowfly_distances.php<\/a>&#8216;s <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/PHP\/australia_place_crowfly_distances.php\" title=\"Click picture\">live run<\/a> link, for your perusal.<\/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='#d44578' onclick='var dv=document.getElementById(\"d44578\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/geographicals\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d44578' 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='#d44593' onclick='var dv=document.getElementById(\"d44593\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/map\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d44593' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Yesterday&#8217;s &#8220;where of life&#8221; themed Australian Postcode Place Distances Primer Tutorial lacked something &#8230; anyone, anyone? &#8230; yes, Anaximander &#8230; a map &#8230; and you&#8217;d like to swap my horse for one &#8230; well okay, there&#8217;s one called Ed out &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/australian-postcode-place-distances-map-chart-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":[114,2442,1727,1619,480,481,483,518,542,587,745,2126,830,932,2134,2918,2919,997,2920,1238,1311,1694,1319,2580],"class_list":["post-44593","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-tutorials","tag-australia","tag-contenteditable","tag-distance","tag-geo-chart","tag-geodata","tag-geographicals","tag-geolocation","tag-google-chart","tag-great-circle-distance","tag-iframe","tag-map","tag-map-chart","tag-navigation","tag-php","tag-place","tag-placename","tag-postcode","tag-programming","tag-resource","tag-table","tag-trip","tag-trip-planner","tag-tutorial","tag-where"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/44593"}],"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=44593"}],"version-history":[{"count":3,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/44593\/revisions"}],"predecessor-version":[{"id":44596,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/44593\/revisions\/44596"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=44593"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=44593"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=44593"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}