Exercici tècnic de decimals

Aquesta secció treballa els decimals així com les diverses connexions amb altres conceptes tècnics dins la programació.

L'objectiu és proveir d'un programa que permet exercitar el concepte de mètrica a diferents nivells de precisió així com la explicació de com i per què funciona amb la possibilitat de poder introduir canvis o millores que apareguin.

Teoria

edit

Eines utilitzades pel desenvolupament del programa:

1) Per representar l'interval del tipus   sobre una pantalla horitzontalment suposant que l'ample és de 1000 píxels i per tant un interval del tipus   necessitem una funció de semblança entre aquests dos intervals.

La funció   se'n diu afí i és la següent:

 
Desglossament de la funció afí com a composició de tres funcions més simples:

Es requereix una funció bijectiva   que traslladi l'interval   a un interval que comenci per zero com   és a dir, volem un trasllat com  

  on  

Es requereix una funció lineal de proporcionalitat directa   que converteixi l'interval   a l'interval   on   corresponent a mil píxels, és a dir,   ja que la raó de semblança és  

 

Es requereix una funció bijectiva   que traslladi l'interval   a l'interval   i amb el trasllat   és suficient.

 

En resum tenim que  

2) En cursos superiors es veu que   és composició de funcions isomètriques i proporcionalitat directa, es a dir que dues mesures iguals dins   també són iguals dins de  

Cal doncs detallar la graduació del regla primer sobre els píxels que ens diran la graduació mínima que pot visualitzar o acceptar aquesta mena de projecció i després traslladar-la a   per conèixer el seu valor o la seva densitat.

La densitat màxima   sobre els píxels és la distància entre línies negres de la representació d'una línia negra, una línia blanca i novament negra en cicle. La distància entre línies negres, de centre a centre dels seus píxels negres, és de dos píxels, per tant és aquesta mida la mínima sobre   és:

 .

Dividint per la raó de proporció   obtenim la mesura mínima, M, sobre l'interval  

 

Ara només cal saber quin tipus de mida pot acceptar, si és           etc. Es considera que

  on  

Apliquem logaritme en base 10 per saber-ho directament:

 

Finalitza així el càlcul de la graduació sobre   que amb un valor enter   per sobre del que dona els càlculs donarà  .

Programa exercici

edit

Es dona el codi necessari per fer l'arxiu SVG autònom. El programa demana inicialitzar amb un interrogant (?), en clicar l'interrogant demanarà localitzar un valor; només s'ha de clicar sobre la solució i veure si diu SÍ(sí que s'ha encertat) o si diu NO(que no s'ha encertat). Es pot clicar que mostri la solució mentre passegem el punter per la pantalla on afegeix altres informacions de sondeig:

Utilitzant "l'editor Llibreta", "editor de text" o bé "aquest editor text", deseu sempre l'arxiu amb 3 condicions:
Nom: exerciciDecimal.svg
Tipus: tots els arxius o equivalent *.*
Codificació: UTF-8.

Clica veure codi i enganxeu tot el codi que apareix al requadre dins l'arxiu que es crea.

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="2000" height="4000">
<script><![CDATA[
var xmlns="http://www.w3.org/2000/svg";
var Root=document.documentElement;
var salto=90;
var ha=0.95949,hb=0.959632,hu,hu1,hu2,hd,va,vb;//intervalos:Dom e Im.(u=unidad base)
var wiH=1000,dmarcas=2;            //valor pantalla y separaciOn aceptable
var ai,aj,ak,punt,marcas,pat,ran,nrandom;//auxiliares
function programa(){
 var i,j,k;
 marcas=document.getElementById("reglado");
 hu=hb-ha;//longitud intervalo
 hd=wiH/hu;//razOn de proporciOn
 hu1=Math.ceil( Math.log(dmarcas/hd)/Math.log(10) );//nivel de longitud en base 10.
 hu1=Math.pow(10,hu1);//longitud de graduaciOn

 punt=document.getElementById("coor");

 ran=document.getElementById("txtRec");
  nrandom=red(ha+hu*Math.random(),hu1);
  ran.firstChild.nodeValue="Localitza: "+nrandom.toPrecision(6);//Presentador: esconde decimales internamente.
 
 for(pat="",i=red(ha,hu1)-ha;i<=hu;i=i+hu1){
  pat=pat+"M"+(Math.round(i*hd)+0.5)+","+70+"v"+17;
 }
 for(i=red(ha,hu1*5)-ha;i<=hu;i=i+hu1*5){
  pat=pat+"M"+(Math.round(i*hd)+0.5)+","+70+"v"+20;
 }
 for(i=red(ha,hu1*10)-ha;i<=hu;i=i+hu1*10){
  pat=pat+"M"+(Math.round(i*hd)+0.5)+","+70+"v"+30;
 }
 for(i=red(ha,hu1*50)-ha;i<=hu;i=i+hu1*50){
  pat=pat+"M"+(Math.round(i*hd)+0.5)+","+70+"v"+40;
  j=i+ha;
  escriuA(j.toPrecision(6),i*hd,150);
 }
 for(i=red(ha,hu1*100)-ha;i<=hu;i=i+hu1*100){
  pat=pat+"M"+(Math.round(i*hd)+0.5)+","+70+"v"+50;
 }
 //marcas.setAttribute("stroke-width",1);
 marcas.setAttribute("d",pat);

 document.documentElement.setAttribute("onmousemove","dardo(evt)");
}
function dardo(evt){//indica donde estA el ratOn.
 ai=evt.pageX;
  hu2=Math.ceil( Math.log(hu/wiH)/Math.log(10) );
  hu2=Math.pow(10,hu2);
 aj=redo(ha+ai/hd,hu2*.5);//paso a medidas exactas.
 if(Math.abs(aj-nrandom)<hu1*.7){ak="SI";}
 else{ak="No";}
 punt.firstChild.nodeValue=(aj.toPrecision(6))+"|px="+ai+"|Sol="+ak;
 punt.setAttributeNS(null,"x",(100+ai*.8));
}
function sol(){
  escriu( ak );
}
function ver(){
  var i=punt.getAttribute("y");
  if(i==62){
    punt.setAttributeNS(null,"y",-62);
  }
  else{
    punt.setAttributeNS(null,"y",62);
  }
}
function red(deci,mult){    //aproxima super.
  var ee;
  ee=Math.ceil(deci/mult);
  return ee*mult;
}
function redo(deci,mult){    //aproxima redondeo.
  var ee;
  ee=Math.round(deci/mult);
  return ee*mult;
}
function demanaUnNombre(t1,t2){return parseInt(prompt(t1,t2));}
function demanaUnText(t1,t2){return prompt(t1,t2);}
function escriu(pat){
  T=document.createElementNS(xmlns,"text");
  T.setAttributeNS(null,"x",30);
  T.setAttributeNS(null,"y",70+salto);salto=salto+30;
  T.setAttributeNS(null,"font-size","20");
  Msg=document.createTextNode(pat);
  T.appendChild(Msg);
  Root.appendChild(T);
 }
function escriuA(pat,x,y){
  T=document.createElementNS(xmlns,"text");
  T.setAttributeNS(null,"x",x);
  T.setAttributeNS(null,"y",y);
  T.setAttributeNS(null,"text-anchor","middle");
  T.setAttributeNS(null,"font-size","20");
  Msg=document.createTextNode(pat);
  T.appendChild(Msg);
  Root.appendChild(T);
 }
]]></script>
 <path id="reglado" d="m" fill="none" stroke="#000000" stroke-width="1"/>
 <g onclick="programa()">
  <rect x="10" y="10" width="200" fill="#edd" height="30" stroke="black"/>
  <text id="txtRec" x="110" y="32" font-size="20" text-anchor="middle">?</text>
 </g>
 <g onclick="ver()">
  <rect x="220" y="10" width="80" fill="#feb753" height="30" stroke="black"/>
  <text id="txtRec" x="260" y="32" font-size="20" text-anchor="middle">Solución</text>
 </g>
 <text id="coor" x="380" y="-62" font-size="20" text-anchor="middle">.</text>
 <rect onclick="sol()" x="0" y="60" width="1500" fill="#0ff" height="80" stroke="none" opacity="0"/>
</svg>

Paraules clau

edit
  • Aplicació matemàtica.
  • Bijectiva.
  • Funció.
  • Isomètrica.
  • Semblança.
  • Projecció.
  • Proporcionalitat directa.
  • Raó de proporcionalitat.
  • Trasllat.
  • Interval.