Index: /issm/trunk-jpl/src/m/plot/applyoptions.js
===================================================================
--- /issm/trunk-jpl/src/m/plot/applyoptions.js	(revision 19883)
+++ /issm/trunk-jpl/src/m/plot/applyoptions.js	(revision 19884)
@@ -177,5 +177,5 @@
 				ccanvashtml = document.getElementById(ccanvasid);
 				if (ccanvashtml==null) {
-					ccanvas = $('<canvas id="'+ccanvasid+'" width="'+String(cwidth+cheightoffset*4)+'" height="'+String(cheight+cheightoffset)+'"></canvas>').insertAfter('#'+options.getfieldvalue('canvasid'));
+					ccanvas = $('<canvas id="'+ccanvasid+'" width="'+String(cwidth+cheightoffset*4)+'" height="'+String(cheight+cheightoffset*2)+'"></canvas>').insertAfter('#'+options.getfieldvalue('canvasid'));
 					ccanvas.css({'position':'relative','top':((canvassize-cheight-cheightoffset)/-2).toFixed(2)+'px'});
 					ccontext = ccanvas[0].getContext('2d');
@@ -189,5 +189,5 @@
 						//get html object instead of jqurey object to modify height/width to accomodate labels
 						ccanvashtml.width = ccanvas.width()+cheightoffset*6;
-						ccanvashtml.height = cheight+cheightoffset;
+						ccanvashtml.height = cheight+cheightoffset*2;
 						ccanvashtml.cwidth = cwidth;
 						ccanvashtml.cheight = cheight;
@@ -200,5 +200,5 @@
 					ccontext = ccanvas[0].getContext('2d');
 					/*erase existing colorbar:*/
-					ccontext.clearRect(0,0, cwidth*4, cheight+cheightoffset);
+					ccontext.clearRect(0,0, ccanvashtml.width, ccanvashtml.height);
 					ccontext.beginPath();
 				}
@@ -213,5 +213,5 @@
 				}
 				ccontext.fillStyle=cgradient;
-				ccontext.fillRect(0,cheightoffset/2,cwidth,cheight);
+				ccontext.fillRect(0,cheightoffset*3/2,cwidth,cheight);
 				
 				//Draw colorbar border
@@ -219,5 +219,5 @@
 				ccontext.lineWidth='1';
 				ccontext.strokeStyle='black';
-				ccontext.rect(0,cheightoffset/2,cwidth,cheight);
+				ccontext.rect(0,cheightoffset*3/2,cwidth,cheight);
 				ccontext.stroke();
 				
@@ -226,13 +226,20 @@
 					x = 0.2*cwidth;
 					ccontext.beginPath();
-					ccontext.moveTo(0,y);
-					ccontext.lineTo(x,y);
-					ccontext.moveTo(cwidth-x,y);
-					ccontext.lineTo(cwidth,y);
+					ccontext.moveTo(0,y+cheightoffset);
+					ccontext.lineTo(x,y+cheightoffset);
+					ccontext.moveTo(cwidth-x,y+cheightoffset);
+					ccontext.lineTo(cwidth,y+cheightoffset);
 					ccontext.stroke();
 					ccontext.font=String(options.getfieldvalue('colorbarfontsize',16))+'px Arial';
 					ccontext.fillStyle='black';
 					ccontext.textAlign='left';
-					ccontext.fillText(labels[i],cwidth+x,y+cheightoffset/2);
+					ccontext.fillText(labels[i],cwidth+x,y+cheightoffset*3/2);
+				}
+				if (options.exist('colorbartitle')) {
+					ccontext.font=String(options.getfieldvalue('colorbarfontsize',16))+'px Arial';
+					ccontext.fillStyle='black';
+					ccontext.textAlign='left';
+					ccontext.textBaseline='bottom';
+					ccontext.fillText(options.getfieldvalue('colorbartitle'),0,cheightoffset);
 				}
 			}
@@ -243,6 +250,6 @@
 				ccanvashtml = document.getElementById(ccanvasid);
 				if (ccanvashtml==null) {
-					ccanvas = $('<canvas id="'+ccanvasid+'" width="'+String(cwidth+cheightoffset*4)+'" height="'+String(cheight+cheightoffset)+'"></canvas>').insertAfter('#'+options.getfieldvalue('canvasid'));
-					ccanvas.css({'position':'relative','top':((canvassize-cheight-cheightoffset)/-2).toFixed(2)+'px'});
+					ccanvas = $('<canvas id="'+ccanvasid+'" width="'+String(cwidth+cheightoffset*4)+'" height="'+String(cheight+cheightoffset*2)+'"></canvas>').insertAfter('#'+options.getfieldvalue('canvasid'));
+					ccanvas.css({'position':'relative','top':((canvassize-cheight-cheightoffset*2)/-2).toFixed(2)+'px'});
 					ccontext = ccanvas[0].getContext('2d');
 				}
@@ -255,5 +262,5 @@
 						//get html object instead of jqurey object to modify height/width to accomodate labels
 						ccanvashtml.width = cwidth+cheightoffset*6;
-						ccanvashtml.height = cheight+cheightoffset;
+						ccanvashtml.height = cheight+cheightoffset*2;
 						ccanvashtml.cwidth = cwidth;
 						ccanvashtml.cheight = cheight;
@@ -266,5 +273,5 @@
 					ccontext = ccanvas[0].getContext('2d');
 					/*erase existing colorbar:*/
-					ccontext.clearRect(0,0, cwidth*4, cheight+cheightoffset);
+					ccontext.clearRect(0,0, ccanvashtml.width, ccanvashtml.height);
 					ccontext.beginPath();
 				}
@@ -279,5 +286,5 @@
 				}
 				ccontext.fillStyle=cgradient;
-				ccontext.fillRect(cwidthoffset,0,cwidth,cheight);
+				ccontext.fillRect(cwidthoffset,cheightoffset,cwidth,cheight);
 				
 				//Draw colorbar border
@@ -285,5 +292,5 @@
 				ccontext.lineWidth='1';
 				ccontext.strokeStyle='black';
-				ccontext.rect(cwidthoffset,0,cwidth,cheight);
+				ccontext.rect(cwidthoffset,cheightoffset,cwidth,cheight);
 				ccontext.stroke();
 				
@@ -292,13 +299,20 @@
 					x = i/cdivisions*cwidth;
 					ccontext.beginPath();
-					ccontext.moveTo(x+cwidthoffset,0);
-					ccontext.lineTo(x+cwidthoffset,y);
-					ccontext.moveTo(x+cwidthoffset,cheight-y);
-					ccontext.lineTo(x+cwidthoffset,cheight);
+					ccontext.moveTo(x+cwidthoffset,cheightoffset);
+					ccontext.lineTo(x+cwidthoffset,y+cheightoffset);
+					ccontext.moveTo(x+cwidthoffset,cheight-y+cheightoffset);
+					ccontext.lineTo(x+cwidthoffset,cheight+cheightoffset);
 					ccontext.stroke();
 					ccontext.font=String(options.getfieldvalue('colorbarfontsize',16))+'px Arial';
 					ccontext.fillStyle='black';
 					ccontext.textAlign='center';
-					ccontext.fillText(labels[cdivisions-i],x+cwidthoffset,cheight+cheightoffset);
+					ccontext.fillText(labels[cdivisions-i],x+cwidthoffset,cheight+cheightoffset*2);
+				}
+				if (options.exist('colorbartitle')) {
+					ccontext.font=String(options.getfieldvalue('colorbarfontsize',16))+'px Arial';
+					ccontext.fillStyle='black';
+					ccontext.textAlign='center';
+					ccontext.textBaseline='bottom';
+					ccontext.fillText(options.getfieldvalue('colorbartitle'),cwidth/2+cwidthoffset,cheightoffset);
 				}
 			}