{"id":53955,"date":"2021-11-17T03:01:23","date_gmt":"2021-11-16T17:01:23","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=53955"},"modified":"2021-11-15T16:03:20","modified_gmt":"2021-11-15T06:03:20","slug":"htmljavascript-area-derivation-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/htmljavascript-area-derivation-tutorial\/","title":{"rendered":"HTML\/Javascript Area Derivation Tutorial"},"content":{"rendered":"
\"HTML\/Javascript<\/a>

HTML\/Javascript Area Derivation Tutorial<\/p><\/div>\n

In this wooorrrrllllddd where so much information is available online, that old adage espoused by mathematics teachers ahead of examinations that went …<\/p>\n

\nYou’ll get part marks if you can show your working\n<\/p><\/blockquote>\n

… is more apt than ever. To get by in more and more complex environments, we’d be better off knowing what we need to know and leave room in the brain for other more crucial information, when it comes to information that is derivable when you have access to online resources.<\/p>\n

And so, on top of HTML\/Javascript Areas Canvas Tutorial<\/a> we’ve added a user input methodology whereby we accept Javascript prompt window entries such as …<\/p>\n


\n453 * 45
\n<\/code><\/p>\n

… when presented with a Rectangle of length 453 and height 45 area problem<\/font>, just as one example. In other words, to remember the formulae for area calculations is the most important aspect to this subject matter. This screams eval<\/a> to us, (using) that very useful Javascript way to calculate “on the fly”. It means users could enter answers involving the mathematical (or should we say, Javascript)<\/font> operators …<\/p>\n\n\n\n
Addition<\/th>\nSubtraction<\/th>\nMultiplication<\/th>\nDivision<\/th>\nPI<\/th>\n<\/tr>\n
+<\/th>\n–<\/th>\n*<\/th>\n\/<\/th>\nMath.PI<\/th>\n<\/tr>\n<\/table>\n

… available via a new “hardcoding becomes fleshed out ‘a’ link”<\/font> HTML …<\/p>\n


\n<input type='submit' onclick=\"checkarea(document.getElementById('sarea').value);\" style=\"background-color: yellow;\" id='submit' name='submit' value='Check if Area'><\/input> of <select id='sarea' onchange='makevisible(this.value);' title=''><option value='circle'>Circle<\/option><option value='sector'>Sector<\/option><option value='rectangle'>Rectangle<\/option><option value='triangle'>Triangle<\/option><option value='parallelogram'>Parallelogram<\/option><option value='kite'>Kite<\/option><option value='trapezium'>Trapezium<\/option><option value='rhombus'>Rhombus<\/option><option value='rectangle_lsector'>Rectangle and Quarter Length Sector<\/option><option value='rectangle_hsector'>Rectangle and Quarter Width Sector<\/option><option value='parallelogram_rectangle_cutout'>Parallelogram with Rectangle Cutout<\/option><\/select> <a style=\"cursor:pointer;text-decoration:underline;\" onclick=\"ansviaprompt(pbits,'');\" title=\"Answer via prompt and can allow eval derivations via operators + and - and * and \/ \"><\/font>is<\/a><\/font> <input id='answer' name='answer' value='' type='number'><\/input>
\n<\/code><\/p>\n

… teamed with the new associated Javascript …<\/p>\n

<script type=’text\/javascript’>
\n
\nfunction athen() {
\n document.getElementById('submit').click();
\n}
\n
\nfunction ansviaprompt(ebits) {
\n var huhw=prompt(ebits, '');
\n if (huhw == null) { huhw=''; }
\n if (huhw != '') {
\n document.getElementById('answer').value=eval('' + huhw.trim());
\n if (huhw.trim() != huhw) { setTimeout(athen, 2000); }
\n }
\n}
\n<\/code>
\n<\/script><\/p>\n

… could help enforce the more important knowledge faster and firmer in the changed<\/a> areas.html<\/a> live run<\/a> link!<\/p>\n