PowerPlotPercolation logo

Contour and scatter plot

This is scatter plot and two contour regions. It demonstrates how to add plots to a chart when the main chart factory methods are not sufficient on their own.

This page describes the class “ContourPlot” in the PowerPlot demo app.

Scatter plot with contours

This chart has a coordinate axis, a data set (the red triangles) and two contour regions. This chart is assembled in several steps: While the first two elements (the axis and the data points) are generated by a factory method, the other two elements have to be added separately. We also have to take care that the elements are arranged in the correct order.

    // Step 1: Create the chart with data points and coordinate axis.
    WSChart *contourChart = [WSChart linePlotWithFrame:[self.view bounds]
                                                  data:[DemoData scatteredPoints]
                                                 style:kChartLineScientific
                                             axisStyle:kCSPlain
                                           colorScheme:kColorLight
                                                labelX:NSLocalizedString(@"x", @"")
                                                labelY:NSLocalizedString(@"y", @"")];
    WSPlotData *dataPlot = (WSPlotData *)[[contourChart plotAtIndex:0] view];
    [dataPlot setStyle:kCustomStyleUnified];
    [dataPlot setLineStyle:kLineNone];
    [[dataPlot propDefault] setSymbolStyle:kSymbolTriangleLeft];
    [[dataPlot propDefault] setSymbolSize:5.0];

The first step generates the first two elements: the coordinate axis and the red triangle data set.

    // Step 2: Add a contour region.
    [contourChart generateControllerWithData:[DemoData centerRegion]
                                   plotClass:[WSPlotRegion class]
                                       frame:[self.view bounds]];
    [(WSPlotRegion *)[[contourChart lastPlot] view]
     setFillColor:UICOLORRGB(60, 60, 100)];
    
    // Step 3: Add another contour region.
    [contourChart generateControllerWithData:[DemoData centerRegionWide]
                                   plotClass:[WSPlotRegion class]
                                       frame:[self.view bounds]];
    [(WSPlotRegion *)[[contourChart lastPlot] view]
     setFillColor:UICOLORRGB(80, 80, 100)];

Steps two and three add the two contour regions with two different colors. Note the UICOLORRGB macro uses the WSColor category. Note that the narrow region is added first; if we do not reorder the plots, this would result in the wide region covering both the narrow region and most of the data which is not desirable. A reordering takes care of that:

    // Ensure proper ordering of plots.
    [contourChart exchangePlotAtIndex:0 withPlotAtIndex:3];

    // Finally, rescale all axis.
    [contourChart autoscaleAllAxisX];
    [contourChart autoscaleAllAxisY];

The reordering exchanges the plot at index 3 (the last one added, i.e., the wide region) with the first one, i.e., the red triangle data. This way, the wide region is at the back, the narrow region comes next at index 2 and the red triangle data set is the last one at index 3. Note that the coordinate axis is at index 1, in front of the wide region but behind the narrow region and the data.

The last set of commands scale all axis.