Chart.ChartToolbar

Defines chart toolbar.

Sample configuration:

var toolbarConfig = {
      visibility: 'auto',
      resetZoomTooltipText: 'Reset Zoom (100%)',
      zoomingTooltipText: 'Zoom in to selection area',
      panningTooltipText: 'Pan the chart',
     resetZoomButtonVisible: true,
     zoomingButtonVisible: true,
     panningButtonVisible: true
}

Example usage:

function addDays(date, value) {
        var newDate = new Date(date.getTime());
        newDate.setDate(date.getDate() + value);
        return newDate;
      }

      function round(d) {
          return Math.round(100 * d) / 100;
      }

      var data1 = [];
      var data2 = [];

      var yValue1 = 50;
      var yValue2 = 200;

      var date = new Date(2010, 0, 1);

      for (var i = 0; i < 200; i++) {

          yValue1 += Math.random() * 10 - 5;
          data1.push([date, round(yValue1)]);

          yValue2 += Math.random() * 10 - 5;
          data2.push([date, round(yValue2)]);

          date = addDays(date, 1);
      }

      $(document).ready(function () {
           $('#selector').jqChart({
              title: 'Chart Toolbar', 
              toolbar: {
                  visibility: 'auto', // auto, visible, hidden
                  resetZoomTooltipText: 'Reset Zoom (100%)',
                  zoomingTooltipText: 'Zoom in to selection area',
                  panningTooltipText: 'Pan the chart'
              },
              mouseInteractionMode: 'zooming', // zooming, panning
              axes: [
                  {
                      type: 'dateTime',
                      location: 'bottom',
                      zoomEnabled: true
                  },
                  {
                      type: 'linear',
                      location: 'left',
                      zoomEnabled: true
                  }
              ], 
              series: [
                  {
                      type: 'line',
                      data: data1,
                      markers: null
                  },
                  {
                      type: 'line',
                      data: data2,
                      markers: null
                  }
              ]
          }
      }