// waagrechte Balken Grafik
// Regenmenge oder Temperaturen

var g=0;
fw=new Array("black","#ff0000","#ffCCCC","#ff9900","#ffebcc","#ffff00","#ffffB2","#66ff33","#d1ffc2","#0033cc","#b2c2f0");
var rw,rs;
var anz=0;
var rmax=0;
var st=0;
 
function init2d(me)
{
   var e=document.getElementById(me);
   g=e.getContext("2d");
   g.font="12px sans-serif";
   anz=0;
   rmax=0;
   rw=new Array(40);
   rs=new Array(40);
   st=0;
}
 
function hregen(z,name)
{
   var dim;
   
   if (z >= 10000)
   {
      z -= 10000;
      z *= 33;
      z /= 32;
   }
   else
   {
      z *= 25;
      z /= 21;
   }
   rw[anz] = Math.round(z)/10;
   rmax = Math.max(rmax, rw[anz]);
   rs[anz] = name;
   dim = g.measureText(name);
   if (dim.width > st)
   st = dim.width;
   anz += 1;
}


// close regen 
function close_r()
{
   var xe;
   var t=0;
   var scale;
   var y=0;
   var grd;
   
   scale=0.4;
   if ( rmax <= 20)
      scale=20.0;
   else if ( rmax <= 40)
      scale=10.0;
   else if (rmax <= 100)
      scale=4.0;
   else if (rmax <= 200)
      scale=2.0;
   st=Math.round(st);
   st+=6;
   for (var i=0; i < anz; i++)
   {
      xe=rw[i]*scale;
      grd=g.createLinearGradient(0,0,xe,13);
      grd.addColorStop(0,'#b2e0ff');
      grd.addColorStop(1,'#0099ff');
      g.fillStyle=grd;
      g.beginPath();
      g.fillRect(st,y+1,xe,13);
      g.fill();
      g.fillStyle=fw[0];
      g.fillText(rs[i],2,y+12);
      g.fillText(rw[i],2+xe+st,y+12);
      y+=18;
   }
   g.fillStyle=fw[0];
   g.font="10px sans-serif";
   mline(st+0.5,0,0,y-3);
   mline(st+0.5,y-3.5,400,0);
   for (var i=0;i<=400;i+=20)
   {
      mline(st+0.5+i,y-4,0,5);
      if (i%100==0)
      {
         var gval=i;
         gval/=scale;
         g.fillText(gval,st+i-5,y+10);
      }
   }
   g.fillText("mm",i+st-3,y+10);
}
 
function hgrad(z,name)
{
   var dim;
   rw[anz]=Math.round(z);
   rs[anz]=name;
   dim=g.measureText(name);
   if (dim.width>st)
     st=dim.width;
   anz +=1;
}
 
function close_t()
{
   var t,ci=0;
   var scale=0.25;
   var x,xp;
   var y=0;
   var grd;
   
   st=Math.round(st);
   st+=6;
   for (var i=0;i<anz;i++)
   {
      x = rw[i]-1024;
      xp = x + 400;
      xp = xp * scale;
      t=Math.round((((x+400)/16)-25.0)*10)/10;
      if (x>800)
         ci=1;
      else if (x>400)
         ci=3;
      else if (x>200)
         ci=5;
      else if (x>0)
         ci=7;
      else
         ci=9;
      var grd=g.createLinearGradient(0,0,xp,13);
      grd.addColorStop(0,fw[ci+1]);
      grd.addColorStop(1,fw[ci]);
      g.fillStyle=grd;
      g.beginPath();
      g.fillRect(st,y+1,xp,13);
      g.fill();
      g.fillStyle=fw[0];
      g.fillText(rs[i],2,y+12);
      g.fillText(t,2+xp+st,y+12);
      y += 20;
   }
   t=-25;
   g.fillStyle=fw[0];
   g.font="10px sans-serif";
   mline(st+0.5,0,0,y-3);
   mline(st+0.5,y-3.5,400,0);
   for (var i=0;i<=400;i+=4)
   {
      if (i%20==0)
      {
         if (t%10==0)
         {
            mline(i+st+0.5,y-4,0,6);
            g.fillText( t, i+st-3, y+10);
         }
         else
            mline(i+st+0.5,y-4,0,5);
         t+=5;
      }
      else
         mline(i+st+0.5,y-4,0,3);
   }
   g.fillText("°C",i+st-3,y+10);
   g.beginPath();
   g.fillStyle=fw[1];
   g.fillRect(st, y+13,400,3);
   g.fillStyle=fw[3];
   g.fillRect(st, y+13,300,3);
   g.fillStyle=fw[5];
   g.fillRect(st, y+13,200,3);
   g.fillStyle=fw[7];
   g.fillRect(st, y+13,150,3);
   g.fillStyle=fw[9];
   g.fillRect(st, y+13,100,3);
   g.fill();
}
 
function mline(xs,ys,xlen,ylen)
{
   g.beginPath();
   g.moveTo(xs,ys);
   g.lineTo(xs+xlen,ys+ylen);
   g.stroke();
}