Warning, /DQM/SiPixelMonitorClient/test/trackermap.txt is written in an unsupported language. File is not indexed.
0001 <?xml version="1.0" standalone="no" ?>
0002 <html xmlns="http://www.w3.org/1999/xhtml"
0003 xmlns:svg="http://www.w3.org/2000/svg"
0004 xmlns:xlink="http://www.w3.org/1999/xlink">
0005 <head>
0006 <script type="text/ecmascript"> <![CDATA[
0007
0008 //section to contain script code
0009 var myMapApp = new mapApp();
0010 var myMainMap;
0011 var myRefMapDragger;
0012
0013 //------------------------------------------------------------------------------------------
0014 function init() {
0015 myMapApp.resetFactors();
0016 myMainMap = new map("mainMap",3000,100,1000,0.6);
0017 //set constraints to draggable rect in reference map
0018 myRefMapDragger = new dragObj("dragRectForRefMap",0,200,510,610,"ul");
0019
0020 //colorRegion();
0021 }
0022
0023 //------------------------------------------------------------------------------------------
0024 function showData(evt) {
0025 var xlinkns = "http://www.w3.org/1999/xlink";
0026 var myPoly = evt.currentTarget;
0027 var myDynamicTrackerText = document.getElementById("TrackerText");
0028 var myDynamicTrackerText1 = document.getElementById("TrackerText1");
0029 var myDynamicTrackerMessage = document.getElementById("TrackerMessage");
0030 var myTrackerPlot = document.getElementById("plot");
0031 if (evt.type == "mouseover") {
0032 var myTracker = myPoly.getAttribute("POS");
0033 var myTracker1 = " value="+myPoly.getAttribute("value");
0034 var myMessage = myPoly.getAttribute("MESSAGE");
0035 myTracker1 = myTracker1+" count="+myPoly.getAttribute("count");
0036 // alert (myTracker+" "+myTracker1);
0037 myDynamicTrackerText.firstChild.nodeValue=myTracker;
0038 myDynamicTrackerText1.firstChild.nodeValue=myTracker1;
0039 myDynamicTrackerMessage.firstChild.nodeValue=myMessage;
0040 }
0041
0042 if (evt.type == "mouseout") {
0043 myDynamicTrackerText.firstChild.nodeValue="-";
0044 }
0045
0046 if (evt.type == "click") {
0047 myDynamicTrackerText.firstChild.nodeValue="-";
0048 var moduleId = myPoly.getAttribute("detid");
0049 <<<<<<< trackermap.txt
0050 var url_serv = "http://lxplus096.cern.ch:1972/urn:xdaq-application:lid=15/Request?";
0051 =======
0052 var url_serv = "http://lxplus202.cern.ch:1972/urn:xdaq-application:lid=15/Request?";
0053 >>>>>>> 1.8
0054 var queryString = "RequestID=PlotTkMapHistogram";
0055 queryString+= "&ModId=" + moduleId;
0056 var url1 = url_serv + queryString;
0057 // var filename=moduleId+".jpg";
0058 // myTrackerPlot.setAttributeNS( xlinkns, "xlink:href", filename )
0059 myTrackerPlot.setAttributeNS( xlinkns, "xlink:href", url1);
0060
0061 pausecomp(5000);
0062 queryString = "RequestID=UpdatePlot&t="+moduleId;
0063 var url2 = url_serv + queryString;
0064
0065 myTrackerPlot.setAttributeNS( xlinkns, "xlink:href", url2);
0066
0067 var myTracker = myPoly.getAttribute("POS");
0068 myTracker = myTracker+" value="+myPoly.getAttribute("value");
0069 myTracker = myTracker+" count="+myPoly.getAttribute("count");
0070 myDynamicTrackerText.firstChild.nodeValue=myTracker;
0071 }
0072
0073 }
0074
0075 //------------------------------------------------------------------------------------------
0076 function colorRegion() {
0077 var myGroup = document.getElementById("tracker");
0078 var children = myGroup.childNodes;
0079 var myModule;
0080 //loop over all children
0081 //for (var i = 0; i < children.length;i++) {
0082 for (var i = 0; i < 10000;i++) {
0083 //check if it is a path-element
0084 if (children.item(i).nodeName == "polygon") {
0085 myModule = children.item(i).getAttribute("MODULE");
0086 switch (myModule) {
0087 case "stereo":
0088 myColor = "blue";
0089 break;
0090 case "nostereo":
0091 myColor = "rgb(255,255,0)";
0092 break;
0093 default:
0094 myColor = "red";
0095 }
0096 children.item(i).setAttribute("fill",myColor);
0097 }
0098 }
0099 }
0100
0101 //------------------------------------------------------------------------------------------
0102 //holds data on map
0103 function map(mapName,origWidth,minZoom,maxZoom,zoomFact) {
0104 var mapSVG = document.getElementById(mapName);
0105 this.mapName = mapName;
0106 this.origWidth = origWidth;
0107 this.minZoom = minZoom;
0108 this.maxZoom = maxZoom;
0109 this.zoomFact = zoomFact;
0110 this.pixXOffset = parseFloat(mapSVG.getAttributeNS(null,"x"));
0111 this.pixYOffset = parseFloat(mapSVG.getAttributeNS(null,"y"));
0112 viewBoxArray = mapSVG.getAttributeNS(null,"viewBox").split(" ");
0113 this.curxOrig = parseFloat(viewBoxArray[0]);
0114 this.curyOrig = parseFloat(viewBoxArray[1]);
0115 this.curWidth = parseFloat(viewBoxArray[2]);
0116 this.curHeight = parseFloat(viewBoxArray[3]);
0117 this.pixWidth = parseFloat(mapSVG.getAttributeNS(null,"width"));
0118 this.pixHeight = parseFloat(mapSVG.getAttributeNS(null,"height"));
0119 this.pixXOrig = parseFloat(mapSVG.getAttributeNS(null,"x"));
0120 this.pixYOrig = parseFloat(mapSVG.getAttributeNS(null,"y"));
0121 this.pixSize = this.curWidth / this.pixWidth;
0122 this.zoomVal = this.origWidth / this.curWidth * 100;
0123 }
0124
0125 //------------------------------------------------------------------------------------------
0126 map.prototype.newViewBox = function(refRectId,refMapId) {
0127 var myRefRect = document.getElementById(refRectId);
0128 var myRefMapSVG = document.getElementById(refMapId);
0129 var viewBoxArray = myRefMapSVG.getAttributeNS(null,"viewBox").split(" ");
0130 var refPixSize = viewBoxArray[2] / myRefMapSVG.getAttributeNS(null,"width");
0131 this.curxOrig = parseFloat(viewBoxArray[0]) + (myRefRect.getAttributeNS(null,"x") - myRefMapSVG.getAttributeNS(null,"x")) * refPixSize;
0132 this.curyOrig = parseFloat(viewBoxArray[1]) + (myRefRect.getAttributeNS(null,"y") - myRefMapSVG.getAttributeNS(null,"y")) * refPixSize;
0133 this.curWidth = myRefRect.getAttributeNS(null,"width") * refPixSize;
0134 this.curHeight = myRefRect.getAttributeNS(null,"height") * refPixSize;
0135 var myViewBoxString = this.curxOrig + " " + this.curyOrig + " " + this.curWidth + " " + this.curHeight;
0136 this.pixSize = this.curWidth / this.pixWidth;
0137 this.zoomVal = this.origWidth / this.curWidth * 100;
0138 document.getElementById(this.mapName).setAttributeNS(null,"viewBox",myViewBoxString);
0139 }
0140
0141 //------------------------------------------------------------------------------------------
0142 //holds data on window size
0143 function mapApp() {
0144 }
0145
0146 //------------------------------------------------------------------------------------------
0147 //calculate ratio and offset values of app window
0148 mapApp.prototype.resetFactors = function() {
0149 var svgroot = document.documentElement;
0150 if (!svgroot.getScreenCTM) {
0151 //case for ASV3 and Corel
0152 var viewBoxArray = svgroot.getAttributeNS(null,"viewBox").split(" ");
0153 var myRatio = viewBoxArray[2]/viewBoxArray[3];
0154 if ((window.innerWidth/window.innerHeight) > myRatio) { //case window is more wide than myRatio
0155 this.scaleFactor = viewBoxArray[3] / window.innerHeight;
0156 }
0157 else { //case window is more tall than myRatio
0158 this.scaleFactor = viewBoxArray[2] / window.innerWidth;
0159 }
0160 this.offsetX = (window.innerWidth - viewBoxArray[2] * 1 / this.scaleFactor) / 2;
0161 this.offsetY = (window.innerHeight - viewBoxArray[3] * 1 / this.scaleFactor) / 2;
0162 }
0163 }
0164
0165 //------------------------------------------------------------------------------------------
0166 mapApp.prototype.calcCoord = function(coordx,coordy) {
0167 var svgroot = document.documentElement;
0168 var coords = new Array();
0169 if (!svgroot.getScreenCTM) {
0170 //case ASV3 a. Corel
0171 coords["x"] = (coordx - this.offsetX) * this.scaleFactor;
0172 coords["y"] = (coordy - this.offsetY) * this.scaleFactor;
0173 }
0174 else {
0175 matrix=svgroot.getScreenCTM();
0176 coords["x"]= matrix.inverse().a*coordx+matrix.inverse().c*coordy+matrix.inverse().e;
0177 coords["y"]= matrix.inverse().b*coordx+matrix.inverse().d*coordy+matrix.inverse().f;
0178 }
0179 return coords;
0180 }
0181
0182 //------------------------------------------------------------------------------------------
0183 //make an element draggable with constraints
0184 function dragObj(dragId,constrXmin,constrXmax,constrYmin,constrYmax,refPoint) {
0185 this.dragId = dragId;
0186 this.constrXmin = constrXmin;
0187 this.constrXmax = constrXmax;
0188 this.constrYmin = constrYmin;
0189 this.constrYmax = constrYmax;
0190 this.refPoint = refPoint;
0191 this.status = "false";
0192 }
0193
0194 //------------------------------------------------------------------------------------------
0195 dragObj.prototype.drag = function(evt) {
0196 //works only for rect and use-elements
0197 var myDragElement = evt.target;
0198 if (evt.type == "mousedown") {
0199 var coords = myMapApp.calcCoord(evt.clientX,evt.clientY);
0200 this.curX = coords["x"];
0201 this.curY = coords["y"];
0202 this.status = "true";
0203 }
0204 if (evt.type == "mousemove" && this.status == "true") {
0205 var coords = myMapApp.calcCoord(evt.clientX,evt.clientY);
0206 var newEvtX = coords["x"];
0207 var newEvtY = coords["y"];
0208 var bBox = myDragElement.getBBox();
0209 if (this.refPoint == "ul") {
0210 var toMoveX = bBox.x + newEvtX - this.curX;
0211 var toMoveY = bBox.y + newEvtY - this.curY;
0212 }
0213 else {
0214 //refPoint = center
0215 var toMoveX = bBox.x + bBox.width / 2 + newEvtX - this.curX;
0216 var toMoveY = bBox.y + bBox.height / 2 + newEvtY - this.curY;
0217 }
0218 if ((bBox.x + newEvtX - this.curX) < this.constrXmin) {
0219 if(this.refPoint == "ul") {
0220 toMoveX = this.constrXmin;
0221 }
0222 else {
0223 toMoveX = this.constrXmin + bBox.width / 2;
0224 }
0225 }
0226 if ((bBox.x + newEvtX - this.curX + bBox.width) > this.constrXmax) {
0227 if(this.refPoint == "ul") {
0228 toMoveX = this.constrXmax - bBox.width;
0229 }
0230 else {
0231 toMoveX = this.constrXmax - bBox.width / 2;
0232 }
0233 }
0234 if ((bBox.y + newEvtY - this.curY) < this.constrYmin) {
0235 if(this.refPoint == "ul") {
0236 toMoveY = this.constrYmin;
0237 }
0238 else {
0239 toMoveY = this.constrYmin + bBox.height / 2;
0240 }
0241 }
0242 if ((bBox.y + bBox.height + newEvtY - this.curY) > this.constrYmax) {
0243 if(this.refPoint == "ul") {
0244 toMoveY = this.constrYmax - bBox.height;
0245 }
0246 else {
0247 toMoveY = this.constrYmax - bBox.height / 2;
0248 }
0249 }
0250 myDragElement.setAttributeNS(null,"x",toMoveX);
0251 myDragElement.setAttributeNS(null,"y",toMoveY);
0252 this.curX = newEvtX;
0253 this.curY = newEvtY;
0254 }
0255 if (evt.type == "mouseup" || evt.type == "mouseout") {
0256 this.status = "false";
0257 }
0258 }
0259
0260 //------------------------------------------------------------------------------------------
0261 dragObj.prototype.zoom = function(inOrOut) {
0262 var myDragElement = document.getElementById(this.dragId);
0263 var myOldX = myDragElement.getAttributeNS(null,"x");
0264 var myOldY = myDragElement.getAttributeNS(null,"y");
0265 var myOldWidth = myDragElement.getAttributeNS(null,"width");
0266 var myOldHeight = myDragElement.getAttributeNS(null,"height");
0267 switch (inOrOut) {
0268 case "in":
0269 var myNewX = parseFloat(myOldX) + myOldWidth / 2 - (myOldWidth * myMainMap.zoomFact * 0.5);
0270 var myNewY = parseFloat(myOldY) + myOldHeight / 2 - (myOldHeight * myMainMap.zoomFact * 0.5);
0271 var myNewWidth = myOldWidth * myMainMap.zoomFact;
0272 var myNewHeight = myOldHeight * myMainMap.zoomFact;
0273 break;
0274 case "out":
0275 var myNewX = parseFloat(myOldX) + myOldWidth / 2 - (myOldWidth * (1 + myMainMap.zoomFact) * 0.5);
0276 var myNewY = parseFloat(myOldY) + myOldHeight / 2 - (myOldHeight * (1 + myMainMap.zoomFact) * 0.5);
0277 var myNewWidth = myOldWidth * (1 + myMainMap.zoomFact);
0278 var myNewHeight = myOldHeight * (1 + myMainMap.zoomFact);
0279 break;
0280 case "down":
0281 var myNewX = parseFloat(myOldX);
0282 var myNewY = parseFloat(myOldY) +1.3* 6.*myMainMap.zoomFact;
0283 var myNewWidth = myOldWidth ;
0284 var myNewHeight = myOldHeight ;
0285 break;
0286 case "up":
0287 var myNewX = parseFloat(myOldX);
0288 var myNewY = parseFloat(myOldY) -1.3*6.* myMainMap.zoomFact;
0289 var myNewWidth = myOldWidth ;
0290 var myNewHeight = myOldHeight ;
0291 break;
0292 case "left":
0293 var myNewX = parseFloat(myOldX) - 3.*6.* myMainMap.zoomFact;
0294 var myNewY = parseFloat(myOldY);
0295 var myNewWidth = myOldWidth ;
0296 var myNewHeight = myOldHeight ;
0297 break;
0298 case "right":
0299 var myNewX = parseFloat(myOldX)+3.*6.* myMainMap.zoomFact;
0300 var myNewY = parseFloat(myOldY);
0301 var myNewWidth = myOldWidth ;
0302 var myNewHeight = myOldHeight ;
0303 break;
0304 case "PIXB":
0305 var myNewX = 0.;
0306 var myNewY = 540.;
0307 var myNewWidth = 62. ;
0308 var myNewHeight = 36. ;
0309 break;
0310 case "FPIX-z":
0311 var myNewX = 0.;
0312 var myNewY = 581.;
0313 var myNewWidth = 35.83 ;
0314 var myNewHeight = 21.01 ;
0315 break;
0316 case "FPIX+z":
0317 var myNewX = 0.;
0318 var myNewY = 516.;
0319 var myNewWidth = 35.83 ;
0320 var myNewHeight = 21.01 ;
0321 break;
0322 case "TID-z":
0323 var myNewX = 40.0;
0324 var myNewY = 585.;
0325 var myNewWidth = 34. ;
0326 var myNewHeight = 15. ;
0327 break;
0328 case "TID+z":
0329 var myNewX = 40.0;
0330 var myNewY = 520.;
0331 var myNewWidth = 34. ;
0332 var myNewHeight = 15. ;
0333 break;
0334 case "TOB":
0335 var myNewX = 97.;
0336 var myNewY = 542.;
0337 var myNewWidth = 72. ;
0338 var myNewHeight = 36. ;
0339 break;
0340 case "TIB":
0341 var myNewX = 46.8;
0342 var myNewY = 540.;
0343 var myNewWidth = 64.8 ;
0344 var myNewHeight = 38. ;
0345 break;
0346 case "TEC-z":
0347 var myNewX = 73.8;
0348 var myNewY = 568.;
0349 var myNewWidth = 115.2 ;
0350 var myNewHeight = 57.6 ;
0351 break;
0352 case "TEC+z":
0353 var myNewX = 73.8;
0354 var myNewY = 500.;
0355 var myNewWidth = 115.2 ;
0356 var myNewHeight = 57.6 ;
0357 break;
0358
0359 default:
0360 var myNewX = this.constrXmin;
0361 var myNewY = this.constrYmin;
0362 var myNewWidth = this.constrXmax - this.constrXmin;
0363 var myNewHeight = this.constrYmax - this.constrYmin;
0364 break;
0365 }
0366 if(inOrOut=="in" || inOrOut=="out" || inOrOut=="full"){
0367 if (myNewWidth > (this.constrXmax - this.constrXmin)) {
0368 myNewWidth = this.constrXmax - this.constrXmin;
0369 }
0370 if (myNewHeight > (this.constrYmax - this.constrYmin)) {
0371 myNewHeight = this.constrYmax - this.constrYmin;
0372 }
0373 if (myNewX < this.constrXmin) {
0374 myNewX = this.constrXmin;
0375 }
0376 if (myNewY < this.constrYmin) {
0377 myNewY = this.constrYmin;
0378 }
0379 if ((myNewX + myNewWidth) > this.constrXmax) {
0380 myNewX = this.constrXmax - myNewWidth;
0381 }
0382 if ((myNewY + myNewHeight) > this.constrYmax) {
0383 myNewY = this.constrYmax - myNewHeight;
0384 }
0385 }
0386 myDragElement.setAttributeNS(null,"x",myNewX);
0387 myDragElement.setAttributeNS(null,"y",myNewY);
0388 myDragElement.setAttributeNS(null,"width",myNewWidth);
0389 myDragElement.setAttributeNS(null,"height",myNewHeight);
0390 myMainMap.newViewBox(this.dragId,"referenceMap");
0391 }
0392
0393 //------------------------------------------------------------------------------------------
0394 //magnifier glass mouse-over effects
0395 function magnify(evt,scaleFact,inOrOut) {
0396 if (inOrOut == "in") {
0397 if (myMainMap.zoomVal < myMainMap.maxZoom) {
0398 scaleObject(evt,scaleFact);
0399 }
0400 else {
0401 }
0402 }
0403 if (inOrOut == "out") {
0404 if (myMainMap.zoomVal > myMainMap.minZoom) {
0405 scaleObject(evt,scaleFact);
0406 }
0407 else {
0408 }
0409 }
0410 if (inOrOut == "full") {
0411 if (myMainMap.zoomVal > myMainMap.minZoom) {
0412 scaleObject(evt,scaleFact);
0413 }
0414 else {
0415 }
0416 }
0417 if (scaleFact == 1) {
0418 scaleObject(evt,scaleFact);
0419 }
0420 }
0421
0422 //------------------------------------------------------------------------------------------
0423 //scale an object
0424 function scaleObject(evt,factor) {
0425 //reference to the currently selected object
0426 var element = evt.currentTarget;
0427 var myX = element.getAttributeNS(null,"x");
0428 var myY = element.getAttributeNS(null,"y");
0429 var newtransform = "scale(" + factor + ") translate(" + (myX * 1 / factor - myX) + " " + (myY * 1 / factor - myY) +")";
0430 element.setAttributeNS(null,'transform', newtransform);
0431 }
0432
0433 //------------------------------------------------------------------------------------------
0434 function zoomIt(inOrOut) {
0435 if (inOrOut == "in") {
0436 if (myMainMap.zoomVal < myMainMap.maxZoom) {
0437 myRefMapDragger.zoom("in");
0438 }
0439 else {
0440 }
0441 }
0442 if (inOrOut == "out") {
0443 if (myMainMap.zoomVal > myMainMap.minZoom) {
0444 myRefMapDragger.zoom("out");
0445 }
0446 else {
0447 }
0448 }
0449 if (inOrOut == "full") {
0450 if (myMainMap.zoomVal > myMainMap.minZoom) {
0451 myRefMapDragger.zoom("full");
0452 }
0453 else {
0454 }
0455 }
0456 if(inOrOut!="in" && inOrOut!="out" && inOrOut!="full") myRefMapDragger.zoom(inOrOut);
0457 }
0458
0459 //------------------------------------------------------------------------------------------
0460 function pausecomp(millis)
0461 {
0462 var inizio = new Date();
0463 var inizioint=inizio.getTime();
0464 var intervallo = 0;
0465 while(intervallo<millis){
0466 var fine = new Date();
0467 var fineint=fine.getTime();
0468 intervallo = fineint-inizioint;
0469 }
0470 return;
0471 }
0472
0473 ]]> </script>
0474 <!-- section for CSS stylesheet definitions -->
0475 <style type="text/css"><![CDATA[
0476 .normalText {font-size:20;fill:black;font-weight:bold;}
0477 .dragRect {fill:darkcyan;stroke:none;opacity:0.4;}
0478 ]]></style>
0479 </head>
0480
0481 <body bgcolor="#f7e699"
0482 onload="init()"
0483 onresize="myMapApp.resetFactors();">
0484
0485 <fieldset style="background:#fffd5ff;">
0486 <legend>Detector elements and controls</legend>
0487 <center>
0488 <button onclick="zoomIt('TIB');"> TIB </button>
0489 <button onclick="zoomIt('TOB');"> TOB </button>
0490 <button onclick="zoomIt('TID+z');"> TID+z </button>
0491 <button onclick="zoomIt('TID-z');"> TID-z </button>
0492 <button onclick="zoomIt('TEC+z');"> TEC+z </button>
0493 <button onclick="zoomIt('TEC-z');"> TEC-z </button>
0494 <button onclick="zoomIt('PIXB');"> PIXB </button>
0495 <button onclick="zoomIt('FPIX+z');">FPIX+z </button>
0496 <button onclick="zoomIt('FPIX-z');">FPIX-z </button>
0497 <hr size="2" />
0498 <button onclick="zoomIt('in');"> Zoom in </button>
0499 <button onclick="zoomIt('out');"> Zoom out </button>
0500 <button onclick="zoomIt('full');"> Home </button>
0501 <button onclick="zoomIt('up');"> Up </button>
0502 <button onclick="zoomIt('down');"> Down </button>
0503 <button onclick="zoomIt('left');"> Left </button>
0504 <button onclick="zoomIt('right');"> Right </button>
0505 </center>
0506 </fieldset>
0507
0508 <svg:svg width="100%"
0509 height="100%"
0510 viewBox="0 0 1024 768" >
0511 <svg:defs>
0512 <svg:symbol id="magnifyer"
0513 overflow="visible"
0514 style="fill:white;stroke:darkcyan;stroke-width:2;" >
0515 <svg:circle r="12" />
0516 </svg:symbol>
0517 <svg:symbol id="magnifyerZoomOut"
0518 overflow="visible"
0519 style="fill:white;stroke:darkcyan;stroke-width:2;" >
0520 <svg:use xlink:href="#magnifyer"/>
0521 <svg:line x1="-6"
0522 y1="0"
0523 x2="6"
0524 y2="0"
0525 style="stroke:darkcyan;stroke-width:2;"/>
0526 </svg:symbol>
0527 <svg:symbol id="magnifyerZoomIn"
0528 overflow="visible">
0529 <svg:use xlink:href="#magnifyer"/>
0530 <svg:line x1="-6"
0531 y1="0"
0532 x2="6"
0533 y2="0"
0534 style="stroke:darkcyan;stroke-width:2;"/>
0535 <svg:line x1="0"
0536 y1="-6"
0537 x2="0"
0538 y2="6"
0539 style="stroke:darkcyan;stroke-width:2;"/>
0540 </svg:symbol>
0541 <svg:symbol id="magnifyerFull"
0542 overflow="visible">
0543 <svg:use xlink:href="#magnifyer"/>
0544 <svg:line x1="-2"
0545 y1="0"
0546 x2="4"
0547 y2="0"
0548 style="stroke:darkcyan;stroke-width:2;"/>
0549 <svg:line x1="-2"
0550 y1="-6"
0551 x2="-4"
0552 y2="6"
0553 style="stroke:darkcyan;stroke-width:2;"/>
0554 <svg:line x1="-2"
0555 y1="-6"
0556 x2="5"
0557 y2="-6"
0558 style="stroke:darkcyan;stroke-width:2;"/>
0559 </svg:symbol>
0560 </svg:defs>
0561
0562
0563 <svg:svg id="referenceMap"
0564 x="0"
0565 y="510"
0566 viewBox="0 0 3000 1600"
0567 width="180"
0568 height="100"
0569 pointer-events="none">
0570 <svg:use xlink:href="#tracker" />
0571 </svg:svg>
0572
0573 <svg:rect id="dragRectForRefMap"
0574 class="dragRect"
0575 x="0"
0576 y="510"
0577 width="180"
0578 height="100"
0579 onmousedown="myRefMapDragger.drag(evt)"
0580 onmousemove="myRefMapDragger.drag(evt)"
0581 onmouseup="myRefMapDragger.drag(evt);myMainMap.newViewBox('dragRectForRefMap','referenceMap')"/>
0582
0583 <svg:g id="navigatorElements" class="normalText">
0584 <text x="220" y="530">Zoom</text>
0585 <svg:use id="zoomOut" x="230" y="560" xlink:href="#magnifyerZoomOut" onclick="zoomIt('out');" onmouseover="magnify(evt,1.2,'out');" onmouseout="magnify(evt,1,'out');" />
0586 <svg:use id="zoomIn" x="270" y="560" xlink:href="#magnifyerZoomIn" onclick="zoomIt('in');" onmouseover="magnify(evt,1.2,'in');" onmouseout="magnify(evt,1,'in');" />
0587 <svg:use id="zoomFull" x="310" y="560" xlink:href="#magnifyerFull" onclick="zoomIt('full');" onmouseover="magnify(evt,1.2,'full');" onmouseout="magnify(evt,1,'full');"/>
0588
0589 <svg:text id="TrackerMessage" x="10" y="635"> - </svg:text>
0590 <svg:text id="TrackerText" x="10" y="655"> - </svg:text>
0591 <svg:text id="TrackerText1" x="10" y="675"> - </svg:text>
0592 </svg:g>
0593
0594 <svg:image id="plot"
0595 xlink:href="plot.jpg"
0596 x="524"
0597 y="0"
0598 width="500"
0599 height="650" />
0600 <svg:svg id="mainMap"
0601 x="0"
0602 y="0"
0603 viewBox="0 0 3000 1600"
0604 width="500"
0605 height="300">
0606 <svg:rect fill="lightblue"
0607 stroke="none"
0608 x="0"
0609 y="0"
0610 width="3000"
0611 height="1600" />
0612 <svg:g id="tracker"
0613 transform="translate(10,1500) rotate(270)"
0614 style="fill:none;stroke:black;stroke-width:0;">
0615