Highcharts Stock Demo

author(s): Torstein Hønsi

by Fusher

HTML

<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
<script type="text/javascript" src="http://www.highcharts.com/samples/data/usdeur.js"></script>
<p>
    <input type="button" onclick="window['chart'].setSize(1000, 400);" value="step1 : 1000x400" />
    <input type="button" onclick="window['chart'].setSize(350, 400);" value="step2 - 350x400" />
    <input type="button" onclick="window['chart'].setSize(1000, 400);" value="step3 - 1000x400" />
</p>
<div id="ccc" style="width:100%;height:100%;">Loading...</div>

JavaScript

$(function () {
       var oChartSetup = {
           chart: {
               renderTo: 'ccc',
               type: 'column',
               alignTicks: false
           },
           credits: {
               enabled: false
           },
           colors: ['#4D92B4', '#B89D83', '#585148'],
           title: {
               "text": null,
               "style": {
                   "fontFamily": "Arial, Helvetica, Sans Serif",
                   "fontSize": "13",
                   "fontWeight": "bold",
                   "color": "#222222"
               }
           },

           xAxis: {
               "labels": {
                   "staggerLines": 0,
                   "style": {
                       "fontFamily": "Arial, Helvetica, Sans Serif",
                       "fontSize": "11",
                       "color": "#222222"
                   }
               },
               "title": {
                   "text": null,
                   "style": {}
               },
               "categories": ["3 Equities", "3.2 Foreign Equities", "3.1 Swiss Equities", "1 Money Market", "4 Real Estate", "2 Bonds", "2.1 Bonds CHF", "2.2 Foreign Bonds"]
           },
           yAxis: {
               "title": {
                   "text": null,
                   "style": {}
               },
               "minPadding": 0,
               "maxPadding": 0,
               "min": 0,
               "max": 100,
               "tickInterval": 10,
               "labels": {
                   "format": "{value:,.0f}",
                   "x": 0,
                   "style": {
                       "fontFamily": "Arial, Helvetica, Sans Serif",
                       "fontSize": "11",
                       "color": "#222222"
                   }
               }
           },
           tooltip: {
               valueDecimals: 2
           },

           // now the data
           series: [{
               name: 'Range',
               type: 'column',
               data:...