From 90049f982708bc6e8272b692107d3b3bbdcc0ce5 Mon Sep 17 00:00:00 2001
From: Spinelli <1249703377@mil>
Date: Fri, 21 Oct 2016 13:55:10 -0400
Subject: [PATCH] -updated web worker samples -cleaned up MPWorker.js and
 multiPointTesterWebWorker.html

---
 web/js/src/MPWorker.js                        |  49 ++-
 web/samples/multiPointTester1.html            |  59 ++--
 web/samples/multiPointTesterSVGWebWorker.html | 301 ------------------
 web/samples/multiPointTesterWebWorker.html    | 217 +++++++++++--
 web/samples/singlePointTester3.html           |  60 +++-
 5 files changed, 310 insertions(+), 376 deletions(-)
 delete mode 100644 web/samples/multiPointTesterSVGWebWorker.html

diff --git a/web/js/src/MPWorker.js b/web/js/src/MPWorker.js
index f6ade8cf..42ecc491 100644
--- a/web/js/src/MPWorker.js
+++ b/web/js/src/MPWorker.js
@@ -4,16 +4,16 @@ var e.data = {};
 		e.data.name = "Name";
 		e.data.description = "description";
 		e.data.symbolID = "SFGPU----------";//A 15 character symbolID corresponding to one of the graphics in the MIL-STD-2525C
-		e.data.points = controlPoints4;
+		e.data.points = controlPoints4;//like "66.26700036208742,30.62755038706961 66.27555681517738,30.64727776502703 66.25654247497746,30.64632704801704","x1,y1[,z1] [xn,yn[,zn]]...".
 		e.data.altMode = "absolute";//for 3D
-		e.data.scale = scale4;//for 3D
-		e.data.bbox = bbox4;
+		e.data.scale = scale4;//for 3D like 50000.0; a number corresponding to how many meters one meter of our map represents. A value "50000" would mean 1:50K which means for every meter of our map it represents 50000 meters of real world distance.
+		e.data.bbox = bbox4;//like "66.25,30.60,66.28,30.65";"lowerLeftX,lowerLeftY,upperRightX,upperRightY."
 		e.data.modifiers = modifiers;
-		e.data.format = format;
+		e.data.format = format;//0 for KML, 2 for GeoJSON, 6 for GeoSVG
 		e.data.pHeight = pixelHeight;//for 2D
 		e.data.pWidth = pixelWidth;//for 2D
-        e.data.converter l converter for canvas or datauri format
-        e.data.fontInfo
+        e.data.converter  = {} optional converter object for custom geoToPixel Conversion
+        e.data.fontInfo = {} required for SVG format only.  Get from RendererSettings.getMPFontInfo();
 */
 
 /* return object for KML or GeoJSON
@@ -35,23 +35,29 @@ var e.data = {};
 /* expected input format for batch
 var e.data = {};
         e.data.altMode = "absolute";//for 3D
-		e.data.scale = scale4;//for 3D
-		e.data.bbox = bbox4;
-        e.data.format = format
+		e.data.scale = scale4;//for 3D like 50000.0;  a number corresponding to how many meters one meter of our map represents. A value "50000" would mean 1:50K which means for every meter of our map it represents 50000 meters of real world distance.
+		e.data.bbox = bbox4;//like "66.25,30.60,66.28,30.65";"lowerLeftX,lowerLeftY,upperRightX,upperRightY."
+        e.data.format = format;//0 for KML, 2 for GeoJSON, 6 for GeoSVG
         e.data.pHeight = pixelHeight;//for 2D
 		e.data.pWidth = pixelWidth;//for 2D
-        e.data.converter = optional converter for SVG format
-        e.data.fontInfo = fontInfo//for SVG
+        e.data.converter = {} optional converter object for custom geoToPixel Conversion
+        e.data.fontInfo = {} required for SVG format only.  Get from RendererSettings.getMPFontInfo();
         e.data.batch = [{id:"ID",name:"name",description:"description",symbolID:"GFTPL-----****X",points:controlPoints,symStd:symStd,modifiers:{ModifiersTG.T_UNIQUE_DESIGNATION_1:"T",MilStdAttributes.LineColor:"#00FF00"}}];
         
 */
 
-/* return object for batch
+/* return objects for batch
 {
+    //KML
+    [{id:batch.id,symbolID:symbolID,kml:"kml string"}]
+    //GeoJSON
+    [{id:batch.id,symbolID:symbolID,geojson:"geojson string"]
+    //SVG
     [{id:batch.id,symbolID:symbolID,svg:dataURI,geoTL:geoCoordTL, geoBR:geoCoordBR, wasClipped:wasClipped}]
 }
 */
 
+
 //GeoCanvas doesn't work in a web worker due to its need for the DOM.
 importScripts('m-c.js');//for strictly KML, GeoJSON and SVG(with hatch line and metoc fills, but no symbol fills)
 //importScripts('svm-bc.js');//for strictly KML, GeoJSON and SVG(with hatch line and metoc fills, and symbol fills)
@@ -100,6 +106,7 @@ onmessage = function(e)
 	var output = null;
     var converter = null;
     var fontInfo = null;
+    var format = ["kml","json","geojson","","","","svg","svg"];
     
     if(e.data.fontInfo !== null)
             fontInfo = e.data.fontInfo;
@@ -109,6 +116,7 @@ onmessage = function(e)
         var result = null;
         var len = e.data.batch.length;
         var items = e.data.batch;
+        var temp = null;
         //output = new Array(len);
         output = [];
         try
@@ -130,10 +138,19 @@ onmessage = function(e)
                 }
                 if(result)
                 {
-                    result.id = item.id;
-                    result.symbolID = item.symbolID;
-                    //output[i] = result;
-                    output.push(result);
+                    if(e.data.format === 6 || e.data.format === 7)//SVG
+                    {
+                        result.id = item.id;
+                        result.symbolID = item.symbolID;
+                        //output[i] = result;
+                        output.push(result);
+                    }
+                    else//KML or GeoJSON return string
+                    {
+                        temp = {id:item.id, symbolID:item.symbolID}
+                        temp[format[e.data.format]] = result; 
+                        output.push(temp);
+                    }
                 }
             }
         }
diff --git a/web/samples/multiPointTester1.html b/web/samples/multiPointTester1.html
index c763d149..684a94a4 100644
--- a/web/samples/multiPointTester1.html
+++ b/web/samples/multiPointTester1.html
@@ -4,7 +4,7 @@
 <!-- Meta line required for IE-->
 <!-- <meta http-equiv="X-UA-Compatible" content="IE=edge" /> -->
 
-<script src="sm-bc.min.js" type="text/javascript" ></script>
+<script src="sm-c.js" type="text/javascript" ></script>
 
 
  <script type = "text/javascript">
@@ -48,40 +48,43 @@
 	//var rendererMP = new sec.web.renderer.SECWebRenderer();
         var rendererMP = sec.web.renderer.SECWebRenderer;
 
-    if (rendererMP !== null) {
+    if (rendererMP !== null) 
+    {
         
-/*var foo = new java.lang.StringBuilder("test");
-foo.append("ing");
-console.log(foo);
-console.log(foo.toString());*/
 
         
-armyc2.c2sd.renderer.utilities.ErrorLogger.LogMessage("multiPoints3.html","testRender","AMBUSH");
+        armyc2.c2sd.renderer.utilities.ErrorLogger.LogMessage("multiPoints3.html","testRender","AMBUSH");
         var modifiers = "";
         //AMBUSH EXAMPLE
         var symbolCode = "GHGPSLA-------X";//ambush
         //var symbolCode = "GHGPGAA-------X"; //assembly area
-        var controlPoints = "66.26700036208742,30.62755038706961 66.27555681517738,30.64727776502703 66.25654247497746,30.64632704801704";
+        //var controlPoints = "66.26700036208742,30.62755038706961 66.27555681517738,30.64727776502703 66.25654247497746,30.64632704801704";
+        var controlPoints = "66.27555681517738,30.64727776502703 66.25654247497746,30.64632704801704 66.26700036208742,30.62755038706961";
         
+        //var bbox = "66.25,30.60,66.28,30.65";
         var bbox = "66.25,30.60,66.28,30.65";
         //var bbox = "-180.0,-90.0,180.0,90.0";
-        var scale = 50000.0;
+        var scale = 500000.0;
 		
-		var formatJSON = 1;
+        var formatGeoSVG = 6;
+        var formatGeoCanvas = 3;
+		var formatGeoJSON = 2;
 		var formatKML = 0;
 		var pixelWidth = 800;
 		var pixelHeight = 600;
 		
 		//change this to format JSON to see the different output.
-		//var format = formatJSON;
-		var format = formatKML;
+		//var format = formatGeoJSON;
+		//var format = formatKML;
+        var format = formatGeoCanvas;
+        //var format = formatGeoSVG;
 		
 		
 		//Not meant to be changed on the fly.
 		//Let's user choose between 2525Bch2 and 2525C.
         var ms2525Bch2 = 0;
 	    var ms2525C = 1;
-        var symStd = ms2525Bch2;
+        var symStd = ms2525C;
 		rendererMP.setDefaultSymbologyStandard(symStd);
 		
 		//RenderSymbol2D recommended for 2D maps.  KML or JSON format will work.  
@@ -107,7 +110,7 @@
 
 		document.getElementById("contentSpan").innerHTML = "<br />AMBUSH:   <br/>";
 
-		if(format == formatJSON)
+		if(format == formatGeoJSON)
 		{
 			document.getElementById("contentSpan").innerHTML += "JSON Format:<br/>";
 			if (json == null || json == "")
@@ -115,6 +118,23 @@
 			else
 				document.getElementById("contentSpan").innerHTML +=  json;
 		}
+        else if(format === formatGeoCanvas)
+		{
+                    var geoCanvas = json.image;//sec.web.renderer.MultiPointHandler.RenderShapeInfoToCanvas(json.paths, json.textInfos, json.bounds, json.geoTL, json.geoBR);
+                    var preview = document.getElementById("preview");
+                    preview.width = geoCanvas.width;
+                    preview.height = geoCanvas.height;
+                    var ctx = preview.getContext('2d');
+                    ctx.drawImage(geoCanvas,0,0);
+		}
+        else if(format === formatGeoSVG || format === 7)
+        {   //return {svg:geoSVG, geoTL:geoCoordTL, geoBR:geoCoordBR, wasClipped:wasClipped};
+            var svg = json.svg;
+            var svgImage = document.getElementById("preview2");
+            svgImage.width = json.bounds.getWidth();
+            svgImage.height = json.bounds.getHeight();
+            svgImage.src = svg;
+        }
 		else// if formated as KML
 		{
 			document.getElementById("contentSpan").innerHTML += "KML Format:<br/>";
@@ -171,7 +191,7 @@
 		
         document.getElementById("contentSpan").innerHTML += "<br/><br/>Assembly Area:   <br/>";
 
-		if(format == formatJSON)
+		if(format == formatGeoJSON)
 		{
 			document.getElementById("contentSpan").innerHTML += "JSON Format:<br/>";
 			if (json2 == null || json2 == "")
@@ -232,7 +252,7 @@
 		var timeSRF = (stop-start)/1000;
         document.getElementById("contentSpan").innerHTML += "<br/><br/>Sector Range Fan:   <br/>";
 
-		if(format == formatJSON)
+		if(format == formatGeoJSON)
 		{
 			document.getElementById("contentSpan").innerHTML += "JSON Format:<br/>";
 			if (json3 == null || json3 == "")
@@ -295,7 +315,7 @@
 		console.log('Render 1k symbols: ' + (time/1000));
         document.getElementById("contentSpan").innerHTML += "<br/><br/>FLOT:   <br/>";
 
-		if(format === formatJSON)
+		if(format === formatGeoJSON)
 		{
 			document.getElementById("contentSpan").innerHTML += "JSON Format:<br/>";
 			if (json4 === null || json4 === "")
@@ -349,8 +369,9 @@
 
 	</script>
 </head>
-<body>
-
+<body bgcolor="Cyan">
+Draw To Canvas Test:
+<canvas id="preview" width="30" height="30"></canvas><img id="preview2" src="" alt="" height="30" width="30"><br>
     <button type='button' onclick='testRender()'>Test Multipoint</button>
 	<button type='button' onclick='cleartext()'>Clear</button>
 	
diff --git a/web/samples/multiPointTesterSVGWebWorker.html b/web/samples/multiPointTesterSVGWebWorker.html
deleted file mode 100644
index 822ee57e..00000000
--- a/web/samples/multiPointTesterSVGWebWorker.html
+++ /dev/null
@@ -1,301 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-<!-- Meta line required for IE-->
-<!-- <meta http-equiv="X-UA-Compatible" content="IE=edge" /> -->
-
-<!-- Only versions of the renderer starting with "m-" are compatible with web workers" /> -->
-<!-- Output is limited to KML and GeoJSON.  Canvas output is not possible in a web worker /> -->
-<script src="m-c.js" type="text/javascript" ></script>
-<!-- <script src="svm-bc.js" type="text/javascript" ></script> -->
-
-
- <script type = "text/javascript">
- 
-var worker = new Worker('MPWorker.js');
-var startTime = null;
-var stopTime = null;
-//function for formatting KML so it can be rendered properly on the HTML page
-function formatKMLForHTML(kml)
-{
-	var formattedKML = "";
-	var tempString = kml;
-	
-	var index = 0;
-	var start = 0;
-
-	index = tempString.indexOf("<");
-	while(index >=0)
-	{
-		tempString = tempString.replace("<","&lt;");
-		start = index+1;
-		index = tempString.indexOf("<", start);
-	}
-	index = tempString.indexOf(">");
-	while(index >=0)
-	{
-		tempString = tempString.replace(">","&gt;");
-		start = index+1;
-		index = tempString.indexOf(">", start);
-	}
-
-	formattedKML = tempString;
-	
-	return formattedKML;
-}
-//clears text on HTML page
-function cleartext()
-{
-	//alert('clr');
-	document.getElementById("contentSpan").innerHTML = "";
-     var svgImage = document.getElementById("preview2");
-                svgImage.src = null;
-	return;
-}
-//sample render call to web worker
-function testRender(batch)
-{
-    var rendererMP = sec.web.renderer.SECWebRenderer;
-    var RS = armyc2.c2sd.renderer.utilities.RendererSettings;
-
-    if (rendererMP !== null) 
-    {	
-		var formatGeoSVG = 6;
-		var formatGeoCanvasLabels = 5;
-		var formatGeoCanvasDataURL = 4;
-		var formatGeoCanvas = 3;
-		var formatGeoJSON = 2;
-		var formatJSON = 1;
-		var formatKML = 0;
-		var pixelWidth = 1000;
-		var pixelHeight = 1000;
-		
-		//change this to format GeoJSON to see the different output.
-		//var format = formatGeoJSON;
-		var format = formatGeoSVG;
-        //var format = formatKML;
-		
-		//RenderSymbol2D recommended for 2D maps.  
-		//ID, Name and Description are optional when using GeoJSON format.
-
-
-//armyc2.c2sd.renderer.utilities.ErrorLogger.LogMessage("multiPointTesterWebWorker.html","testRender","SECTOR RANGE FAN");
-		//SECTOR RANGE FAN EXAMPLE
-		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
-		//var symbolCode = "GFFPAXS---****X"; //sector range fan
-        //var symbolCode = "GHGASLA-------X";//ambush anticipated
-		//var symbolCode = "GHGPSLA-------X";//ambush present
-		//var symbolCode = "GFGPGAE---****X";//engagement area
-        //var symbolCode = "GFGAGAA-------X"; //assembly area
-        var symbolCode = "GHGPGLF-------X";//flot
-		//var symbolCode = "GHGPGAL-------X";//landing zone
-		//var symbolCode = "GHGPALL-------X";//LLTR
-		//var symbolCode = "GHGPALC-------X";////air corridor
-		//var symbolCode = "GFGPAAR---****X";//ROZ
-        //var symbolCode = "GFFPLTS--------";//Linear Smoke Target
-		//var symbolCode = "GHFPLCN-------X";//NFL
-		//var symbolCode = "GHFPLCR-------X";//RFL
-        //var symbolCode = "GFGPGLP---****X";//Phase Line
-		//var symbolCode = "GFFPACSI--****X";//Fire Support Area
-		//var symbolCode = "GFFPACAI--****X";//Airspace Coordination Area Irregular
-        //var symbolCode = "GFFPACAR--****X";//Airspace Coordination Area Rectangular
-        //var symbolCode = "WOS-HPFF----A--";//Weirs
-        //var symbolCode = "WO-DHCB-----A--";//Beack Hydrography
-		//var symbolCode = "GFTPF-----****X";//Task/Fix
-		//var symbolCode = "WO-DHHDF----A--";//fould ground
-        //var symbolCode = "G*F*AKBC--****X";//kill box blue rectangular
-        //var symbolCode = "GPTPQ---------X";//retain
-        //var symbolCode = "GFMPOAR-------X";//antitank ditch reinforced with antitank mines
-        //var symbolCode = "GFMPORP-------X";//roadblocks, craters, and blown bridges planned
-        //var symbolCode = "GFMPOADC------X";//AD complete
-        //var symbolCode = "GFSPLRA---****X";//ASR
-        
-        //3 point area
-        var controlPoints = "66.27555681517738,30.64727776502703 66.25654247497746,30.64632704801704 66.26700036208742,30.62755038706961";
-		//var controlPoints = "66.25654247497746,30.64632704801704 66.27555681517738,30.64727776502703";
-        //var controlPoints = "66.26700036208742,30.62755038706961 66.27555681517738,30.64727776502703 66.25654247497746,30.64632704801704";
-        //angled 2 pt line
-        //var controlPoints = "66.26700036208742,30.62755038706961 66.27555681517738,30.64727776502703";
-        //horizontal 2 pt line
-        //var controlPoints = "66.26700036208742,30.62755038706961 66.27555681517738,30.62755038706961";
-
-        modifiers = {"H":"0:FFFF0000,1:FF00FF00,2:FF0000FF"};
-        //modifiers = {"T":"NAME","H":"H","lineColor":"00ff00","W":"W1","W1":"W2"};
-		//modifiers = {"T":"NAME","H":"H","lineColor":"00ff00","fillColor":"60ff0000","W":"W1","W1":"W2"};
-        //modifiers = {"symbolFillIds":"SFGPU----------,SUGPU----------","symbolFillIconSize":35};
-        //modifiers = {"T":"NAME","H":"H","lineColor":"00ff00","W":"W1","W1":"W2","AM":[5000]};
-		//modifiers = {"T":"NAME","H":"H","W":"W1","W1":"W2","AM":[500,700],"lineColor":"#0000FF","fillColor":"#0000FF"};
-		//modifiers = {"T":"SNOOPY DOG","H":"H","W":"W1","W1":"W2","AM":[500,700],"lineColor":"#300000FF","fillColor":"#0000FF","textColor":"#FF00FF","textBackgroundColor":"#00FF00"};
-		
-        var bbox = "66.25,30.60,66.28,30.65";
-        //var bbox = "66.20,30.5,66.35,30.8";
-		//var bbox = "66.25,30.60,66.26,30.65";
-        //var bbox = "-180.0,-90.0,180.0,90.0";
-        //bbox = null;
-        var scale = 500000.0;
-		
-        //distance (AM), azimuth (AN), and altitudeDepth (X) can all have multiple values so they are enclosed in brackets.
-        var ModifiersTG = armyc2.c2sd.renderer.utilities.ModifiersTG;
-        var MilStdAttributes = armyc2.c2sd.renderer.utilities.MilStdAttributes;
-		var modifiers = {};//{"AM":[3000,10000],"AN":[315,45]};
-        modifiers[ModifiersTG.AM_DISTANCE] = [3000,10000];
-        modifiers[ModifiersTG.AN_AZIMUTH] = [315,45];
-        modifiers[ModifiersTG.X_ALTITUDE_DEPTH] = [0];
-		modifiers[MilStdAttributes.LookAtTag] = true;
-
-        var symStd = RS.Symbology_2525C;
-		//webworker sector range fan test
-		//web worker assumes defaults.  you must pass any relevant overrides like symstd.
-		var result;
-        var fontInfo = null;
-		var data = {};
-		data.id = "ID";
-		data.name = "Name";
-		data.description = "description";
-		data.symbolID = symbolCode;
-		data.points = controlPoints;
-		//data.altMode = "absolute";//comment out to render as 2D
-		data.scale = scale;
-		data.bbox = bbox;
-		data.modifiers = modifiers;//{"AM":[3000,10000],"AN":[315,45],"X":[0],"LOOKAT":true};
-		data.format = format;
-		data.pixelHeight = pixelHeight;
-		data.pixelWidth = pixelWidth;
-		data.symstd = symStd;//1;//1=2525C, 0=2525Bch2 
-        
-        if(format === formatGeoSVG)
-        {
-            data.fontInfo = getFontInfo("arial",14,"bold");
-        }
-		
-		//create web worker,//moved to top so only created once.
-		//var worker = new Worker('MPWorker.js');
-		
-        //setup callbacks
-		worker.onerror = function(error)
-		{
-            //logs error to console
-			armyc2.c2sd.renderer.utilities.ErrorLogger.LogException("MPWorker","postMessage",error);
-		};
-		worker.onmessage = function(e)
-		{
-            stopTime = Date.now();
-            var batchTime = (stopTime-startTime) / 1000;
-            document.getElementById("contentSpan").innerHTML += "<br/><br/>Batch Time: "+ batchTime +"  <br/>";
-            if(e.data.id)//not a batch call
-            {
-                result = e.data.result;
-                document.getElementById("contentSpan").innerHTML += "<br/><br/>Symbol via Web Worker:   <br/>";
-            }
-            else//batch call
-            {
-                document.getElementById("contentSpan").innerHTML += "<br/><br/>Batch Symbol via Web Worker:   <br/>";
-                result = e.data.result[0];
-            }
-			
-
-			if(e.data.format === "ERROR")
-			{
-                document.getElementById("contentSpan").innerHTML += "ERROR:<br/>";
-				document.getElementById("contentSpan").innerHTML += result;
-			}
-			else if(format === formatJSON || format === formatGeoJSON)
-			{
-				document.getElementById("contentSpan").innerHTML += "JSON Format:<br/>";
-				if (result === null || result === "")
-					document.getElementById("contentSpan").innerHTML += "json empty";
-				else
-				{
-					document.getElementById("contentSpan").innerHTML += result;
-				}
-			}
-            else if(format === formatGeoSVG || format === 7)
-            {   //return {svg:geoSVG, geoTL:geoCoordTL, geoBR:geoCoordBR, wasClipped:wasClipped};
-                var svg = result.svg;
-                var svgImage = document.getElementById("preview2");
-                svgImage.width = result.bounds.width;
-                svgImage.height = result.bounds.height;
-                svgImage.src = svg;
-            }
-			else// if formatted as KML
-			{
-				document.getElementById("contentSpan").innerHTML += "KML Format:<br/>";
-				
-				if (result === null || result === "")
-					document.getElementById("contentSpan").innerHTML += "kml empty";
-				else
-				{
-					var formattedKML = "";
-                    //the following is just so you can view the KML properly on the html page.
-				    //this isn't something you'd normally do.
-					formattedKML = formatKMLForHTML(result);
-					
-					document.getElementById("contentSpan").innerHTML += formattedKML;
-				}
-			}
-            
-            
-			
-		};//*/
-		
-		//send data for render request to web worker
-        if(batch)
-        {
-            try
-            {
-                //var item = {id:"ID",name:"name",description:"description",symbolID:symbolCode,points:controlPoints,symstd:symStd,modifiers:modifiers};
-                var batchSize = 1000;
-                data.batch = new Array();
-                for(var i = 0; i < batchSize; i++)
-                {
-                    data.batch[i] = {id:"ID",name:"name",description:"description",symbolID:symbolCode,points:controlPoints,symstd:symStd,modifiers:modifiers};
-                }
-            }
-            catch(err)
-            {
-                console.log(err);
-            }
-        }
-        startTime = Date.now();
-        worker.postMessage(data);
-        document.getElementById("contentSpan").innerHTML += "<br/><br/>Batch Running...   <br/>";
-		
-
-		
-    } //end if
-}
-
-function getFontInfo(name, size, style){
-    _ModifierFontName = name;
-    _ModifierFontSize = size;
-    if(style !== 'bold' || style !== 'normal')
-    {
-        _ModifierFontStyle = style;
-    }
-    else
-    {
-        _ModifierFontStyle = 'bold';
-    }
-    _ModifierFont = style + " " + size + "pt " + name;
-    
-    var measurements = armyc2.c2sd.renderer.utilities.RendererUtilities.measureFont(_ModifierFont);
-    return {name: name, size:size, style:style, measurements:measurements};
-}
-
-	</script>
-</head>
-<body bgcolor="Cyan">
-Draw SVG To Image Test:
-<canvas id="preview" width="30" height="30"></canvas><img id="preview2" src="" alt="" height="30" width="30"><br>
-    <button type='button' onclick='testRender()'>Test Multipoint</button>
-    <button type='button' onclick='testRender(true)'>Test Multipoint Batch</button>
-	<button type='button' onclick='cleartext()'>Clear</button>
-	
-   <span id='contentSpan'/>
-   
-   
-   
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/web/samples/multiPointTesterWebWorker.html b/web/samples/multiPointTesterWebWorker.html
index 33a34a9d..6efeadbd 100644
--- a/web/samples/multiPointTesterWebWorker.html
+++ b/web/samples/multiPointTesterWebWorker.html
@@ -6,11 +6,15 @@
 
 <!-- Only versions of the renderer starting with "m-" are compatible with web workers" /> -->
 <!-- Output is limited to KML and GeoJSON.  Canvas output is not possible in a web worker /> -->
-<script src="m-c.js" type="text/javascript" ></script>
+<!-- <script src="m-c.js" type="text/javascript" ></script> -->
+<script src="m-c.js" type="text/javascript" ></script> 
 
 
  <script type = "text/javascript">
  
+var worker = new Worker('MPWorker.js');
+var startTime = null;
+var stopTime = null;
 //function for formatting KML so it can be rendered properly on the HTML page
 function formatKMLForHTML(kml)
 {
@@ -44,25 +48,36 @@
 {
 	//alert('clr');
 	document.getElementById("contentSpan").innerHTML = "";
+     var svgImage = document.getElementById("preview2");
+                svgImage.src = null;
 	return;
 }
 //sample render call to web worker
-function testRender()
-{
+var messageCount = 0;
+function testRender(batch)
+{messageCount = 0;
     var rendererMP = sec.web.renderer.SECWebRenderer;
     var RS = armyc2.c2sd.renderer.utilities.RendererSettings;
 
     if (rendererMP !== null) 
     {	
+		var formatGeoSVG = 6;
+		var formatGeoCanvasLabels = 5;
+		var formatGeoCanvasDataURL = 4;
+		var formatGeoCanvas = 3;
 		var formatGeoJSON = 2;
 		var formatJSON = 1;
 		var formatKML = 0;
-		var pixelWidth = 800;
-		var pixelHeight = 600;
+		var pixelWidth = 1000;
+		var pixelHeight = 1000;
 		
 		//change this to format GeoJSON to see the different output.
 		//var format = formatGeoJSON;
-		var format = formatKML;
+		//var format = formatGeoSVG;
+        //var format = formatKML;
+        
+        var cbFormat = document.getElementById("format");
+        var format = parseInt(cbFormat.value);
 		
 		//RenderSymbol2D recommended for 2D maps.  
 		//ID, Name and Description are optional when using GeoJSON format.
@@ -71,13 +86,57 @@
 //armyc2.c2sd.renderer.utilities.ErrorLogger.LogMessage("multiPointTesterWebWorker.html","testRender","SECTOR RANGE FAN");
 		//SECTOR RANGE FAN EXAMPLE
 		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
-		var symbolCode = "GFFPAXS---****X"; //sector range fan
+		//var symbolCode = "GFFPAXS---****X"; //sector range fan
+        //var symbolCode = "GHGASLA-------X";//ambush anticipated
+		//var symbolCode = "GHGPSLA-------X";//ambush present
+		//var symbolCode = "GFGPGAE---****X";//engagement area
+        //var symbolCode = "GFGAGAA-------X"; //assembly area
+        var symbolCode = "GHGPGLF-------X";//flot
+		//var symbolCode = "GHGPGAL-------X";//landing zone
+		//var symbolCode = "GHGPALL-------X";//LLTR
+		//var symbolCode = "GHGPALC-------X";////air corridor
+		//var symbolCode = "GFGPAAR---****X";//ROZ
+        //var symbolCode = "GFFPLTS--------";//Linear Smoke Target
+		//var symbolCode = "GHFPLCN-------X";//NFL
+		//var symbolCode = "GHFPLCR-------X";//RFL
+        //var symbolCode = "GFGPGLP---****X";//Phase Line
+		//var symbolCode = "GFFPACSI--****X";//Fire Support Area
+		//var symbolCode = "GFFPACAI--****X";//Airspace Coordination Area Irregular
+        //var symbolCode = "GFFPACAR--****X";//Airspace Coordination Area Rectangular
+        var symbolCode = "WOS-HPFF----A--";//Weirs
+        //var symbolCode = "WO-DHCB-----A--";//Beack Hydrography
+		//var symbolCode = "GFTPF-----****X";//Task/Fix
+		//var symbolCode = "WO-DHHDF----A--";//fould ground
+        //var symbolCode = "G*F*AKBC--****X";//kill box blue rectangular
+        //var symbolCode = "GPTPQ---------X";//retain
+        //var symbolCode = "GFMPOAR-------X";//antitank ditch reinforced with antitank mines
+        //var symbolCode = "GFMPORP-------X";//roadblocks, craters, and blown bridges planned
+        //var symbolCode = "GFMPOADC------X";//AD complete
+        //var symbolCode = "GFSPLRA---****X";//ASR
         
+        //3 point area
+        var controlPoints = "66.27555681517738,30.64727776502703 66.25654247497746,30.64632704801704 66.26700036208742,30.62755038706961";
+		//var controlPoints = "66.25654247497746,30.64632704801704 66.27555681517738,30.64727776502703";
+        //var controlPoints = "66.26700036208742,30.62755038706961 66.27555681517738,30.64727776502703 66.25654247497746,30.64632704801704";
+        //angled 2 pt line
+        //var controlPoints = "66.26700036208742,30.62755038706961 66.27555681517738,30.64727776502703";
+        //horizontal 2 pt line
+        //var controlPoints = "66.26700036208742,30.62755038706961 66.27555681517738,30.62755038706961";
 
-        var controlPoints = "66.26700036208742,30.62755038706961";
-        var bbox = "66.25,30.627,66.27,30.63";//whole symbol will be calculated
-
-        var scale = 50000.0;
+        modifiers = {"H":"0:FFFF0000,1:FF00FF00,2:FF0000FF"};
+        //modifiers = {"T":"NAME","H":"H","lineColor":"00ff00","W":"W1","W1":"W2"};
+		//modifiers = {"T":"NAME","H":"H","lineColor":"00ff00","fillColor":"60ff0000","W":"W1","W1":"W2"};
+        //modifiers = {"symbolFillIds":"SFGPU----------,SUGPU----------","symbolFillIconSize":35};
+        //modifiers = {"T":"NAME","H":"H","lineColor":"00ff00","W":"W1","W1":"W2","AM":[5000]};
+		//modifiers = {"T":"NAME","H":"H","W":"W1","W1":"W2","AM":[500,700],"lineColor":"#0000FF","fillColor":"#0000FF"};
+		//modifiers = {"T":"SNOOPY DOG","H":"H","W":"W1","W1":"W2","AM":[500,700],"lineColor":"#300000FF","fillColor":"#0000FF","textColor":"#FF00FF","textBackgroundColor":"#00FF00"};
+		
+        var bbox = "66.25,30.60,66.28,30.65";
+        //var bbox = "66.20,30.5,66.35,30.8";
+		//var bbox = "66.25,30.60,66.26,30.65";
+        //var bbox = "-180.0,-90.0,180.0,90.0";
+        //bbox = null;
+        var scale = 500000.0;
 		
         //distance (AM), azimuth (AN), and altitudeDepth (X) can all have multiple values so they are enclosed in brackets.
         var ModifiersTG = armyc2.c2sd.renderer.utilities.ModifiersTG;
@@ -88,27 +147,49 @@
         modifiers[ModifiersTG.X_ALTITUDE_DEPTH] = [0];
 		modifiers[MilStdAttributes.LookAtTag] = true;
 
-
-		//webworker sector range fan test
+        var symStd = RS.Symbology_2525C;
 		//web worker assumes defaults.  you must pass any relevant overrides like symstd.
 		var result;
+        var fontInfo = null;
 		var data = {};
+        //required parameters///////////////////////////////////////////////////////////////////////
+		//data.altMode = "absolute";//required for 3d, comment out to render as 2D
+		data.scale = scale;//required for 3d
+		data.bbox = bbox;//required
+		data.format = format;//required
+		data.pixelHeight = pixelHeight;//required for 2d
+		data.pixelWidth = pixelWidth;//required for 2d
+        //required for non-batch call//////////////////////////////////////////////////////////////////
 		data.id = "ID";
 		data.name = "Name";
 		data.description = "description";
 		data.symbolID = symbolCode;
 		data.points = controlPoints;
-		data.altMode = "absolute";
-		data.scale = scale;
-		data.bbox = bbox;
-		data.modifiers = modifiers;//{"AM":[3000,10000],"AN":[315,45],"X":[0],"LOOKAT":true};
-		data.format = format;
-		data.pixelHeight = pixelHeight;
-		data.pixelWidth = pixelWidth;
-		data.symstd = RS.Symbology_2525C;//1;//1=2525C, 0=2525Bch2 
-		
-		//create web worker
-		var worker = new Worker('MPWorker.js');
+        data.modifiers = modifiers;//{"AM":[3000,10000],"AN":[315,45],"X":[0],"LOOKAT":true};
+        data.symstd = symStd;//1;//1=2525C, 0=2525Bch2 
+        //required for SVG format
+        if(format === formatGeoSVG)
+        {
+            data.fontInfo = getFontInfo("arial",14,"bold");
+        }
+        if(batch)//if batch, fill batch array with symbol properties
+        {
+            try
+            {
+                //populate batch array with symbol information
+                //var item = {id:"ID",name:"name",description:"description",symbolID:symbolCode,points:controlPoints,symstd:symStd,modifiers:modifiers};
+                var batchSize = 1000;
+                data.batch = [];
+                for(var i = 0; i < batchSize; i++)
+                {
+                    data.batch[i] = {id:"ID",name:"name",description:"description",symbolID:symbolCode,points:controlPoints,symstd:symStd,modifiers:modifiers};
+                }
+            }
+            catch(err)
+            {
+                console.log(err);
+            }
+        }
 		
         //setup callbacks
 		worker.onerror = function(error)
@@ -116,17 +197,44 @@
             //logs error to console
 			armyc2.c2sd.renderer.utilities.ErrorLogger.LogException("MPWorker","postMessage",error);
 		};
+        //process results from web worker
 		worker.onmessage = function(e)
 		{
-			result = e.data.result;
-			document.getElementById("contentSpan").innerHTML += "<br/><br/>Sector Range Fan via Web Worker:   <br/>";
+
+                stopTime = Date.now();
+                var batchTime = (stopTime-startTime) / 1000;
+                document.getElementById("contentSpan").innerHTML += "<br/><br/>Batch Time: "+ batchTime +"  <br/>";
+            
+            if(e.data.id)//not a batch call
+            {
+
+                    result = e.data.result;
+                    document.getElementById("contentSpan").innerHTML += "<br/><br/>Symbol via Web Worker:   <br/>";
+                
+            }
+            else//batch call
+            {
+            
+                document.getElementById("contentSpan").innerHTML += "<br/><br/>Batch Symbol via Web Worker:   <br/>";
+                if(format === formatKML)
+                {
+                    result = e.data.result[0].kml;
+                }
+                else if(format === formatGeoJSON)
+                {
+                    result = e.data.result[0].geojson;
+                }
+                else
+                    result = e.data.result[0];
+            }
+			
 
 			if(e.data.format === "ERROR")
 			{
                 document.getElementById("contentSpan").innerHTML += "ERROR:<br/>";
 				document.getElementById("contentSpan").innerHTML += result;
 			}
-			else if(format === formatJSON || format === formatGeoJSON)
+			else if(format === formatGeoJSON)
 			{
 				document.getElementById("contentSpan").innerHTML += "JSON Format:<br/>";
 				if (result === null || result === "")
@@ -136,6 +244,14 @@
 					document.getElementById("contentSpan").innerHTML += result;
 				}
 			}
+            else if(format === formatGeoSVG || format === 7)
+            {   //return {svg:geoSVG, geoTL:geoCoordTL, geoBR:geoCoordBR, wasClipped:wasClipped};
+                var svg = result.svg;
+                var svgImage = document.getElementById("preview2");
+                svgImage.width = result.bounds.width;
+                svgImage.height = result.bounds.height;
+                svgImage.src = svg;
+            }
 			else// if formatted as KML
 			{
 				document.getElementById("contentSpan").innerHTML += "KML Format:<br/>";
@@ -152,21 +268,58 @@
 					document.getElementById("contentSpan").innerHTML += formattedKML;
 				}
 			}
+            
+            
 			
 		};//*/
 		
 		//send data for render request to web worker
-		worker.postMessage(data);
-
-		
+        startTime = Date.now();
+        worker.postMessage(data);
+        document.getElementById("contentSpan").innerHTML += "<br/><br/>Batch Running...   <br/>";
+	
     } //end if
 }
 
+//getFontInfo
+//Use this function to get font info needed for SVG web worker rendering.
+//If you already have the full renderer loaded you can just call armyc2.c2sd.renderer.utilities.RendererSettings.getMPFontInfo();
+//If you want to load as little as possible outside of the web worker, just make sure you have the RendererUtilities.js file loaded
+//and use this function to get the fontInfo object.
+function getFontInfo(name, size, style){
+    _ModifierFontName = name;
+    _ModifierFontSize = size;
+    if(style !== 'bold' || style !== 'normal')
+    {
+        _ModifierFontStyle = style;
+    }
+    else
+    {
+        _ModifierFontStyle = 'bold';
+    }
+    _ModifierFont = style + " " + size + "pt " + name;
+    
+    var measurements = armyc2.c2sd.renderer.utilities.RendererUtilities.measureFont(_ModifierFont);
+    return {name: name, size:size, style:style, measurements:measurements};
+}
+
+function preload() {
+    var cbFormat = document.getElementById("format");
+    cbFormat.selectedIndex=2;
+}
+
 	</script>
 </head>
-<body>
-
+<body bgcolor="Cyan" onload="preload();">
+Draw SVG To Image Test:
+<canvas id="preview" width="30" height="30"></canvas><img id="preview2" src="" alt="" height="30" width="30"><br>
+    <select id="format">
+      <option value=0>KML</option>
+      <option value=2>GeoJSON</option>
+      <option value=6>GeoSVG</option>
+    </select>
     <button type='button' onclick='testRender()'>Test Multipoint</button>
+    <button type='button' onclick='testRender(true)'>Test Multipoint Batch</button>
 	<button type='button' onclick='cleartext()'>Clear</button>
 	
    <span id='contentSpan'/>
diff --git a/web/samples/singlePointTester3.html b/web/samples/singlePointTester3.html
index 26149f8b..0e2c8b39 100644
--- a/web/samples/singlePointTester3.html
+++ b/web/samples/singlePointTester3.html
@@ -15,7 +15,7 @@
         padding: 25px;
     }
     </style> -->
-	<script src="savm-bc.min.js" type="text/javascript" ></script>
+	<script src="savm-bc.js" type="text/javascript" ></script>
 	    
     <script type = "text/javascript">
 	
@@ -51,7 +51,7 @@
             //if(symbol.getSymbolID().startsWith("G"))
                 modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.C_QUANTITY] = "C";
             
-            modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.F_REINFORCED_REDUCED] = "(+)";//"RD";
+            modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.F_REINFORCED_REDUCED] = "RD";//"(+)";//"RD";
             modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.L_SIGNATURE_EQUIP] = "!";
             //modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.AA_SPECIAL_C2_HQ] = "AA";
             modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.SCC_SONAR_CLASSIFICATION_CONFIDENCE] = "5";
@@ -62,12 +62,18 @@
             modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.T1_UNIQUE_DESIGNATION_2] = "T1";
             modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.Z_SPEED] = "999";//Z
             //*/
-            //modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.CN_CPOF_NAME_LABEL] = "CPOF'D";//Z
+            modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.CN_CPOF_NAME_LABEL] = "CPOF'D";//Z
+            //modifiers[armyc2.c2sd.renderer.utilities.ModifiersUnits.CN_CPOF_NAME_LABEL] = "~`"; //\"CPOF'D";//Z
 			
 			//attributes
 			
-			//modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.LineColor] = "#FF00FF";
+			//modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.LineColor] = "#60FFFF00";
 			//modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.FillColor] = "#00FF00";
+            //modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.Alpha] = 50;
+            
+            //modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.LineColor] = "#FF00FF";
+			//modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.FillColor] = "#8800FF00";
+            //modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.Alpha] = 50;
 			
 			//modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.TextColor] = "#FF00FF";
 			//modifiers[armyc2.c2sd.renderer.utilities.MilStdAttributes.TextBackgroundColor] = "#00FF00";
@@ -98,22 +104,31 @@
             
         
             var ii = armyc2.c2sd.renderer.MilStdIconRenderer.Render(symbolID,modifiers);
-            var si = armyc2.c2sd.renderer.MilStdSVGRenderer.Render(symbolID,modifiers);
-            document.getElementById("contentSpan").innerHTML += si.getSVG();
             var center = ii.getCenterPoint();
             
             var preview = document.getElementById("preview");
             var ctx = preview.getContext('2d');
             
+            //SVG TEST
+            var si = armyc2.c2sd.renderer.MilStdSVGRenderer.Render(symbolID,modifiers);
+            document.getElementById("contentSpan").innerHTML += si.getSVG();
+            var svgImage = document.getElementById("SVGTest");
+            svgImage.width = si.getSVGBounds().getWidth();
+            svgImage.height = si.getSVGBounds().getHeight();
+            svgImage.src = si.getSVGDataURI();
+            
+            //test urlEncode vs base64
+            //speedTestSVGConversion(si.getSVG());
+            
             try
             {
                 x = x - center.getX();
                 y = y - center.getY();
                 //alert(x + " " + y);
                 ctx.drawImage(ii.getImage(), Math.ceil(x),Math.ceil(y));
-                var bounds = ii.getImageBounds();
+                /*var bounds = ii.getImageBounds();
                 bounds.setLocation(x,y);
-                bounds.stroke(ctx);
+                bounds.stroke(ctx);//*/
             }
             catch(err)
             {
@@ -121,6 +136,8 @@
             }
         }
         
+        
+        
         function buildSymbolID(basicID)
         {
             
@@ -209,6 +226,31 @@
             }
 
 	}
+    function speedTestSVGConversion(svg)
+    {
+        var start = new Date().getTime();
+        
+        for(var i = 0; i < 10000; i++)
+		{
+			encodeURIComponent(svg)
+		}
+        
+        var end = new Date().getTime();
+		var time = end - start;
+		alert('encodeURIComponent: ' + (time/1000) + "; length: " + encodeURIComponent(svg).length);//*/
+        
+        start = new Date().getTime();
+        
+        for(var j = 0; j < 10000; j++)
+		{
+			btoa(svg)
+		}
+        
+        end = new Date().getTime();
+		time = end - start;
+		alert('btoa: ' + (time/1000) + "; length: " + btoa(svg).length);//*/
+        
+    }
 	function speedTest(type)
 	{
 		//PERFORMANCE TEST///////////////////////////
@@ -458,6 +500,8 @@
 <!-- <img id="batch1" src="" alt="batch1" height="35" width="35">
 <img id="batch2" src="" alt="batch2" height="35" width="35"> -->
 <br/>
+<img id="SVGTest" src="" alt="svg from datauri" height="100" width="100">
+<br/>
 <span id='contentSpan'/>
 </BODY>
 </html>
\ No newline at end of file