Changeset 19946


Ignore:
Timestamp:
01/09/16 17:30:35 (9 years ago)
Author:
dlcheng
Message:

CHG (javascript): Updating zoom for js plots to use percentage based values.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • issm/trunk-jpl/src/m/plot/webgl.js

    r19945 r19946  
    3434        // Add context state variables
    3535        //TODO:Group variables in objects for organization and naming
    36         canvas.zoomBounds = options.getfieldvalue('zoombounds',[0,-.52]);
    37         canvas.zoomFactor = clamp(options.getfieldvalue('zoomfactor',canvas.zoomBounds[1]), canvas.zoomBounds[1], canvas.zoomBounds[0]);
     36        canvas.zoomBounds = options.getfieldvalue('zoombounds',[0,100.0]);
     37        canvas.zoomFactor = clamp(options.getfieldvalue('zoomfactor',1.0), canvas.zoomBounds[0], canvas.zoomBounds[1]);
    3838        canvas.zoomLast = canvas.zoomFactor;
    3939        canvas.cameraMatrix = mat4.create();
     
    118118                level:0,
    119119                useIndexBuffer:true,
    120                 useOrthographic:false,
    121120                alpha:1.0,
    122121                disableDepthTest:false,
     
    130129                modelMatrix:mat4.create(),
    131130                shaderName:"colored",
    132                 overlay:false,
    133131                drawOrder:0,
    134132                maskEnabled:false,
     
    328326        }
    329327        if (ev.srcEvent.shiftKey || ev.pointers.length == 2) {
    330                 var deltaX = (canvas.lastDeltaX - ev.deltaX) / canvas.clientWidth * canvas.zoomFactor * 2;
    331                 var deltaY = (canvas.lastDeltaY - ev.deltaY) / canvas.clientHeight * canvas.zoomFactor * 2;
     328                var deltaX = (canvas.lastDeltaX - ev.deltaX) / canvas.clientWidth / canvas.zoomFactor * -2;
     329                var deltaY = (canvas.lastDeltaY - ev.deltaY) / canvas.clientHeight / canvas.zoomFactor * -2;
    332330               
    333331                canvas.translation[0] += Math.cos(radians(canvas.rotation[0])) * deltaX - Math.sin(radians(canvas.rotation[0])) * deltaY;
     
    335333        }
    336334        else {
    337                 canvas.rotation[0] += degrees((canvas.lastDeltaX - ev.deltaX) / canvas.clientWidth * canvas.zoomFactor * 2);
    338                 canvas.rotation[1] += degrees((canvas.lastDeltaY - ev.deltaY) / canvas.clientHeight * canvas.zoomFactor * 2);
     335                canvas.rotation[0] += degrees((canvas.lastDeltaX - ev.deltaX) / canvas.clientWidth / canvas.zoomFactor * -2);
     336                canvas.rotation[1] += degrees((canvas.lastDeltaY - ev.deltaY) / canvas.clientHeight / canvas.zoomFactor * -2);
    339337               
    340338                if (canvas.rotation[0] > 360) {canvas.rotation[0] -= 360};
     
    357355        }
    358356        else {
    359                 canvas.zoomFactor = clamp(ev.scale * canvas.zoomLast, canvas.zoomBounds[1], canvas.zoomBounds[0]);
     357                canvas.zoomFactor = clamp(ev.scale * canvas.zoomLast, canvas.zoomBounds[0], canvas.zoomBounds[1]);
    360358                if (displaylog) console.log(canvas.zoomFactor);
    361359        }
     
    364362        ev.preventDefault();
    365363        var delta = 1/10 * clamp(ev.scale || ev.wheelDelta || -ev.detail, -1, 1);
    366         canvas.zoomFactor = clamp(canvas.zoomFactor - delta * canvas.zoomFactor, canvas.zoomBounds[1], canvas.zoomBounds[0]);
     364        canvas.zoomFactor = clamp(canvas.zoomFactor + delta / canvas.zoomFactor, canvas.zoomBounds[0], canvas.zoomBounds[1]);
     365       
    367366        if (displaylog) console.log(canvas.zoomFactor);
    368367} //}}}
     
    379378
    380379        if (canvas.twod) {
    381                 mat4.ortho(pMatrix, 1*canvas.zoomFactor, -1*canvas.zoomFactor, 1*canvas.zoomFactor, -1*canvas.zoomFactor, -1, 1.0);
     380                mat4.ortho(pMatrix, -1/canvas.zoomFactor, 1/canvas.zoomFactor, -1/canvas.zoomFactor, 1/canvas.zoomFactor, -1.0, 10000.0);
    382381        }
    383382        else {
     
    399398        //Apply screenspace translation
    400399        mat4.identity(translateMatrix);
    401         mat4.translate(translateMatrix, translateMatrix, [0.0, 0.0, canvas.zoomFactor]);
     400        mat4.translate(translateMatrix, translateMatrix, [0.0, 0.0, -1/canvas.zoomFactor]);
    402401        mat4.multiply(vMatrix, translateMatrix, vMatrix);
    403402
     
    417416        bindAttributes(gl, node["shader"], node["buffers"]);
    418417        var mvpMatrix = mat4.create();
    419         if (node["useOrthographic"] == true) {
    420                 mat4.ortho(mvpMatrix, -1.0, 1.0, -1.0, 1.0, -1.0, 1.0);
    421         }
    422         else {
    423                 mat4.multiply(mvpMatrix, canvas.cameraMatrix, node["modelMatrix"]);
    424         }
     418        mat4.multiply(mvpMatrix, canvas.cameraMatrix, node["modelMatrix"]);
    425419        gl.uniformMatrix4fv(node["shader"]["uMVPMatrix"], false, mvpMatrix);
    426420        gl.uniform1f(node["shader"]["uAlpha"], node["alpha"]);
     
    433427                gl.uniform1i(node["shader"]["uColorSampler"], 0);       
    434428        }
    435         //if (node["overlay"] == true) {
    436         //      gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
    437         //}
    438         //else {
    439         //      gl.blendFunc (gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
    440         //}
    441429        gl.blendFunc (gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
    442430        if  (node["useIndexBuffer"] == true) {
Note: See TracChangeset for help on using the changeset viewer.