Axis slider widget

If you have a chart with a long range of X values, and want to easily focus on a particular range, you can use a WAxisSliderWidget. You can change the size of the focused region by dragging the blue handles, and change the position by dragging the selected area. When using touch, the size of this area can also be changed using a pinch movement.

Example
source 
  void AxisSliderWidget() {
    WContainerWidget container = new WContainerWidget();
    WStandardItemModel model = CsvUtil.csvToModel("" + "timeseries.csv");
    if (!(model != null)) {
      return container;
    }
    for (int row = 0; row < model.getRowCount(); ++row) {
      WString s = StringUtils.asString(model.getData(row, 0));
      WDate date = WDate.fromString(s.toString(), "dd/MM/yy");
      model.setData(row, 0, date);
    }
    WCartesianChart chart = new WCartesianChart((WContainerWidget) container);
    chart.setBackground(new WBrush(new WColor(220, 220, 220)));
    chart.setModel(model);
    chart.setXSeriesColumn(0);
    chart.setType(ChartType.Scatter);
    chart.getAxis(Axis.X).setScale(AxisScale.Date);
    double min = StringUtils.asNumber(model.getData(0, 0));
    double max = StringUtils.asNumber(model.getData(model.getRowCount() - 1, 0));
    chart.getAxis(Axis.X).setMinimumZoomRange((max - min) / 16.0);
    WDataSeries s = new WDataSeries(2, SeriesType.Line);
    WDataSeries s_ = s;
    s_.setShadow(new WShadow(3, 3, new WColor(0, 0, 0, 127), 3));
    chart.addSeries(s);
    chart.resize(new WLength(800), new WLength(400));
    chart.setPanEnabled(true);
    chart.setZoomEnabled(true);
    chart.setMargin(WLength.Auto, EnumSet.of(Side.Left, Side.Right));
    WAxisSliderWidget sliderWidget = new WAxisSliderWidget(s_, (WContainerWidget) container);
    sliderWidget.resize(new WLength(800), new WLength(80));
    sliderWidget.setSelectionAreaPadding(40, EnumSet.of(Side.Left, Side.Right));
    sliderWidget.setMargin(WLength.Auto, EnumSet.of(Side.Left, Side.Right));
  }

Using an alternative WDataSeries

If a series is assigned to a WAxisSliderWidget, but is hidden on the chart, then it will still be drawn on the WAxisSliderWidget. Combined with the zoomRangeChanged method of WAxis, this can be used to have a rough version of the data to present in the WAxisSliderWidget, and as the user zooms in, present a more detailed version of the data.

The example below shows a rough version of the data in the slider, and as you zoom in, a more fine version will be loaded on demand of the zoomed in area.

Example
source 
  class SinModel extends WAbstractChartModel {
    private static Logger logger = LoggerFactory.getLogger(SinModel.class);

    SinModel(double minimum, double maximum, int rows) {
      super();
      this.minimum_ = minimum;
      this.maximum_ = maximum;
      this.rows_ = rows;
    }

    double getData(int row, int column) {
      double x = this.minimum_ + row * (this.maximum_ - this.minimum_) / (this.getRowCount() - 1);
      if (column == 0) {
        return x;
      } else {
        return Math.sin(x) + Math.sin(x * 100.0) / 40.0;
      }
    }

    int getColumnCount() {
      return 2;
    }

    int getRowCount() {
      return this.rows_;
    }

    double getMinimum() {
      return this.minimum_;
    }

    double getMaximum() {
      return this.maximum_;
    }

    private double minimum_;
    private double maximum_;
    private int rows_;
  }

  void AxisSliderWidgetDifferentDataSeries() {
    WContainerWidget container = new WContainerWidget();
    WCartesianChart chart = new WCartesianChart((WContainerWidget) container);
    chart.setBackground(new WBrush(new WColor(220, 220, 220)));
    chart.setType(ChartType.Scatter);
    SinModel roughModel = new SinModel(-3.14159265358979323846, 3.14159265358979323846, 100);
    WDataSeries roughSeries = new WDataSeries(1, SeriesType.Line);
    WDataSeries roughSeries_ = roughSeries;
    roughSeries_.setModel(roughModel);
    roughSeries_.setXSeriesColumn(0);
    roughSeries.setHidden(true);
    chart.addSeries(roughSeries);
    SinModel detailedModel = new SinModel(-3.14159265358979323846, 3.14159265358979323846, 10000);
    WDataSeries seriesPtr = new WDataSeries(1, SeriesType.Line);
    WDataSeries series = seriesPtr;
    series.setModel(detailedModel);
    series.setXSeriesColumn(0);
    series.setShadow(new WShadow(3, 3, new WColor(0, 0, 0, 127), 3));
    chart.addSeries(seriesPtr);
    chart.getAxis(Axis.X).setMaximumZoomRange(3.14159265358979323846);
    chart.getAxis(Axis.X).setMinimumZoomRange(3.14159265358979323846 / 16.0);
    chart.getAxis(Axis.X).setMinimum(-3.5);
    chart.getAxis(Axis.X).setMaximum(3.5);
    chart.getAxis(Axis.Y).setMinimumZoomRange(0.1);
    chart.getAxis(Axis.Y).setMinimum(-1.5);
    chart.getAxis(Axis.Y).setMaximum(1.5);
    chart.resize(new WLength(800), new WLength(400));
    chart.setPanEnabled(true);
    chart.setZoomEnabled(true);
    chart.setOnDemandLoadingEnabled(true);
    chart.setMargin(WLength.Auto, EnumSet.of(Side.Left, Side.Right));
    WAxisSliderWidget sliderWidget =
        new WAxisSliderWidget(roughSeries_, (WContainerWidget) container);
    sliderWidget.resize(new WLength(800), new WLength(80));
    sliderWidget.setSelectionAreaPadding(40, EnumSet.of(Side.Left, Side.Right));
    sliderWidget.setMargin(WLength.Auto, EnumSet.of(Side.Left, Side.Right));
  }