Changeset 13496


Ignore:
Timestamp:
05/01/12 14:10:06 (13 years ago)
Author:
tbretz
Message:
Added simple graph drawing.
File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/FACT++/www/index.js

    r13495 r13496  
    592592    ctx.closePath();
    593593}
    594 
    595 function process_eventdata(result)
    596 {
    597     if (result.length!=160)
    598         return;
    599 
    600     var z = $("body").getAttribute("data-visible");
    601     var canv = $("canvas"+z);
    602     if (canv == undefined)
    603         return;
    604 
    605     var cw = canv.width;
    606     var ch = canv.height;
    607 
    608     var ctx = canv.getContext("2d");
    609 
    610     ctx.clearRect(0, 0, cw, ch);
    611 /*
    612     ctx.beginPath();
    613     ctx.strokeStyle = "#000000";
    614     ctx.moveTo(0, 0);
    615     ctx.lineTo(0, ch);
    616     ctx.lineTo(cw, ch);
    617     ctx.lineTo(cw, 0);
    618     ctx.lineTo(0, 0);
    619     ctx.stroke();
    620     ctx.closePath();
    621     */
    622 
    623     drawPix(0, 0, result.charCodeAt(0));
     594function drawCam(data)
     595{
     596    drawPix(0, 0, data.charCodeAt(0));
    624597
    625598    var gsSin60 = Math.sqrt(3)/2;
    626599
    627600    var cnt = 1;
    628     for (var ring=1; ring<=30; ring++)
     601    for (var ring=1; ring<=7; ring++)
    629602    {
    630603        for (var s=0; s<6; s++)
     
    657630
    658631                // Rotate by 60deg
    659                 var px = Math.sin(Math.PI/3)*x - Math.cos(Math.PI/3)*y;
    660                 var py = Math.cos(Math.PI/3)*x + Math.sin(Math.PI/3)*y;
    661 
    662                 drawPix(px, py, result.charCodeAt(cnt));
     632                var px = gsSin60*x - 0.5*y;
     633                var py = gsSin60*y + 0.5*x;
     634
     635                drawPix(px, py, data.charCodeAt(cnt));
    663636                cnt++;
    664 
    665                 if (cnt==159)
    666                     break;
    667637            }
    668             if (cnt==159)
    669                 break;
    670638        }
    671         if (cnt==159)
    672             break;
    673     }
     639    }
     640}
     641
     642function drawCamLegend(canv)
     643{
     644    var cw = canv.width;
     645    var ch = canv.height;
     646
     647    var ctx = canv.getContext("2d");
    674648
    675649    ctx.font         = "8pt Arial";
     
    703677    ctx.strokeStyle = "#"+color(127);
    704678    ctx.strokeText("2.0V", cw-5, 5);
     679}
     680
     681function drawGraph(canv, data)
     682{
     683    var cw = canv.width;
     684    var ch = canv.height;
     685
     686    var ctx = canv.getContext("2d");
     687
     688    var dx = 15;
     689    var dy = 15;
     690
     691    var dw =  5;
     692
     693    var nx = 20;
     694    var ny = 10;
     695
     696    var w = cw-2*dx;
     697    var h = ch-2*dy;
     698
     699    ctx.strokeStyle = "#808080";
     700
     701    ctx.beginPath();
     702    ctx.moveTo(dx, ch-dy-data.charCodeAt(0)/128*h);
     703    for (var i=1; i<data.length; i++)
     704        ctx.lineTo(dx+w/data.length*i, ch-dy-data.charCodeAt(i)/128*h);
     705    ctx.lineTo(dx+w, ch-dy);
     706    ctx.lineTo(dx,   ch-dy);
     707    ctx.fillStyle = "#"+color(100);
     708    ctx.fill();
     709    ctx.stroke();
     710    ctx.closePath();
     711
     712    ctx.strokeStyle = "#000000";
     713
     714    ctx.beginPath();
     715
     716    ctx.moveTo(dx,    dy);
     717    ctx.lineTo(dx,    ch-dy);
     718    ctx.lineTo(cw-dx, ch-dy);
     719
     720    for (var i=0; i<nx; i++)
     721    {
     722        ctx.moveTo(dx+w/nx*i, ch-dy-dw);
     723        ctx.lineTo(dx+w/nx*i, ch-dy+dw);
     724    }
     725    for (var i=0; i<ny; i++)
     726    {
     727        ctx.moveTo(dx-dw, dy+h/ny*i);
     728        ctx.lineTo(dx+dw, dy+h/ny*i);
     729    }
     730    ctx.stroke();
     731    ctx.closePath();
     732}
     733
     734function process_eventdata(result)
     735{
     736    if (result.length!=160)
     737        return;
     738
     739    var z = $("body").getAttribute("data-visible");
     740    var canv = $("canvas"+z);
     741    if (canv == undefined)
     742        return;
     743
     744    var ctx = canv.getContext("2d");
     745    ctx.clearRect(0, 0, canv.width, canv.height);
     746
     747    drawGraph(canv, result);
     748
     749    drawCam(result);
     750    drawCamLegend(canv);
    705751
    706752    var img = $("image"+z);
    707753    img.src = canv.toDataURL("image/png");
    708 
    709754}
    710755/*
Note: See TracChangeset for help on using the changeset viewer.