lazy-high-charts-wicked-pdf.html

<h2>Testing a High Chart</h2>
            <script type="text/javascript">
            (function() {
              var onload = window.onload;
              window.onload = function(){
                if (typeof onload == "function") onload();
                        var options = { "title": { "text": "Population vs GDP For 5 Big Countries [2009]" },"legend": { "align": "right","verticalAlign": "top","y": 75,"x": -50,"layout": "vertical" },"xAxis": { "categories": [ "United States","Japan","China","Germany","France" ] },"yAxis": [ { "title": { "text": "GDP in Billions","margin": 70 } },{ "title": { "text": "Population in Millions" },"opposite": true } ],"tooltip": { "enabled": true },"credits": { "enabled": false },"plotOptions": { "line": { "animation": false,"enableMouseTracking": false,"shadow": false } },"chart": { "defaultSeriesType": "column","renderTo": "chart-div" },"subtitle": {  },"series": [{ "name": "GDP in Billions","yAxis": 0,"data": [ 14119,5068,4985,3339,2656 ] },{ "name": "Population in Millions","yAxis": 1,"data": [ 310,127,1340,81,65 ] }] };
            
            window.chart_chart_div = new Highcharts.Chart(options);
    
              };
            })()
            </script>
    <div id="chart-div" data-highcharts-chart="0"><div class="highcharts-container" id="highcharts-0" style="position: relative; overflow: hidden; width: 1393px; height: 400px; text-align: left; line-height: normal; z-index: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><svg version="1.1" style="font-family:&quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, Arial, Helvetica, sans-serif;font-size:12px;" xmlns="http://www.w3.org/2000/svg" width="1393" height="400"><desc>Created with Highcharts 4.1.8</desc><defs><clippath id="highcharts-1"><rect x="0" y="0" width="954" height="317"></rect></clippath></defs><rect x="0" y="0" width="1393" height="400" strokeWidth="0" fill="#FFFFFF" class=" highcharts-background"></rect><g class="highcharts-grid" zIndex="1"></g><g class="highcharts-grid" zIndex="1"><path fill="none" d="M 129 364.5 L 1083 364.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 301.5 L 1083 301.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 237.5 L 1083 237.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 174.5 L 1083 174.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 110.5 L 1083 110.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 46.5 L 1083 46.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path></g><g class="highcharts-grid" zIndex="1"><path fill="none" d="M 129 364.5 L 1083 364.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 301.5 L 1083 301.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 237.5 L 1083 237.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 174.5 L 1083 174.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 110.5 L 1083 110.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path><path fill="none" d="M 129 46.5 L 1083 46.5" stroke="#D8D8D8" stroke-width="1" zIndex="1" opacity="1"></path></g><g class="highcharts-axis" zIndex="2"><path fill="none" d="M 319.5 364 L 319.5 374" stroke="#C0D0E0" stroke-width="1" opacity="1"></path><path fill="none" d="M 510.5 364 L 510.5 374" stroke="#C0D0E0" stroke-width="1" opacity="1"></path><path fill="none" d="M 700.5 364 L 700.5 374" stroke="#C0D0E0" stroke-width="1" opacity="1"></path><path fill="none" d="M 891.5 364 L 891.5 374" stroke="#C0D0E0" stroke-width="1" opacity="1"></path><path fill="none" d="M 1083.5 364 L 1083.5 374" stroke="#C0D0E0" stroke-width="1" opacity="1"></path><path fill="none" d="M 128.5 364 L 128.5 374" stroke="#C0D0E0" stroke-width="1" opacity="1"></path><path fill="none" d="M 129 364.5 L 1083 364.5" stroke="#C0D0E0" stroke-width="1" zIndex="7" visibility="visible"></path></g><g class="highcharts-axis" zIndex="2"><text x="23.671875" zIndex="7" text-anchor="middle" transform="translate(0,0) rotate(270 23.671875 205.5)" class=" highcharts-yaxis-title" style="color:#707070;fill:#707070;" visibility="visible" y="205.5"><tspan>GDP in Billions</tspan></text></g><g class="highcharts-axis" zIndex="2"><text x="1135.8125" zIndex="7" text-anchor="middle" transform="translate(0,0) rotate(90 1135.8125 205.5)" class=" highcharts-yaxis-title" style="color:#707070;fill:#707070;" visibility="visible" y="205.5"><tspan>Population in Millions</tspan></text></g><g class="highcharts-series-group" zIndex="3"><g class="highcharts-series highcharts-tracker" visibility="visible" zIndex="0.1" transform="translate(129,47) scale(1 1)" style="" clip-path="url(#highcharts-1)"><rect x="43.5" y="138.5" width="46" height="179" stroke="#FFFFFF" stroke-width="1" fill="#7cb5ec" rx="0" ry="0"></rect><rect x="234.5" y="253.5" width="46" height="64" stroke="#FFFFFF" stroke-width="1" fill="#7cb5ec" rx="0" ry="0"></rect><rect x="424.5" y="254.5" width="46" height="63" stroke="#FFFFFF" stroke-width="1" fill="#7cb5ec" rx="0" ry="0"></rect><rect x="615.5" y="275.5" width="46" height="42" stroke="#FFFFFF" stroke-width="1" fill="#7cb5ec" rx="0" ry="0"></rect><rect x="806.5" y="283.5" width="46" height="34" stroke="#FFFFFF" stroke-width="1" fill="#7cb5ec" rx="0" ry="0"></rect></g><g class="highcharts-markers" visibility="visible" zIndex="0.1" transform="translate(129,47) scale(1 1)" clip-path="none"></g><g class="highcharts-series highcharts-tracker" visibility="visible" zIndex="0.1" transform="translate(129,47) scale(1 1)" style="" clip-path="url(#highcharts-1)"><rect x="100.5" y="278.5" width="46" height="39" stroke="#FFFFFF" stroke-width="1" fill="#434348" rx="0" ry="0"></rect><rect x="291.5" y="301.5" width="46" height="16" stroke="#FFFFFF" stroke-width="1" fill="#434348" rx="0" ry="0"></rect><rect x="482.5" y="147.5" width="46" height="170" stroke="#FFFFFF" stroke-width="1" fill="#434348" rx="0" ry="0"></rect><rect x="673.5" y="307.5" width="46" height="10" stroke="#FFFFFF" stroke-width="1" fill="#434348" rx="0" ry="0"></rect><rect x="863.5" y="309.5" width="46" height="8" stroke="#FFFFFF" stroke-width="1" fill="#434348" rx="0" ry="0"></rect></g><g class="highcharts-markers" visibility="visible" zIndex="0.1" transform="translate(129,47) scale(1 1)" clip-path="none"></g></g><text x="697" text-anchor="middle" class="highcharts-title" zIndex="4" style="color:#333333;font-size:18px;fill:#333333;width:1329px;" y="24"><tspan>Population vs GDP For 5 Big Countries [2009]</tspan></text><g class="highcharts-legend" zIndex="7" transform="translate(1161,85)"><g zIndex="1"><g><g class="highcharts-legend-item" zIndex="1" transform="translate(8,3)"><text x="21" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" zIndex="2" y="15"><tspan>GDP in Billions</tspan></text><rect x="0" y="4" width="16" height="12" zIndex="3" fill="#7cb5ec"></rect></g><g class="highcharts-legend-item" zIndex="1" transform="translate(8,17)"><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" zIndex="2"><tspan>Population in Millions</tspan></text><rect x="0" y="4" width="16" height="12" zIndex="3" fill="#434348"></rect></g></g></g></g><g class="highcharts-axis-labels highcharts-xaxis-labels" zIndex="7"><text x="224.4" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:181px;text-overflow:clip;" text-anchor="middle" transform="translate(0,0)" y="383" opacity="1"><tspan>United States</tspan></text><text x="415.20000000000005" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:181px;text-overflow:clip;" text-anchor="middle" transform="translate(0,0)" y="383" opacity="1">Japan</text><text x="606" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:181px;text-overflow:clip;" text-anchor="middle" transform="translate(0,0)" y="383" opacity="1">China</text><text x="796.8000000000001" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:181px;text-overflow:clip;" text-anchor="middle" transform="translate(0,0)" y="383" opacity="1">Germany</text><text x="987.6" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:181px;text-overflow:clip;" text-anchor="middle" transform="translate(0,0)" y="383" opacity="1">France</text></g><g class="highcharts-axis-labels highcharts-yaxis-labels" zIndex="7"><text x="114" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="369" opacity="1">0k</text><text x="114" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="305" opacity="1">5k</text><text x="114" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="242" opacity="1">10k</text><text x="114" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="178" opacity="1">15k</text><text x="114" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="115" opacity="1">20k</text><text x="114" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="52" opacity="1">25k</text></g><g class="highcharts-axis-labels highcharts-yaxis-labels" zIndex="7"><text x="1098" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="start" transform="translate(0,0)" y="369" opacity="1">0</text><text x="1098" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="start" transform="translate(0,0)" y="305" opacity="1">500</text><text x="1098" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="start" transform="translate(0,0)" y="242" opacity="1">1000</text><text x="1098" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="start" transform="translate(0,0)" y="178" opacity="1">1500</text><text x="1098" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="start" transform="translate(0,0)" y="115" opacity="1">2000</text><text x="1098" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:450px;text-overflow:clip;" text-anchor="start" transform="translate(0,0)" y="52" opacity="1">2500</text></g><g class="highcharts-tooltip" zIndex="8" style="cursor:default;padding:0;white-space:nowrap;" transform="translate(0,-9999)"><path fill="none" d="M 3.5 0.5 L 13.5 0.5 C 16.5 0.5 16.5 0.5 16.5 3.5 L 16.5 13.5 C 16.5 16.5 16.5 16.5 13.5 16.5 L 3.5 16.5 C 0.5 16.5 0.5 16.5 0.5 13.5 L 0.5 3.5 C 0.5 0.5 0.5 0.5 3.5 0.5" isShadow="true" stroke="black" stroke-opacity="0.049999999999999996" stroke-width="5" transform="translate(1, 1)"></path><path fill="none" d="M 3.5 0.5 L 13.5 0.5 C 16.5 0.5 16.5 0.5 16.5 3.5 L 16.5 13.5 C 16.5 16.5 16.5 16.5 13.5 16.5 L 3.5 16.5 C 0.5 16.5 0.5 16.5 0.5 13.5 L 0.5 3.5 C 0.5 0.5 0.5 0.5 3.5 0.5" isShadow="true" stroke="black" stroke-opacity="0.09999999999999999" stroke-width="3" transform="translate(1, 1)"></path><path fill="none" d="M 3.5 0.5 L 13.5 0.5 C 16.5 0.5 16.5 0.5 16.5 3.5 L 16.5 13.5 C 16.5 16.5 16.5 16.5 13.5 16.5 L 3.5 16.5 C 0.5 16.5 0.5 16.5 0.5 13.5 L 0.5 3.5 C 0.5 0.5 0.5 0.5 3.5 0.5" isShadow="true" stroke="black" stroke-opacity="0.15" stroke-width="1" transform="translate(1, 1)"></path><path fill="rgba(249, 249, 249, .85)" d="M 3.5 0.5 L 13.5 0.5 C 16.5 0.5 16.5 0.5 16.5 3.5 L 16.5 13.5 C 16.5 16.5 16.5 16.5 13.5 16.5 L 3.5 16.5 C 0.5 16.5 0.5 16.5 0.5 13.5 L 0.5 3.5 C 0.5 0.5 0.5 0.5 3.5 0.5"></path><text x="8" zIndex="1" style="font-size:12px;color:#333333;fill:#333333;" y="20"></text></g></svg></div></div>
  

</body>