scatter plot with different point colours and sizes

2.6k views Asked by At

I have found SWTChart library and just wonder how it would be possible to get a scatter plot where points have different colours and sizes like in this example.

example
(source: matplotlib.org)

package org.swtchart.examples;

import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.FillLayout;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Shell;
import org.swtchart.Chart;
import org.swtchart.ILineSeries;
import org.swtchart.LineStyle;
import org.swtchart.ISeries.SeriesType;

/**
* An example for scatter chart.
*/
public class ScatterChartExample {

private static final double[] xSeries = { 0.0, 2.6, 6.5, 4.4, 5.6, 4.3,
    3.4, 10.8, 2.1, 8.9 };
private static final double[] ySeries = { 1.3, 0.0, 3.9, 2.6, 1.1, 0.6,
    3.1, 3.5, 5.6, 4.4 };

/**
* The main method.
* 
* @param args
*            the arguments
*/
public static void main(String[] args) {
    Display display = new Display();
    Shell shell = new Shell(display);
    shell.setText("Scatter Chart");
    shell.setSize(500, 400);
    shell.setLayout(new FillLayout());

    createChart(shell);

    shell.open();
    while (!shell.isDisposed()) {
    if (!display.readAndDispatch()) {
        display.sleep();
    }
    }
    display.dispose();
}

/**
* create the chart.
* 
* @param parent
*            The parent composite
* @return The created chart
*/
static public Chart createChart(Composite parent) {

    // create a chart
    Chart chart = new Chart(parent, SWT.NONE);

    // set titles
    chart.getTitle().setText("Scatter Chart");
    chart.getAxisSet().getXAxis(0).getTitle().setText("Score A");
    chart.getAxisSet().getYAxis(0).getTitle().setText("Score B");

    // create scatter series
    ILineSeries scatterSeries = (ILineSeries) chart.getSeriesSet()
        .createSeries(SeriesType.LINE, "scatter series");
    scatterSeries.setLineStyle(LineStyle.NONE);
    scatterSeries.setXSeries(xSeries);
    scatterSeries.setYSeries(ySeries);

    // adjust the axis range
    chart.getAxisSet().adjustRange();

    return chart;
}
}

How is it possible to get a scatter plot where points have different colours and sizes?

Thank you in advance.


I thought I just try first to inherit from LineSeries with this simple code

package org.swtchart.examples;
import org.swtchart.Chart;
import org.swtchart.internal.series.LineSeries;

public class ILineSeriesTest extends LineSeries{

  protected ILineSeriesTest(Chart chart, String id) {
      super(chart, id);
  }
}

In the example code I changed it to:

ILineSeriesTest scatterSeries = (ILineSeriesTest) chart.getSeriesSet()
            .createSeries(SeriesType.LINE, "scatter series");

However, I got the following error:

Exception in thread "main" java.lang.ClassCastException: org.swtchart.internal.series.LineSeries cannot be cast to org.swtchart.examples.ILineSeriesTest
  at org.swtchart.examples.ScatterChartExampleTest.createChart(ScatterChartExampleTest.java:67)
  at org.swtchart.examples.ScatterChartExampleTest.main(ScatterChartExampleTest.java:38)

Why it did not work out?

Thank you in advance.

2

There are 2 answers

3
Baz On BEST ANSWER

You can achieve individual colors by using setSymbolColors(Color[] colors):

scatterSeries.setSymbolColors(new Color[] { ColorConstants.red,
            ColorConstants.red, ColorConstants.red, ColorConstants.red,
            ColorConstants.green, ColorConstants.green,
            ColorConstants.green, ColorConstants.blue, ColorConstants.blue,
            ColorConstants.blue });

Note that this example uses ColorConstants of Draw2D.

As for the sizes: You will have to implement your own ISeries which can take care of the sizes.

enter image description here

0
user977828 On

Yoshitaka the developer of SWTchart provided the following solution:

package org.swtchart.examples;

import org.eclipse.draw2d.ColorConstants;
import org.eclipse.swt.SWT;
import org.eclipse.swt.events.PaintEvent;
import org.eclipse.swt.graphics.Color;
import org.eclipse.swt.layout.FillLayout;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Shell;
import org.swtchart.Chart;
import org.swtchart.IAxis;
import org.swtchart.ICustomPaintListener;
import org.swtchart.ILineSeries;
import org.swtchart.ILineSeries.PlotSymbolType;
import org.swtchart.IPlotArea;
import org.swtchart.LineStyle;
import org.swtchart.ISeries.SeriesType;

/**
* An example for scatter chart.
*/
public class ScatterChartExampleTest {

    private static final double[] xSeries = { 0.0, 2.6, 6.5, 4.4, 5.6, 4.3,
            3.4, 10.8, 2.1, 8.9 };
    private static final double[] ySeries = { 1.3, 0.0, 3.9, 2.6, 1.1, 0.6,
            3.1, 3.5, 5.6, 4.4 };

    /**
    * The main method.
    * 
    * @param args
    *            the arguments
    */
    public static void main(String[] args) {
        Display display = new Display();
        Shell shell = new Shell(display);
        shell.setText("Scatter Chart");
        shell.setSize(500, 400);
        shell.setLayout(new FillLayout());

        createChart(shell);

        shell.open();
        while (!shell.isDisposed()) {
            if (!display.readAndDispatch()) {
                display.sleep();
            }
        }
        display.dispose();
    }

    /**
    * create the chart.
    * 
    * @param parent
    *            The parent composite
    * @return The created chart
    */
    static public Chart createChart(Composite parent) {

        // create a chart
        final Chart chart = new Chart(parent, SWT.NONE);

        // set titles
        chart.getTitle().setText("Scatter Chart");
        chart.getAxisSet().getXAxis(0).getTitle().setText("Score A");
        chart.getAxisSet().getYAxis(0).getTitle().setText("Score B");

        // create scatter series
        ILineSeries scatterSeries = (ILineSeries) chart.getSeriesSet()
                .createSeries(SeriesType.LINE, "scatter series");
        scatterSeries.setLineStyle(LineStyle.NONE);
        scatterSeries.setXSeries(xSeries);
        scatterSeries.setYSeries(ySeries);

        // hide default plot symbols
        scatterSeries.setSymbolType(PlotSymbolType.NONE);

        // assuming that double[] xSeries, double[] ySeries, int[] sizes,
        // Color[] colors are available
        final Color colors[] = new Color[] { ColorConstants.red, ColorConstants.red,
                ColorConstants.red, ColorConstants.red, ColorConstants.green,
                ColorConstants.green, ColorConstants.green,
                ColorConstants.blue, ColorConstants.blue, ColorConstants.blue };
        final int sizes[] = new int[] { 10, 11, 12, 14, 15, 16, 17, 18, 19, 20};


        IPlotArea plotArea = (IPlotArea) chart.getPlotArea();

        plotArea.addCustomPaintListener(new ICustomPaintListener() {

            public void paintControl(PaintEvent e) {
                IAxis xAxis = chart.getAxisSet().getXAxis(0);
                IAxis yAxis = chart.getAxisSet().getYAxis(0);

                for (int i = 0; i < xSeries.length; i++) {
                    int x = xAxis.getPixelCoordinate(xSeries[i]);
                    int y = yAxis.getPixelCoordinate(ySeries[i]);

                    // draw symbol with any color and shape
                    e.gc.setBackground(colors[i]);
                    e.gc.fillOval(x, y, sizes[i], sizes[i]);
                }
            }

            public boolean drawBehindSeries() {
                return false;
            }
        });

        // adjust the axis range
        chart.getAxisSet().adjustRange();

        return chart;
    }
}