Changeset 23051


Ignore:
Timestamp:
08/03/18 15:23:09 (7 years ago)
Author:
jdquinn
Message:

CHG: Initial changes to colorbar option handling

File:
1 edited

Legend:

Unmodified
Added
Removed

  • issm/trunk-jpl/src/m/plot/applyoptions.js

    r22894 r23051  
    4848                        } //}}}
    4949                        //{{{ Initialize colorbar canvas
    50                         ccanvasid = options.getfieldvalue('colorbarid', options.getfieldvalue('canvasid').replace('canvas','colorbar-canvas'));
     50                        let colorbarSlug = options.getfieldvalue('colorbarSlug', options.getfieldvalue('canvasid') + '-colorbar');
     51                        ccanvasid = colorbarSlug + '-canvas';
    5152                        ccanvas = $('#'+ccanvasid)[0];
    5253                        cwidth = ccanvas.width*options.getfieldvalue('colorbarwidth', 1);
    … …  
    8081                        //}}}
    8182                        //{{{ Draw colorbar labels
    82                         clabelsid = options.getfieldvalue('colorbarid', ccanvasid).replace('canvas','labels');
     83                        clabelsid = colorbarSlug + '-labels';
    8384                        clabels = $('#'+clabelsid);
    8485                        var clabelstring = '';
    … …  
    9899                        //}}}
    99100                        //{{{ Draw colorbar title
    100                         ctitleid = options.getfieldvalue('colorbarid', ccanvasid).replace('canvas','heading');
     101                        ctitleid = colorbarSlug + '-heading';
    101102                        ctitle = $('#'+ctitleid);
    102                         if (options.exist('colorbartitle')) { ctitle.html(options.getfieldvalue('colorbartitle')); }
     103                        if (options.exist('colorbarHeader')) { ctitle.html(options.getfieldvalue('colorbarHeader')); }
    103104                        //}}}
    104105                }
    … …  
    114115        tcontext = tcanvas.getContext('2d');
    115116        tgradient = tcontext.createLinearGradient(0, 0, 0, 256);
    116        
     117
    117118        var cmap = options.getfieldvalue('colormap','jet');
    118119        var colorbar = colorbars[cmap];
    … …  
    124125        tcontext.fillStyle = tgradient;
    125126        tcontext.fillRect(0, 0, 256, 256);
    126        
     127
    127128        //Allow for special texture colors, drawing each color in equal width vertical rectangles. The last rectanglar section is reserved for the colormap.
    128129        if (options.exist('maskregion')) {
    … …  
    139140                }
    140141        }
    141        
     142
    142143        tURL = tcanvas.toDataURL();
    143144        if (options.getfieldvalue('clf','on')=='off') {
    … …  
    161162        overlaycanvas = canvas.overlaycanvas;
    162163        ctx = overlaycanvas.getContext('2d');
    163        
     164
    164165        if (options.exist('textlabels')) {//{{{
    165166                //Attatch new overlay handler to display text labels
    … …  
    176177
    177178                                };
    178                                
     179
    179180                                // function declared in slr-gfm sim-front-end-controller.js
    180181                                // if labels are behind the globe sphere then skip iteartion and do not display them
    … …  
    184185                                        var x = (screenPoint[0] + 1.0) * (canvas.width / 2) + canvas.selector.offset().left;
    185186                                        var y = (-screenPoint[1] + 1.0) * (canvas.height / 2) + canvas.selector.offset().top;
    186                                        
     187
    187188                                        //Draw text
    188189                                        ctx.font = 'bold ' + String(textLabel.fontSize) + 'px Arial Black, sans-serif';
    … …  
    197198                }
    198199        }//}}}
    199                
     200
    200201        //{{{ additional rendering nodes
    201202        if (options.exist('render')) {
    … …  
    216217
    217218                var renderObjects = options.getfieldvalue('render',{});
    218                
     219
    219220                for (var renderObject in renderObjects) {
    220221                        //Modify renderObejct?
    … …  
    311312                                node.geometryShader('Mesh', mesh, 'Vertices', [object.x, object.y, object.z], 'Indices', object.indices);
    312313                        }
    313                         if ('axis' === renderObject && !('axis' in canvas.nodes)) {             
     314                        if ('axis' === renderObject && !('axis' in canvas.nodes)) {
    314315                                node = new Node(
    315316                                        'canvas', canvas,
    … …  
    357358                        }
    358359                        if ('clouds' === renderObject && !('clouds0' in canvas.nodes)) {
    359                                 //clouds                               
     360                                //clouds
    360361                                var mesh = GL.Mesh.fromURL(canvas.assetsPath + '/obj/cloud.obj');
    361362                                for (var i = 0; i < object.quantity; i++) {
    362363                                        //TODO: More options, less magic numbers. Add animation. Better shading.
    363                                         var offset = [randomizeAxis(translation[0], object.range), 
    364                                                                                                 randomizeCloudHeight(translation[1], object), 
     364                                        var offset = [randomizeAxis(translation[0], object.range),
     365                                                                                                randomizeCloudHeight(translation[1], object),
    365366                                                                                                randomizeAxis(translation[2], object.range)];
    366367                                        var randomSize = randomizeCloudSize(object.scale);
    … …  
    394395                                        'rotation', [0, 0, 0]
    395396                                );
    396                                
     397
    397398                                //For each target city, calculate the shortest line across the earth by performing a quaternion slerp.
    398399                                //Treat source and target city as vectors to rotate to from the north pole.
    … …  
    412413                                        var targetXYZ = vec3.fromValues(xcity[target], zcity[target], -ycity[target]);
    413414                                        var axis = vec3.cross(vec3.create(), sourceXYZ, targetXYZ);
    414                                         vec3.normalize(axis, axis);             
    415                                        
     415                                        vec3.normalize(axis, axis);
     416
    416417                                        //Get the total angle between the two cities.
    417418                                        var sourceXYZAxis = vec3.normalize(vec3.create(), sourceXYZ);
    … …  
    419420                                        var dotProduct = vec3.dot(sourceXYZAxis, targetXYZAxis);
    420421                                        var totalAngle = Math.acos(dotProduct); //theta = arccos(u . v / (||u|| * ||v||); in this case, ||u|| and ||v|| are 1, since u and v are unit vectors.
    421                                        
     422
    422423                                        var lineQuat = quat.create();
    423424                                        for (var j = 1; j <= lineSteps; j++) {
    … …  
    425426                                                var angle = j / lineSteps * totalAngle;
    426427                                                quat.setAxisAngle(lineQuat, axis, angle);
    427                                                 quat.normalize(lineQuat, lineQuat); 
     428                                                quat.normalize(lineQuat, lineQuat);
    428429                                                vec3.transformQuat(lineXYZ, sourceXYZ, lineQuat);
    429430                                                //GL.LINES needs 2 points for each line - at the beginning, just use the sourceXYZ.
    … …  
    454455                var minHeigth = object.height - 7000;
    455456                var randomHeight = (Math.random() * (maxHeight - minHeigth)) + minHeigth;
    456                
     457
    457458                return canvasGroundHeight + randomHeight;
    458459}
    … …  
    460461// assumes that originAxisValue is the mid-value between min and max.
    461462function randomizeAxis(originAxisValue, range) {
    462                 return originAxisValue + (Math.random() - 0.5) * (range * 2); 
     463                return originAxisValue + (Math.random() - 0.5) * (range * 2);
    463464}
    464465
    … …  
    466467        var maxResize = 1.3;
    467468        var minResize = 0.5;
    468         var randomizationFactor = Math.random() * (maxResize - minResize) + minResize; 
     469        var randomizationFactor = Math.random() * (maxResize - minResize) + minResize;
    469470        return scale * randomizationFactor;
    470471}
Note: See TracChangeset for help on using the changeset viewer.