Hi All,
I am trying to render the following HTML text to pdf and I am getting
com.pdfcrowd.PdfcrowdError: 400 - No API conversion tokens available- <div class="row header-row"> <div class="container header"> <h1 class="pull-left"><img src="../../Airometric/resources/images/airometric-wireless-logo.jpg" alt="Airometric Wireless" class="img-responsive"> </h1> <div class="pull-right headerBtns"> <button class="btn btn-xs btn-default" type="button">Welcome Annie</button> <button class="btn btn-xs btn-default" type="button">Logout</button> </div> </div> </div> <!-- filter section --> <div class="row"> <div class="container"> <div class="filter"><form id="j_idt11" name="j_idt11" method="post" action="/Airometric/Pages/voiceConnectivity.jsf" class="form-horizontal filter-form" enctype="application/x-www-form-urlencoded"><input type="hidden" name="j_idt11" value="j_idt11"><script type="text/javascript" src="/Airometric/javax.faces.resource/jsf.js.jsf?ln=javax.faces"></script><a href="#" style="width:70px;position:relative;left:100px;" onclick="jsf.util.chain(this,event,'getHtml()','mojarra.jsfcljs(document.getElementById(\'j_idt11\'),{\'j_idt11:j_idt12\':\'j_idt11:j_idt12\'},\'\')');return false"><img src="/Airometric/javax.faces.resource/page_right.gif.jsf?ln=images"> <font style="width:70px;position:relative;" color="green"><b>Generate</b></font></a><input id="j_idt11:testValue" type="text" name="j_idt11:testValue" value="" style="height: 30px;"> <div class="row"> <div class="col-md-2"> <select class="form-control"> <option>LG Nexus 4</option> <option>LG Nexus 4</option> <option>LG Nexus 4</option> <option>LG Nexus 4</option> <option>LG Nexus 4</option> </select> </div> <div class="col-md-2"> <select class="form-control"> <option>Seattle, WA</option> <option>Seattle, WA</option> <option>Seattle, WA</option> <option>Seattle, WA</option> <option>Seattle, WA</option> </select> </div> <div class="col-md-2"> <select class="form-control"> <option>3.17.2013 14:04 PST</option> <option>3.17.2013 14:04 PST</option> <option>3.17.2013 14:04 PST</option> <option>3.17.2013 14:04 PST</option> <option>3.17.2013 14:04 PST</option> </select> </div> </div> <input type="button" value="Get Canvas" onclick="getBody();"><input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="-2695402847834309400:266487138159219615" autocomplete="off"></form> </div> </div> </div> <!-- test section --> <div class="container"> <div class="row"> <div class="col-md-2 device"> <div class="device-details"> <h2>LG Nexus 4</h2> <strong><span>Version</span>: 1.003</strong> <strong><span>Test Date</span>: 03.17.2013 14:04PST</strong> </div> <div class="device-holder"><img src="../../Airometric/resources/images/lg-nexus-phone.jpg"></div> </div> <div class="col-md-10"> <ul id="myTab"> <li class="active"> <a href="#edge" class="first"> <div class="row"> <div class="col-sm-1 text-center"><img src="../../Airometric/resources/images/edge-icon.jpg"></div> <div class="col-sm-9"> <strong>Edge of Coverage</strong> <span>Details</span> </div> <div class="col-sm-2 text-center"><img src="../../Airometric/resources/images/pie-icon.jpg"></div> </div> </a> </li> <li> <a href="#connectivity"> <div class="row"> <div class="col-sm-1 text-center"><img src="../../Airometric/resources/images/edge-icon.jpg"></div> <div class="col-sm-9"> <strong>Connectivity</strong> <span>Details</span> </div> <div class="col-sm-2 text-center"><img src="../../Airometric/resources/images/pie-icon.jpg"></div> </div> </a> </li> <li> <a href="#call-rentention"> <div class="row"> <div class="col-sm-1 text-center"><img src="../../Airometric/resources/images/edge-icon.jpg"></div> <div class="col-sm-9"> <strong>Call Rentention</strong> <span>Details</span> </div> <div class="col-sm-2 text-center"><img src="../../Airometric/resources/images/pie-icon.jpg"></div> </div> </a> </li> <li> <a href="#voice-quality"> <div class="row"> <div class="col-sm-1 text-center"><img src="../../Airometric/resources/images/edge-icon.jpg"></div> <div class="col-sm-9"> <strong>Voice Quality</strong> <span>Details</span> </div> <div class="col-sm-2 text-center"><img src="../../Airometric/resources/images/pie-icon.jpg"></div> </div> </a> </li> <li> <a href="#browser-speed"> <div class="row"> <div class="col-sm-1 text-center"><img src="../../Airometric/resources/images/edge-icon.jpg"></div> <div class="col-sm-9"> <strong>Browser Speed</strong> <span>Details</span> </div> <div class="col-sm-2 text-center"><img src="../../Airometric/resources/images/pie-icon.jpg"></div> </div> </a> </li> <li> <a href="#data-throughput"> <div class="row"> <div class="col-sm-1 text-center"><img src="../../Airometric/resources/images/edge-icon.jpg"></div> <div class="col-sm-9"> <strong>Data Throughput</strong> <span>Details</span> </div> <div class="col-sm-2 text-center"><img src="../../Airometric/resources/images/pie-icon.jpg"></div> </div> </a> </li> </ul> <div class="tab-content"> <div class="tab-pane active" id="edge"> <div id="map-canvas" style="position: relative; background-color: rgb(229, 227, 223); overflow: hidden; -webkit-transform: translateZ(0);"><div style="position: absolute; left: 0px; top: 0px; overflow: hidden; width: 100%; height: 100%; z-index: 0;"><div style="position: absolute; left: 0px; top: 0px; overflow: hidden; width: 100%; height: 100%; z-index: 0;"><div style="position: absolute; left: 0px; top: 0px; z-index: 1; cursor: url(http://maps.gstatic.com/mapfiles/openhand_8_8.cur) 8 8, default; -webkit-transform-origin: 0px 0px; -webkit-transform: matrix(1, 0, 0, 1, 0, 0);"><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 200;"><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 101;"></div></div><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 201;"><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 102;"><div style="position: absolute; left: 0px; top: 0px; z-index: 0;"><div style="position: absolute; left: 0px; top: 0px; z-index: 1;"><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: 170px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: 170px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: -86px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: -86px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: 426px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: 426px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: 170px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: 170px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: 426px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: -86px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: -86px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: 426px;"></div></div></div></div><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 103;"><div style="position: absolute; left: 0px; top: 0px; z-index: -1;"><div style="position: absolute; left: 0px; top: 0px; z-index: 1;"><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: 170px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: 170px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: -86px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: -86px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: 426px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: 426px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: 170px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: 170px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: 426px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: -86px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: -86px;"></div><div style="width: 256px; height: 256px; overflow: hidden; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: 426px;"></div></div></div></div></div><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 202;"><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 104;"></div><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 105;"></div><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 106;"></div></div><div style="-webkit-transform: translateZ(0); position: absolute; left: 0px; top: 0px; z-index: 100;"><div style="position: absolute; left: 0px; top: 0px; z-index: 0;"><div style="position: absolute; left: 0px; top: 0px; z-index: 1;"><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: 170px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: 170px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: -86px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: -86px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: 426px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: 426px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: 170px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: 170px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: 426px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: -86px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: -86px;"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: 426px;"></div></div></div></div><div style="position: absolute; z-index: 0; left: 0px; top: 0px;"><div style="overflow: hidden; width: 451px; height: 380px;"></div></div><div style="position: absolute; left: 0px; top: 0px; z-index: 0;"><div style="position: absolute; left: 0px; top: 0px; z-index: 1;"><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: 426px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt1.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=235&y=155&z=8&s=Gali&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: 170px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt1.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=235&y=154&z=8&s=Gal&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: 426px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt0.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=234&y=155&z=8&s=G&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: -86px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt0.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=234&y=153&z=8&s=Galileo&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -62px; top: 170px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt0.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=234&y=154&z=8&s=&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: 170px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt0.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=236&y=154&z=8&s=Galile&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: -86px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt0.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=236&y=153&z=8&s=Galil&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 194px; top: -86px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt1.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=235&y=153&z=8&s=Ga&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: -86px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt1.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=233&y=153&z=8&s=Gali&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: 450px; top: 426px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt0.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=236&y=155&z=8&s=Galileo&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: 426px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt1.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=233&y=155&z=8&s=Galile&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div><div style="width: 256px; height: 256px; -webkit-transform: translateZ(0); position: absolute; left: -318px; top: 170px; opacity: 1; transition: opacity 200ms ease-out; -webkit-transition: opacity 200ms ease-out;"><img src="http://mt1.googleapis.com/vt?lyrs=m@216000000&src=apiv3&hl=en-US&x=233&y=154&z=8&s=Galil&style=37%7Csmartmaps,59" draggable="false" style="width: 256px; height: 256px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; -webkit-transform: translateZ(0);"></div></div></div></div></div><div style="margin: 2px 5px 2px 2px; z-index: 1000000; position: absolute; left: 0px; bottom: 0px;"><a target="_blank" href="http://maps.google.com/maps?ll=-34.397,150.644&z=8&t=m&hl=en-US" title="Click to see this area on Google Maps" style="position: static; overflow: visible; float: none; display: inline;"><div style="width: 62px; height: 24px; cursor: pointer;"><img src="http://maps.gstatic.com/mapfiles/google_white.png" draggable="false" style="position: absolute; left: 0px; top: 0px; width: 62px; height: 24px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px;"></div></a></div><div class="gmnoprint" style="z-index: 1000001; position: absolute; right: 0px; bottom: 0px;"><div style="height: 19px; -webkit-user-select: none; line-height: 19px; padding-right: 2px; padding-left: 50px; background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.498039) 50px); font-family: Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; background-position: initial initial; background-repeat: initial initial;"><a style="color: rgb(68, 68, 68); text-decoration: underline; cursor: pointer; display: none;">Map Data</a><span style="display: none;"></span><span style="display: none;"> - </span><a href="http://www.google.com/intl/en-US_US/help/terms_maps.html" target="_blank" style="color: rgb(68, 68, 68); text-decoration: underline; cursor: pointer;">Terms of Use</a></div></div><div style="background-color: white; padding: 15px 21px; border: 1px solid rgb(171, 171, 171); font-family: Arial, sans-serif; color: rgb(34, 34, 34); -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 16px; box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 16px; z-index: 10000002; display: none; width: 256px; height: 148px; position: absolute; left: 76px; top: 100px;"><div style="padding: 0px 0px 10px; font-size: 16px;">Map Data</div><div style="font-size: 13px;"></div><div style="width: 10px; height: 10px; overflow: hidden; position: absolute; opacity: 0.7; right: 12px; top: 12px; z-index: 10000; cursor: pointer;"><img src="http://maps.gstatic.com/mapfiles/mv/imgs8.png" draggable="false" style="position: absolute; left: -18px; top: -44px; width: 68px; height: 67px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px;"></div></div><div class="gmnoscreen" style="position: absolute; right: 0px; bottom: 0px;"><div style="font-family: Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); direction: ltr; text-align: right; background-color: rgb(245, 245, 245);"></div></div><div class="gmnoprint" style="font-size: 10px; height: 17px; background-color: rgb(245, 245, 245); border: 1px solid rgb(220, 220, 220); line-height: 19px; display: none; position: absolute; right: 0px; bottom: 0px;"><a target="_new" title="Report errors in the road map or imagery to Google" href="http://maps.google.com/maps?ll=-34.397,150.644&z=8&t=m&hl=en-US&skstate=action:mps_dialog$apiref:1" style="font-family: Arial, sans-serif; font-size: 85%; font-weight: bold; padding: 1px 3px; color: rgb(68, 68, 68); text-decoration: none; position: relative; bottom: 1px;">Report a map error</a></div><div class="gmnoprint" controlwidth="78" controlheight="356" style="margin: 5px; -webkit-user-select: none; position: absolute; left: 0px; top: 0px;"><div class="gmnoprint" controlwidth="78" controlheight="80" style="cursor: url(http://maps.gstatic.com/mapfiles/openhand_8_8.cur) 8 8, default; width: 78px; height: 78px; position: absolute; left: 0px; top: 0px;"><div class="gmnoprint" controlwidth="78" controlheight="80" style="width: 78px; height: 78px; position: absolute; left: 0px; top: 0px;"><div style="visibility: hidden;"><svg version="1.1" overflow="hidden" width="78px" height="78px" viewBox="0 0 78 78" style="position: absolute; left: 0px; top: 0px;"><circle cx="39" cy="39" r="35" stroke-width="3" fill-opacity="0.2" fill="#f2f4f6" stroke="#f2f4f6"></circle><g transform="rotate(0 39 39)"><rect x="33" y="0" rx="4" ry="4" width="12" height="11" stroke="#a6a6a6" stroke-width="1" fill="#f2f4f6"></rect><polyline points="36.5,8.5 36.5,2.5 41.5,8.5 41.5,2.5" stroke-linejoin="bevel" stroke-width="1.5" fill="#f2f4f6" stroke="#000"></polyline></g></svg></div></div><div class="gmnoprint" controlwidth="59" controlheight="59" style="position: absolute; left: 10px; top: 11px;"><div style="width: 59px; height: 59px; overflow: hidden; position: relative;"><img src="http://maps.gstatic.com/mapfiles/mapcontrols3d7.png" draggable="false" style="position: absolute; left: 0px; top: 0px; width: 59px; height: 492px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px;"><div title="Pan left" style="position: absolute; left: 0px; top: 20px; width: 19.666666666666668px; height: 19.666666666666668px; cursor: pointer;"></div><div title="Pan right" style="position: absolute; left: 39px; top: 20px; width: 19.666666666666668px; height: 19.666666666666668px; cursor: pointer;"></div><div title="Pan up" style="position: absolute; left: 20px; top: 0px; width: 19.666666666666668px; height: 19.666666666666668px; cursor: pointer;"></div><div title="Pan down" style="position: absolute; left: 20px; top: 39px; width: 19.666666666666668px; height: 19.666666666666668px; cursor: pointer;"></div></div></div></div><div controlwidth="32" controlheight="40" style="cursor: url(http://maps.gstatic.com/mapfiles/openhand_8_8.cur) 8 8, default; position: absolute; left: 23px; top: 85px;"><div style="width: 32px; height: 40px; overflow: hidden; position: absolute; left: 0px; top: 0px;"><img src="http://maps.gstatic.com/mapfiles/cb/mod_cb_scout/cb_scout_sprite_api_003.png" draggable="false" style="position: absolute; left: -9px; top: -102px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; width: 1029px; height: 255px;"></div><div style="width: 32px; height: 40px; overflow: hidden; position: absolute; left: 0px; top: 0px; visibility: hidden;"><img src="http://maps.gstatic.com/mapfiles/cb/mod_cb_scout/cb_scout_sprite_api_003.png" draggable="false" style="position: absolute; left: -107px; top: -102px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; width: 1029px; height: 255px;"></div><div style="width: 32px; height: 40px; overflow: hidden; position: absolute; left: 0px; top: 0px; visibility: hidden;"><img src="http://maps.gstatic.com/mapfiles/cb/mod_cb_scout/cb_scout_sprite_api_003.png" draggable="false" style="position: absolute; left: -58px; top: -102px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; width: 1029px; height: 255px;"></div><div style="width: 32px; height: 40px; overflow: hidden; position: absolute; left: 0px; top: 0px; visibility: hidden;"><img src="http://maps.gstatic.com/mapfiles/cb/mod_cb_scout/cb_scout_sprite_api_003.png" draggable="false" style="position: absolute; left: -205px; top: -102px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; width: 1029px; height: 255px;"></div></div><div class="gmnoprint" controlwidth="0" controlheight="0" style="opacity: 0.6; display: none; position: absolute;"><img src="http://maps.gstatic.com/mapfiles/rotate2.png" draggable="false" title="Rotate map 90 degrees" style="-webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; cursor: pointer; width: 22px; height: 22px;"></div><div class="gmnoprint" controlwidth="25" controlheight="226" style="position: absolute; left: 27px; top: 130px;"><div title="Zoom in" style="width: 23px; height: 24px; overflow: hidden; position: relative; cursor: pointer; z-index: 1;"><img src="http://maps.gstatic.com/mapfiles/mapcontrols3d7.png" draggable="false" style="position: absolute; left: -17px; top: -400px; width: 59px; height: 492px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px;"></div><div title="Click to zoom" style="width: 25px; height: 178px; overflow: hidden; position: relative; cursor: pointer; top: -4px;"><img src="http://maps.gstatic.com/mapfiles/mapcontrols3d7.png" draggable="false" style="position: absolute; left: -17px; top: -87px; width: 59px; height: 492px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px;"></div><div title="Drag to zoom" style="width: 21px; height: 14px; overflow: hidden; position: absolute; -webkit-transition: top 0.25s ease; transition: top 0.25s ease; z-index: 2; cursor: url(http://maps.gstatic.com/mapfiles/openhand_8_8.cur) 8 8, default; left: 2px; top: 124px;"><img src="http://maps.gstatic.com/mapfiles/mapcontrols3d7.png" draggable="false" style="position: absolute; left: 0px; top: -384px; width: 59px; height: 492px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px;"></div><div title="Zoom out" style="width: 23px; height: 23px; overflow: hidden; position: relative; cursor: pointer; top: -4px; z-index: 3;"><img src="http://maps.gstatic.com/mapfiles/mapcontrols3d7.png" draggable="false" style="position: absolute; left: -17px; top: -361px; width: 59px; height: 492px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px;"></div></div></div><div class="gmnoprint" style="margin: 5px; z-index: 0; position: absolute; cursor: pointer; right: 0px; top: 0px;"><div style="float: left;"><div title="Show street map" style="direction: ltr; overflow: hidden; text-align: center; position: relative; color: rgb(0, 0, 0); font-family: Arial, sans-serif; -webkit-user-select: none; font-size: 13px; background-color: rgb(255, 255, 255); padding: 1px 6px; border: 1px solid rgb(113, 123, 135); -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; font-weight: bold; min-width: 29px; background-position: initial initial; background-repeat: initial initial;">Map</div><div style="background-color: white; z-index: -1; padding-top: 2px; border-width: 0px 1px 1px; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-right-color: rgb(113, 123, 135); border-bottom-color: rgb(113, 123, 135); border-left-color: rgb(113, 123, 135); -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; position: absolute; left: 0px; top: 22px; text-align: left; display: none;"><div title="Show street map with terrain" style="color: rgb(0, 0, 0); font-family: Arial, sans-serif; -webkit-user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 1px 8px 3px 5px; direction: ltr; text-align: left; white-space: nowrap;"><span role="checkbox" style="box-sizing: border-box; position: relative; line-height: 0; font-size: 0px; margin: 0px 5px 0px 0px; display: inline-block; background-color: rgb(255, 255, 255); border: 1px solid rgb(198, 198, 198); border-top-left-radius: 1px; border-top-right-radius: 1px; border-bottom-right-radius: 1px; border-bottom-left-radius: 1px; width: 13px; height: 13px; -webkit-box-shadow: none; box-shadow: none; vertical-align: middle;"><div style="position: absolute; left: 1px; top: -2px; width: 13px; height: 11px; overflow: hidden; display: none;"><img src="http://maps.gstatic.com/mapfiles/mv/imgs8.png" draggable="false" style="position: absolute; left: -52px; top: -44px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; width: 68px; height: 67px;"></div></span><label style="vertical-align: middle; cursor: pointer;">Terrain</label></div></div></div><div style="float: left;"><div title="Show satellite imagery" style="direction: ltr; overflow: hidden; text-align: center; position: relative; color: rgb(51, 51, 51); font-family: Arial, sans-serif; -webkit-user-select: none; font-size: 13px; background-color: rgb(255, 255, 255); padding: 1px 6px; border-width: 1px 1px 1px 0px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-top-color: rgb(113, 123, 135); border-right-color: rgb(113, 123, 135); border-bottom-color: rgb(113, 123, 135); -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; font-weight: normal; min-width: 54px; background-position: initial initial; background-repeat: initial initial;">Satellite</div><div style="background-color: white; z-index: -1; padding-top: 2px; border-width: 0px 1px 1px; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-right-color: rgb(113, 123, 135); border-bottom-color: rgb(113, 123, 135); border-left-color: rgb(113, 123, 135); -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px; position: absolute; right: 0px; top: 22px; text-align: left; display: none;"><div title="Zoom in to show 45 degree view" style="color: rgb(184, 184, 184); font-family: Arial, sans-serif; -webkit-user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 1px 8px 3px 5px; direction: ltr; text-align: left; white-space: nowrap; display: none;"><span role="checkbox" style="box-sizing: border-box; position: relative; line-height: 0; font-size: 0px; margin: 0px 5px 0px 0px; display: inline-block; background-color: rgb(255, 255, 255); border: 1px solid rgb(241, 241, 241); border-top-left-radius: 1px; border-top-right-radius: 1px; border-bottom-right-radius: 1px; border-bottom-left-radius: 1px; width: 13px; height: 13px; -webkit-box-shadow: none; box-shadow: none; vertical-align: middle;"><div style="position: absolute; left: 1px; top: -2px; width: 13px; height: 11px; overflow: hidden; display: none;"><img src="http://maps.gstatic.com/mapfiles/mv/imgs8.png" draggable="false" style="position: absolute; left: -52px; top: -44px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; width: 68px; height: 67px;"></div></span><label style="vertical-align: middle; cursor: pointer;">45°</label></div><div title="Show imagery with street names" style="color: rgb(0, 0, 0); font-family: Arial, sans-serif; -webkit-user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 1px 8px 3px 5px; direction: ltr; text-align: left; white-space: nowrap;"><span role="checkbox" style="box-sizing: border-box; position: relative; line-height: 0; font-size: 0px; margin: 0px 5px 0px 0px; display: inline-block; background-color: rgb(255, 255, 255); border: 1px solid rgb(198, 198, 198); border-top-left-radius: 1px; border-top-right-radius: 1px; border-bottom-right-radius: 1px; border-bottom-left-radius: 1px; width: 13px; height: 13px; -webkit-box-shadow: none; box-shadow: none; vertical-align: middle;"><div style="position: absolute; left: 1px; top: -2px; width: 13px; height: 11px; overflow: hidden;"><img src="http://maps.gstatic.com/mapfiles/mv/imgs8.png" draggable="false" style="position: absolute; left: -52px; top: -44px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; width: 68px; height: 67px;"></div></span><label style="vertical-align: middle; cursor: pointer;">Labels</label></div></div></div></div></div></div> </div> <div class="tab-pane" id="connectivity"> <div id="map-canvas1"></div> </div> <div class="tab-pane" id="call-rentention"> <div id="map-canvas2"></div> </div> <div class="tab-pane" id="voice-quality"> <div id="map-canvas3"></div> </div> <div class="tab-pane" id="browser-speed"> <div id="map-canvas3"></div> </div> <div class="tab-pane" id="data-throughput"> <div id="map-canvas3"></div> </div> </div> </div> </div> <div class="row"> <div class="container test-details-box"> <h2>Test Details</h2> <div class="panel-group" id="accordion"> <div class="panel test"> <div class="test-heading"> <h3><i></i> Edge of Coverage <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> Expand + </a> </h3> <div class="analysis-box"> <strong>Analysis: <a href="#">see details</a></strong> <ul> <li>The device under test ( Galaxy) was able to utilize the available network earlier than reference device</li> <li>The reference device was not able to find a stable channel to sustain a call.</li> </ul> </div> <div class="pieHolder"><img src="../../Airometric/resources/images/pie-icon-big.jpg"></div> </div> <div id="collapseOne" class="panel-collapse collapse"> <div class="row"> <div class="detailsMap"><img src="../../Airometric/resources/images/map.jpg"></div> <div class="vq-compare-networks"><img src="../../Airometric/resources/images/map.jpg"></div> </div> <div class="row"> <div class="uplink-vq"><img src="../../Airometric/resources/images/map.jpg"></div> <div class="downlink-vq"><img src="../../Airometric/resources/images/map.jpg"></div> </div> </div> <div class="down-arrow"> <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> </a> </div> </div> <div class="panel test"> <div class="test-heading"> <h3>Connectivity <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"> Expand + </a> </h3> </div> <div id="collapseTwo" class="panel-collapse collapse"> <div class="row"> <div class="container"> <div class="col-lg-6"><img src="../../Airometric/resources/images/map.jpg"></div> <div class="col-lg-6"><img src="../../Airometric/resources/images/map.jpg"></div> </div> </div> </div> <div class="down-arrow"> <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"> </a> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseThree"> Collapsible Group Item #3 </a> </h4> </div> </div></div> </div> </div> </div> <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --><script type="text/javascript" src="/Airometric/javax.faces.resource/jquery.js.jsf?ln=js"></script><script type="text/javascript" src="/Airometric/javax.faces.resource/bootstrap.min.js.jsf?ln=js"></script><script type="text/javascript" src="/Airometric/javax.faces.resource/map.js.jsf?ln=js"></script><script src="http://maps.gstatic.com/intl/en_us/mapfiles/api-3/12/11/main.js" type="text/javascript"></script> <script> $(function () { $('#myTab a').click(function (e) { e.preventDefault(); $(this).tab('show'); }) }) </script> <script> var map; function initialize() { var mapOptions = { zoom: 8, center: new google.maps.LatLng(-34.397, 150.644), mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); } google.maps.event.addDomListener(window, 'load', initialize); </script>
Any suggestion would be really helpful