<html>
<head>
<title>Solar System Planets and Sun - RJM Programming, April, 2023</title>
<style>
summary { background-color: yellow; text-shadow: 1px 1px 2px #2dff95; font-size: 28px; }
td { vertical-align: top; }
</style>
<script type=text/javascript>
// Thanks to https://solarsystem.nasa.gov/resources/686/solar-system-sizes/
var pandsnames=['Sun','Mercury','Venus','Earth','Mars','Jupiter','Saturn','Uranus','Neptune'];
var pandsunems=['☀','☿','♀','♁','🍫','♃','♄🪐','♅','♆'];
var pandsradis=[69634,244,605,637,339,6991,5823,1576,1530];
var pandsimgus=['https://www.rjmprogramming.com.au/HTMLCSS/sun.png',
'https://www.rjmprogramming.com.au/HTMLCSS/mercury.png',
'https://www.rjmprogramming.com.au/HTMLCSS/venus.png',
'https://www.rjmprogramming.com.au/HTMLCSS/earth.png',
'https://www.rjmprogramming.com.au/HTMLCSS/mars.png',
'https://www.rjmprogramming.com.au/HTMLCSS/jupiter.png',
'https://www.rjmprogramming.com.au/HTMLCSS/saturn.png',
'https://www.rjmprogramming.com.au/HTMLCSS/uranus.png',
'https://www.rjmprogramming.com.au/HTMLCSS/neptune.png'];
var pandsimgun=['https://solarsystem.nasa.gov/solar-system/sun/overview/',
'https://solarsystem.nasa.gov/planets/mercury/overview/',
'https://solarsystem.nasa.gov/planets/venus/overview/',
'https://solarsystem.nasa.gov/planets/earth/overview/',
'https://solarsystem.nasa.gov/planets/mars/overview/',
'https://solarsystem.nasa.gov/planets/jupiter/overview/',
'https://solarsystem.nasa.gov/planets/saturn/overview/',
'https://solarsystem.nasa.gov/planets/uranus/overview/',
'https://solarsystem.nasa.gov/planets/neptune/overview/'];
var ds=[0,58000000,108000000,150000000,228000000,779000000,1400000000,2900000000,4500000000];
// Thanks to http://hyperphysics.phy-astr.gsu.edu/hbase/Solar/soldata2.html
var omax=[0,69800000,108900000,152100000,249100000,815700000,1503000000,3003000000,4546000000];
var omin=[0,46000000,107500000,147100000,138200000,495100000,1348000000,2739000000,4456000000];
var yedop=[0,88,225,365,687,4333,10759,30687,60190];
var dedop=[0,1408,5832,24,25,10,11,17,16];
var pands='planetsandsun';
var overlaybc='https://www.rjmprogramming.com.au/PHP/BarChart/bar_chart.php?title=Sun&onclick=y&top=350&overlay=%2C[~2010~%2C12]%2C[~2011~%2C13]&label=Planet&value=One&emailto=&emailsubsubject=Subject%20Emailed%20Just%20Needs%20emailto%20to%20have%20emailee%20filled%20in&data=,%20[~Mercury~,23]%20,%20[~Venus~,45]';
var bc='https://www.rjmprogramming.com.au/PHP/BarChart/bar_chart.php?title=Sun&onclick=y&label=Planet&value=One&data=,%20[~Mercury~,23]%20,%20[~Venus~,45]';
function changeit(osel) {
var ij=0, ourbc='', dprefix='';
if (osel.value == 't') {
ourbc=bc.split('&data=')[0].replace('=Sun', '=' + encodeURIComponent('Distance to Sun in Millions of Kilometers')).replace('=One', '=' + encodeURIComponent('Distance to Sun (million kilometers)')) + '&data=';
for (ij=1; ij<pandsnames.length; ij++) {
ourbc+=dprefix + ',%20[~' + pandsnames[ij] + '~,' + eval(ds[ij] / 1000000) + ']';
dprefix='%20';
}
document.getElementById('tdt').innerHTML='';
document.getElementById('tdo').innerHTML='';
document.getElementById('tdy').innerHTML='';
document.getElementById('tdd').innerHTML='';
document.getElementById('tdr').innerHTML='';
document.getElementById('ssmall').innerHTML='Not to Scale Animated GIF and Distance to Sun ...';
document.getElementById('dsmall').style.display='block';
document.getElementById('dsmall').open=true;
document.getElementById('td' + osel.value).innerHTML='<iframe name=stat style=width:800px;height:500px; src="' + ourbc + '" title="Distancce to Sun"></iframe>';
window.open(ourbc, 'stat', 'top=50,left=50,width=800,height=600');
} else if (osel.value == 'r') {
ourbc=bc.split('&data=')[0].replace('=Sun', '=' + encodeURIComponent('Radius Relative to Sun (km)')).replace('=One', '=' + encodeURIComponent('Radius Planet,Radius Sun')) + '&data=';
for (ij=1; ij<pandsnames.length; ij++) {
ourbc+=dprefix + ',%20[~' + pandsnames[ij] + '~,' + eval(10 * pandsradis[ij]) + ',696340]';
dprefix='%20';
}
document.getElementById('tdt').innerHTML='';
document.getElementById('tdo').innerHTML='';
document.getElementById('tdy').innerHTML='';
document.getElementById('tdd').innerHTML='';
document.getElementById('tdr').innerHTML='';
document.getElementById('ssmall').innerHTML='Not to Scale Animated GIF and Radius Relative to Sun ...';
document.getElementById('dsmall').style.display='block';
document.getElementById('dsmall').open=true;
document.getElementById('td' + osel.value).innerHTML='<iframe name=stat style=width:800px;height:500px; src="' + ourbc + '" title="Radius Relative to Sun"></iframe>';
window.open(ourbc, 'stat', 'top=50,left=50,width=800,height=600');
} else if (osel.value == 'o') {
ourbc=bc.split('&data=')[0].replace('=Sun', '=' + encodeURIComponent('Orbit around the Sun (km)')).replace('=One', '=' + encodeURIComponent('Orbit Minimum Distance,Orbit Maximum Distance')) + '&data=';
for (ij=1; ij<pandsnames.length; ij++) {
ourbc+=dprefix + ',%20[~' + pandsnames[ij] + '~,' + eval(1 * omin[ij]) + ',' + eval(1 * omax[ij]) + ']';
dprefix='%20';
}
document.getElementById('tdt').innerHTML='';
document.getElementById('tdo').innerHTML='';
document.getElementById('tdy').innerHTML='';
document.getElementById('tdd').innerHTML='';
document.getElementById('tdr').innerHTML='';
document.getElementById('ssmall').innerHTML='Not to Scale Animated GIF and Orbit Around the Sun ...';
document.getElementById('dsmall').style.display='block';
document.getElementById('dsmall').open=true;
document.getElementById('td' + osel.value).innerHTML='<iframe name=stat style=width:800px;height:500px; src="' + ourbc + '" title="Orbit Around the Sun"></iframe>';
window.open(ourbc, 'stat', 'top=50,left=50,width=800,height=600');
} else if (osel.value == 'y') {
ourbc=bc.split('&data=')[0].replace('=Sun', '=' + encodeURIComponent('Planet Year Earth Days')).replace('=One', '=' + encodeURIComponent('Planet Year Earth Days')) + '&data=';
for (ij=1; ij<pandsnames.length; ij++) {
ourbc+=dprefix + ',%20[~' + pandsnames[ij] + '~,' + yedop[ij] + ']';
dprefix='%20';
}
document.getElementById('tdt').innerHTML='';
document.getElementById('tdo').innerHTML='';
document.getElementById('tdy').innerHTML='';
document.getElementById('tdd').innerHTML='';
document.getElementById('tdr').innerHTML='';
document.getElementById('ssmall').innerHTML='Not to Scale Animated GIF and Planet Year around Sun Earth Days ...';
document.getElementById('dsmall').style.display='block';
document.getElementById('dsmall').open=true;
document.getElementById('td' + osel.value).innerHTML='<iframe name=stat style=width:800px;height:500px; src="' + ourbc + '" title="Planet Year around Sun Earth Days"></iframe>';
window.open(ourbc, 'stat', 'top=50,left=50,width=800,height=600');
} else if (osel.value == 'd') {
ourbc=bc.split('&data=')[0].replace('=Sun', '=' + encodeURIComponent('Planet Day Earth Hours')).replace('=One', '=' + encodeURIComponent('Planet Year Earth Hours')) + '&data=';
for (ij=1; ij<pandsnames.length; ij++) {
ourbc+=dprefix + ',%20[~' + pandsnames[ij] + '~,' + dedop[ij] + ']';
dprefix='%20';
}
document.getElementById('tdt').innerHTML='';
document.getElementById('tdo').innerHTML='';
document.getElementById('tdy').innerHTML='';
document.getElementById('tdd').innerHTML='';
document.getElementById('tdr').innerHTML='';
document.getElementById('ssmall').innerHTML='Not to Scale Animated GIF and Planet Day Earth Hours ...';
document.getElementById('dsmall').style.display='block';
document.getElementById('dsmall').open=true;
document.getElementById('td' + osel.value).innerHTML='<iframe name=stat style=width:800px;height:500px; src="' + ourbc + '" title="Planet Day Earth Hours"></iframe>';
window.open(ourbc, 'stat', 'top=50,left=50,width=800,height=600');
}
}
function fillin() {
// http://localhost:8888/HTMLCSS/circular_text.html?radius=50.360&text=es%20es%20es%20es%20es%20es%20es%20es%20es%20es%20es%20es&fontsize=14&ih=Wikipedia&im=%2FHTMLCSS%2Fworld.jpg
var tempateurl='//www.rjmprogramming.com.au/HTMLCSS/circular_text.html?sizeword=cover&radius=.360&text=&fontsize=14&ih=&im=&iu=';
//tempateurl='http://localhost:8888/HTMLCSS/circular_text.html?sizeword=cover&radius=.360&text=&fontsize=14&ih=&im=&iu=';
for (var i=0; i<pandsnames.length; i++) {
document.getElementById('i' + pandsnames[i].toLowerCase()).src=(tempateurl + encodeURIComponent(pandsimgun[i]) + '&width=' + eval(2.0 * pandsradis[i]) + '&height=' + eval(2.0 * pandsradis[i])).replace('.360', '' + pandsradis[i] + '.360').replace('&text=&', '&text=' + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + '&').replace('&ih=&', '&ih=' + pandsnames[i] + '&').replace('&im=&', '&im=' + pandsimgus[i] + '&');
document.getElementById('i' + pandsnames[i].toLowerCase()).style.visibility='visible';
if (pandsnames[i].toLowerCase() == 'mercury' && document.getElementById('ismall')) {
document.getElementById('ismall').src=(tempateurl + encodeURIComponent(pandsimgun[i].replace('planets/mercury/overview/','').replace('mercury.png',pands + '.gif')) + '&width=' + eval(2.0 * pandsradis[i]) + '&height=' + eval(2.0 * pandsradis[i])).replace('.360', '' + pandsradis[i] + '.360').replace('&text=&', '&text=' + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + encodeURIComponent(pandsunems[i] + ' ') + '&').replace('&iAGBLURBh=&', '&ih=' + pandsnames[i] + '&').replace('&im=&', '&im=' + pandsimgus[i].replace('planets/mercury/overview/','').replace('mercury.png',pands + '.gif') + '&');
document.getElementById('ismall').style.width='' + eval(2.3 * pandsradis[i]) + 'px';
document.getElementById('ismall').style.height='' + eval(2.3 * pandsradis[i]) + 'px';
//document.getElementById('dsmall').style.display='block';
}
document.getElementById('i' + pandsnames[i].toLowerCase()).style.width='' + eval(2.3 * pandsradis[i]) + 'px';
document.getElementById('i' + pandsnames[i].toLowerCase()).style.height='' + eval(2.3 * pandsradis[i]) + 'px';
}
}
</script>
</head>
<body onload='fillin();'>
<h1>Solar System Planets <select style=text-align:center; id=mysel onchange=changeit(this);><option value=''>and</option><option value='t'>distance to</option><option value='o'>orbit radii around</option><option value='y'>year Earth days regarding</option>><option value='d'>day Earth hours regarding</option><option value='r'>radius relative to</option></select> Sun</h1>
<h3>RJM Programming <a title='Show animated GIF version reduced to Mercury suitable scale' style=cursor:pointer;text-decoration:underline; onclick="document.getElementById('dsmall').style.display='block';">-</a> April, 2023</h3>
<details id=dsmall style=display:none; open><summary style='background:linear-gradient(to right, red, orange, yellow, green, blue, indigo, purple, violet);' id=ssmall>Not to Scale Animated GIF ...</summary>
<table id=mytable><tr id=myrow><td id=tdsmall><iframe scrolling=no id=ismall frameborder=0 src=''></iframe></td><td id=tdt></td><td id=tdo></td><td id=tdy></td><td id=tdd></td><td id=tdr></td></tr></table>
</details>
<h4>Thanks to <a target=_blank title=NASA href='https://solarsystem.nasa.gov/'>NASA</a></h4>
<details id=dsun><summary style='background:linear-gradient(to right, red, orange, yellow, green, blue, indigo, purple, violet);'>Sun ...</summary>
<iframe id=isun style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
<details id=dmercury open><summary style=background-color:red;>Mercury ...</summary>
<iframe id=imercury style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
<details id=dvenus><summary style=background-color:orange;>Venus ...</summary>
<iframe id=ivenus style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
<details id=dearth><summary style=background-color:yellow;>Earth ...</summary>
<iframe id=iearth style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
<details id=dmars><summary style=background-color:green;>Mars ...</summary>
<iframe id=imars style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
<details id=dvenus><summary style=background-color:blue;>Jupiter ...</summary>
<iframe id=ijupiter style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
<details id=dvenus><summary style=background-color:indigo;>Saturn ...</summary>
<iframe id=isaturn style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
<details id=duranus><summary style=background-color:purple;>Uranus ...</summary>
<iframe id=iuranus style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
<details id=dnepturn><summary style=background-color:violet;>Neptune ...</summary>
<iframe id=ineptune style=visibility:hidden; frameborder=0 src=''></iframe>
</details>
</script>
</head>
<body>
</body>
</html>