Highcharts Demo

author(s): Torstein Hønsi

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

JavaScript

var cat1Open  = '<img class="DeviceExpanded" src="minus16.gif" server="' + 0 + '"/>Parent.1';
var cat1Collapsed  = '<img class="DeviceCollapsed" src="plus16.gif" server="' + 0 + '"/>Parent.1';
var cat11 = 'Child.1.1';
var cat12 = 'Child.1.2';
var catOpen = [ cat1Open, cat11, cat12 ];
var catCollapsed = [ cat1Collapsed ];
var seriesOpen = [5, 3, 2];
var seriesCollapsed = [5];
$(function () {
    var chart;
    $(document).ready(function() {
      var chart = new Highcharts.Chart({
         chart: {
            renderTo: 'container',
            type: 'bar'
         },
         title: {
            text: 'Test visiblity of bar'
         },
         xAxis: {
            categories: catCollapsed,
               labels: {
                  useHTML: true
               },
         },
         yAxis: {
            labels: {
               enabled: false
            },
            title: {
               text: null
            },
         },
         plotOptions: {
            bar: {
               dataLabels: {
                  enabled: true
               },
               //visible: false
            }
         },

         series: [{
            data: seriesCollapsed,
         }, 
         ]
      });
    
      //Set up expand/collapse of share list
      function showChildren() 
      {
         var $img = $(this);
         var series = chart.series[0];
         var xAxis = chart.xAxis[0];
         //Expand children
         $img.attr('src','minus16.gif');
         xAxis.setCategories( catOpen, false );
         series.setData( seriesOpen );
         chart.redraw();

         $('img.DeviceExpanded').click( hideChildren );
      }
      function hideChildren() 
      {
         var $img = $(this);
         var series = chart.series[0];
         var xAxis = chart.xAxis[0];
         //collapse children
         $img.attr('src','plus16.gif');
         xAxis.setCategories( catCollapsed, false );
         series.setData( seriesCollapsed );
         chart.redraw();

    ...