Myu: 二次方程式を解く javascript

javascriptの勉強のためにつくってみた。

利用させていただいたサイト
https://www.mathjax.org/
http://d.hatena.ne.jp/kochann/?of=6
問題を乱数で出題するようにしています。
.netなどでつくるより、つくりやすいところとそうでないところがあり、一長一短があるような気がします。
javascriptは、型の定義の融通がきく半面、何の型なのか常に意識する必要はあるようです。画面上の細かい調整にいまいち慣れてないので、レイアウトでけっこう時間がかかってしまいます。あと、^2など２乗の計算を認識しない？ようです。*+-は大丈夫なようですが。
　さまざまなパータンの二次方程式に対応させるため、だいぶ長くなってしまいました。
2017.5.9 bug fix　有理数解のときのメッセージ表示に不具合あったものを修正しました。
 
 <!DOCTYPE html>
<html>
  <head>
    <title>２次方程式</title>

<style type="text/css">
<!--

div {font-size:50px;}
span#hyoka {color:#ff0000;font-size:30px;}
button {font-size:40px;}

-->
</style>
</head>
  
  <body >
      <script type="text/javascript"  src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    TeX: { equationNumbers: { autoNumber: "AMS" }},
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      processEscapes: true
    },
    "HTML-CSS": { matchFontHeight: false },
    displayAlign: "left",
    displayIndent: "2em"
  });
</script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

  <br>
 二次方程式を解の公式をつかって解きましょう　　<button id="btn" value="ans" style="font-size:20px;">答えを見る</button><br><br>
    <input type="radio" name="ptrn" value="kihon"  checked >
    <label >レベル０（aの係数が１）</label> 
    <input type="radio" name="ptrn" value="noroot" >
    <label >レベル１（ルート計算なし）</label> 
    <input type="radio" name="ptrn" value="yaku" >
    <label >レベル２（約分あり）</label>
    <input type="radio" name="ptrn" value="seisu">
    <label >レベル３（有理数解）</label> 
   <button id="btn" value='shutudai' style="font-size:20px;">を出題</button><br><br>

<table width=1000>
<tr>
<td width=40% valign=top>
<div id='mondai'>
</div>
<div id='waku'>
</div>
<span id='hyoka' ></span><br>
</td>
<td>
<button id="btn" value='7'>7</button>　
<button id="btn" value='8'>8</button>　
<button id="btn" value='9'>9</button><br>
<button id="btn" value='4'>4</button>　
<button id="btn" value='5'>5</button>　
<button id="btn" value='6'>6</button><br>
<button id="btn" value='1'>1</button>　
<button id="btn" value='2'>2</button>　
<button id="btn" value='3'>3</button><br>
<button id="btn" value='0'>0</button>　
<button id="btn" value='×'>*</button>　
<button id="btn" value='\pm'>±</button>　 
<button id="btn" value='-'>-</button>　
<button id="btn" value='+'>+</button><br>
<button id="btn" value='('>(</button>　
<button id="btn" value=')'>)</button>　
<button id="btn" value='x='>x=</button>
<button id="btn" value=','>,</button>
<button id="btn" value='frac' style="font-size:30px;">分の</button>
<button id="btn" value='sqrt' >√</button><br>
<button id="btn" value='cls' style="font-size:30px;">１行消</button>
<button id="btn" value='bs' style="font-size:30px;">１字消</button>
<div id='ans' style='display:none;'>
</div>
</td>
</tr>
</table>
<script>
var mode='';  var bunbo='';  var bunshi='';  var root='';  var gyo=0;
var nk;
var a,b,c;
var seikairafter; var aseikaivpre; var aseikaisi ; var aseikaibo;
var flg1,flg2,kmm;

 $(function() {
  $('button').click(function(e) { 
       var st=e.target.value;
       

       
       if(st=='ans') {
        $('#ans').toggle();
        exit;
       }
       
    if(st=='shutudai'){//***********************************************shutudai
     mondai();
     exit;
    }
  //****************************************************************************
    if (st.trim()==','){
     kmm=true;     
    }
  
    if (st=='sqrt'||st=='frac'||st=='default') {
     if (bunsi=='1' && st=='frac') {
      alert('分母１は分数になりません');
      bunbo='1';
      bunsi='';
      mode='nofrac';
     }else if(bunsi!='1' && st=='frac'){    
      if (mode=='nofrac'){ //分数状態でなければ「分の」をクリックすると、それまでの入力を分母にコピーする
       bunbo=bunsi;
       bunsi='';
       mode='frac';
      }else {//それ以外の状態ならば「分の」をクリックすると、そのままルートの外を変更できる
       mode='frac';
      }

     }else{
      mode=st;  
     }     
     nk.disp(bunbo,bunsi,root,mode);
     exit;
    }
  
    if (st=='x=') {
      bunbo='1';bunsi='';root='';
      mode='nofrac';      
      gyo=gyo+1; 
      nk=new Keisan('s'+gyo);
      nk.disp(bunbo,bunsi,root,mode);

     exit;
    }
  
    if (st=='cls'){
     $('#s'+gyo).remove();
     gyo=gyo-1;
     kmm=false;
    }
    
   
  
 switch (mode){
    case 'frac':
    case 'nofrac':
      if (st=='bs') {
        if(bunsi.substr(bunsi.length-3)=='\\pm')
        {bunsi=bunsi.substr( 0, bunsi.length-3) ;} 
       else
        {bunsi=bunsi.substr( 0, bunsi.length-1) ;}
      }else{
       bunsi=bunsi+st;
      }
      break;
     case 'sqrt':
      if (st=='bs') {
       root=root.substr( 0, root.length-1 ) ;
      }else{
       root=root+st;
      }
      break;
     default:
      if (st=='bs') {
       bunbo=bunbo.substr( 0, bunbo.length-1 ) ;
      }else{
       bunbo=bunbo+st;
      }
      break;
     }

     nk.disp(bunbo,bunsi,root,mode);  
     hanbetu(bunbo,bunsi,root);
    
  });
});


 //****************************::::
 function hanbetu(bunbo,bunsi,root) {
    var bunbox=bunbo;
    var bunsix=bunsi;
      
    if (bunsix.substr(-2,2)=="pm"){//末尾±なら削除
     bunsixx=bunsix.substr(0,bunsix.length-3);
     rpr="1";
     
    }else if(bunsix.indexOf("pm")>=0){  
     tmp=bunsix.replace("\\pm",",");
     var bsx=tmp.split(",");
     bunsixx=bsx[0];
     rpr=bsx[1];      
    }else {       
     bunsixx=bunsix;rpr="1";
    }
        //    alert(bunsi+" "+bunsixx+" "+rpr);

    var rootx=root;
    bunbox=bunbox.replace(/×/g,"*");
    bunsix=bunsixx.replace(/×/g,"*");
    rootx=rootx.replace(/×/g,"*");

    bo=eval(bunbox);  si=eval(bunsix);  ro=eval(rootx);
  
    rpre=eval(rpr)*aOfaRootb(soinsu(ro));
    rafter=bOfaRootb(soinsu(ro));
      
  // alert(bo+" "+si+" "++"root"+);
   //*********************ここから先にまだエラーがあり

  gc=gcd3(bo,si,rpre);
  abo=bo/gc;
  asi=si/gc;
  arpre=rpre/gc;



// alert("最終計算値＝正解  "+abo+"="+aseikaibo+" "+asi+"="+aseikaisi+" "+arpre+"="+aseikairpre+" "+rafter+"="+seikairafter);
  //入力値                 : bunbox      bunsix    rpr              rootx
  //入力値からの最終計算値 ：abo 分母    asi分子　　apreルートの外　　rafterルートの中
  //正解                   :aseikaibo    aseikaisi   aseikaipre       seikairahter
  


  if(bunbox==aseikaibo.toString(10) && bunsix==aseikaisi.toString(10) && rpr==aseikairpre.toString(10) && rootx==seikairafter.toString(10)  ) {
   if(rootx!='1') {  $('#hyoka').text('正解');} //ルートがとれないときはこれで正解
  }else if(abo==aseikaibo && asi==aseikaisi && arpre==aseikairpre && rafter==seikairafter){//無理数解で、途中計算Okの場合          
   $('#hyoka').text('あと少し');
  }else if(seikairafter==1){//有理数解の場合
        a1=aseikaisi+aseikairpre;a2=aseikaisi-aseikairpre;
        gc1=gcd(Math.abs(a1),aseikaibo);gc2=gcd(Math.abs(a2),aseikaibo);
        seikai1si=a1/gc1;   seikai1bo=aseikaibo/gc1;
        seikai2si=a2/gc2;   seikai2bo=aseikaibo/gc2;
        
      //  alert(seikai1si+'/'+seikai1bo+'?'+bunsix+'/'+bunbox);
      if (eval(bunbox)<0) {
         bunsix=(eval(bunsix)*(-1)).toString(10);        
         bunbox=(eval(bunbox)*(-1)).toString(10);
        }//もし、分母をマイナスにしていたら、便宜上、分子にマイナスをかけ、分母を＋に 分母は常に＋として評価したいので
      flg1=flg1||(eval(bunbox)==seikai1bo&&eval(bunsix)==seikai1si);
      flg2=flg2||(eval(bunbox)==seikai2bo&&eval(bunsix)==seikai2si);
      
     if(flg1&&flg2) {
       $('#hyoka').text('正解');
     }else if(flg1||flg2) {
       //$('#hyoka').text('もうひとつの解は？');
     }
        
  }else{
   $('#hyoka').text('');
  }
  
 }

 function soinsu(n){
 if (n==1) {
  return "1";
 }else{
  st="";
  i = 2;
  while (i <= n) {
   while (n % i == 0) {
   st=st+"*"+i;
   n = Math.floor(n/i);
   }
  i = i+1;
  }
   return st.substr(1);
 }
 
 }

 function aOfaRootb(soinsu) {
 var insu=soinsu.split("*");
 var out=1;
  if (insu.length>0) {
   for(var i = 1; i < insu.length; i++) {
     if (insu[i-1]==insu[i]) {
      out=out*eval(insu[i]);
      insu[i]=1;
     }
   }
   return out;
  
  }else{
   return 1;
  }

 }


 function bOfaRootb(soinsu) {
 var insu=soinsu.split("*");
  var out=1;
  if (insu.length>0) {
   for(var i = 1; i < insu.length; i++) {
     if (insu[i-1]==insu[i]) {
       insu[i-1]=1;insu[i]=1;
     }
   }
  
   for(var i = 0; i < insu.length; i++) {
      out=out*eval(insu[i]);
   }
  
   return out;
  
  }else{
   return 1;
  }

 }

 //*************************
 function gcd3(m,n,l) {
    return gcd(gcd(m,n),l);
 }

var gcd = function(a, b){
    var gcd_temp = function(a, b, n, p){
        var smaller = function(a, b){
            return a < b ? a : b;
        }
        if(0 == a % n && 0 == b % n){
            return gcd_temp(a, b, (n + 1), n);
        }else{
            if(n > smaller(a, b)){
                return p;
            }else{
                return gcd_temp(a, b, (n + 1), p);
            }
 }
    }
    return gcd_temp(a, b, 1, 1);
}

//*****************************************************************************************:
  function Keisan(id) {     
        this.bo=" ";   this.si=" ";  this.ro=" ";     this.id=id;
       
        if(kmm == true){
           $('div#waku').append('<div id="'+id+'" style="display:inline;" >
</div>
');
         }else{
            $('div#waku').append('<div id="'+id+'" >
</div>
');
         }
     
     }     
    
     Keisan.prototype = {
        disp : function(bunbo,bunsi,root,mode){
        this.bo=bunbo;     this.si=bunsi;    this.ro=root;
        switch (mode){
         case 'init':
            $('#'+this.id).text('$x='+this.bo+'$');
           break;  
         case 'frac':
          if(eval(this.bo)<0) {
            $('#'+this.id).text('$x=-\\frac{'+this.si+'}{'+(eval(this.bo)*(-1)).toString(10)+'}$');
          }else{
            $('#'+this.id).text('$x=\\frac{'+this.si+'}{'+this.bo+'}$');
          }
           
          break;
         case 'sqrt':
          if(this.bo=='1'){
           $('#'+this.id).text('$x='+this.si+'\\sqrt{'+this.ro+'}$');
          }else{
           $('#'+this.id).text('$x=\\frac{'+this.si+'\\sqrt{'+this.ro+'}}{'+this.bo+'}$');
          }          
           break;
         case 'nofrac':
           $('#'+this.id).text('$x='+this.si+'$');
          break;
         default:
           $('#'+this.id).text('$x=\\frac{'+this.si+'\\sqrt{'+this.ro+'}}{'+this.bo+'}$');
           break;
         }
        MathJax.Hub.Typeset($("#test")[0], function() { console.log("Done"); });
       }
     }
//****************************************:::
  function mondai(){
  
   flg1=false;flg2=false;kmm=false;
   $('#hyoka').text('');
   while (gyo>=0){
       $('#s'+gyo).remove();
     gyo=gyo-1;
   }

  switch ( $("input:radio[name='ptrn']:checked").val()) {
    case 'kihon' :
       a=rand(1,1);
      do {
        b=Math.pow(-1,rand(1,2))*rand(1,8);
        c=rand(-8,8);
       }while (c==0||b*b-4*a*c<=0|| aOfaRootb(soinsu(b*b-4*a*c)) > 1 ||bOfaRootb(soinsu(b*b-4*a*c))==1 || Math.abs(2*a/gcd3(2*a,b,aOfaRootb(soinsu(b*b-4*a*c))))==1)
                                     //ルートの計算がある場合や    、ルートの中が１つまり整数解のものはのぞく　分母が１のものは除く
      break;
    case 'noroot':
      a=rand(1,3);
      do {
       b=Math.pow(-1,rand(1,2))*rand(1,8);
       c=rand(-8,8);
      }while (c==0||b*b-4*a*c<=0|| aOfaRootb(soinsu(b*b-4*a*c)) > 1 ||bOfaRootb(soinsu(b*b-4*a*c))==1 || Math.abs(2*a/gcd3(2*a,b,aOfaRootb(soinsu(b*b-4*a*c))))==1)
                                    //ルートの計算がある場合や    、ルートの中が１つまり整数解のものはのぞく　分母が１のものは除く
      break;
   
    case 'yaku'://約分あり
        a=rand(1,3);
      do {
       b=Math.pow(-1,rand(1,2))*rand(1,8);
       c=rand(-8,8);
      }while (c==0||b*b-4*a*c<=0 ||bOfaRootb(soinsu(b*b-4*a*c))==1 || Math.abs(gcd3(2*a,b,aOfaRootb(soinsu(b*b-4*a*c))))==1)
                                  //、ルートの中が１（有理数解）のものはのぞく 約分できないもの除く　　　
      break;
    case 'seisu'://有理数解
        a=rand(1,3);
      do {
       b=Math.pow(-1,rand(1,2))*rand(1,8);
       c=rand(-8,8);
      }while (c==0||b*b-4*a*c<=0 ||bOfaRootb(soinsu(b*b-4*a*c))!=1 )
      break;
  }
  
   aa=a;   bb=b;   cc=c;
   if(bb>1){bb='+'+bb;}
   if(cc>0){cc='+'+cc;}
   if(aa==-1){aa='-';}
   if(bb==-1){bb='-';}
   if(aa==1){aa='';}
   if(bb==1){bb='+';}
  
  
   $('#mondai').text('$'+aa+'x^2'+bb+'x'+cc+'=0$');
   
  //*****************ここで、正解を作成
  seikaibo=2*a;  seikaisi=-1*b; 
  seikairpre  =aOfaRootb(soinsu(b*b-4*a*c));
  seikairafter=bOfaRootb(soinsu(b*b-4*a*c));
  gc=gcd3(seikaibo,Math.abs(seikaisi),seikairpre);  
  aseikaibo=seikaibo/gc;
  aseikaisi=seikaisi/gc;
  aseikairpre=seikairpre/gc;
     //alert('kotae:'+aseikaisi+'±'+aseikairpre+'r'+seikairafter+'/'+aseikaibo);
     
  if (aseikaibo==1){
       if(seikairafter==1){//ルートなし
         $('#ans').text('$x='+(aseikaisi+aseikairpre).toString(10)+',x='+(aseikaisi-aseikairpre).toString(10)+'$');
       }else{
         $('#ans').text('$x='+aseikaisi.toString(10)+'\\pm'+ichinasi(aseikairpre)+'\\sqrt{'+seikairafter+'}$');
       }       
  }else{
      if(seikairafter==1){//ルートなし
         a1=aseikaisi+aseikairpre;a2=aseikaisi-aseikairpre;
         gc1=gcd(Math.abs(a1),aseikaibo);gc2=gcd(Math.abs(a2),aseikaibo);
         //alert(gc1+' '+gc2);
        $('#ans').text('$x='+bunsu(a1/gc1,aseikaibo/gc1)+',x='+bunsu(a2/gc2,aseikaibo/gc2)+'$');
       }else{
         $('#ans').text('$x=\\frac{'+aseikaisi.toString(10)+'\\pm'+ichinasi(aseikairpre)+'\\sqrt{'+seikairafter+'}}{'+aseikaibo+'}$');
       }       
    
  }
   
   MathJax.Hub.Typeset($("#test")[0], function() { console.log("Done"); });
 }
  
 function bunsu(bs,bb){
  if (bb==1) {
   return bs.toString(10);
  }else{
   if (bs<0) {
    return '-\\frac{'+((-1)*bs).toString(10)+'}{'+bb.toString(10)+'}';
   }else{
    return '\\frac{'+bs.toString(10)+'}{'+bb.toString(10)+'}';
   }
  
  }
 
 } 
  
 function rand(min,max){
   return Math.floor( Math.random() * (max+1-min)) + min ; 
 }
 
 function ichinasi(n){
  if(n==1){
   return "";
  }else{
   return n.toString(10);
  }
 }


</script>


  </body>
</html>
github pagesで公開してみました
https://gh6141.github.io/gitdrill/nijihote.html
Myu

2017年3月25日土曜日

二次方程式を解く javascript

0 件のコメント:

コメントを投稿

ブログアーカイブ
