ASE Home Page Products Download Purchase Support About ASE
ChartDirector Support
Forum HomeForum Home   SearchSearch

Message ListMessage List     Post MessagePost Message

  Donuts on a Scatter Plot
Posted by Ewan on Jan-04-2011 19:49
Hi,

I have a scatter chart centred around point 0,0. I am required to add a circular region to
the chart showing which points are in the desired range. So I need a donut or two circles
with the area between them shaded.

I have done something similar with lines, using c.addInterLineLayer(...) but there doesn't
seem to be something similar for creating an area between two circles.

I had a look at polar charts, the circular region example shows something similar to what I'm
looking for, but I am not sure how I would mix this with a scatter plot.

Any help would be appreciated,

Ewan.

  Re: Donuts on a Scatter Plot
Posted by Peter Kwan on Jan-05-2011 01:07
Attachments:
Hi Ewan,

You may draw a scatter plot on a polar chart. See the "Polar Scatter Chart" sample code.

If you have to use an XYChart, you may create a donut using another chart, and use it as a symbol in the XYChart. For example, the following code uses a donut chart to create a donut, and use it in the XYChart.

... add scatter layer as usual ....

//auto-scale axis, so we can know the size of the donut to use
c.layoutAxes();

//assume the donut is from 50 to 100, and center on 0.
int r1 = c.getYCoor(0) - c.getYCoor(100);
int r2 = c.getYCoor(0) - c.getYCoor(50);

//the donut
PieChart c2 = new PieChart(400, 400, Chart.Transparent);
c2.setDonutSize(200, 200, r1, r2);
c2.setData(new double[] {1});
c2.setLabelFormat(" ");
c2.sector(0).setColor(0x80ff0000, 0xc0ff0000);

//use the donut as the scatter symbol at 0
c.addScatterLayer(new double[] {0}, new double[] {0}).getDataSet(0).setDataSymbol3(c2.makeChart3());

Hope this can help.

Regards
Peter Kwan
fourq.png

  Re: Donuts on a Scatter Plot
Posted by Ewan on Jan-27-2011 01:55
Attachments:
Hi Peter,

Thank you for the help, I have managed to get this working using an XYChart.

I have two donuts, one centred around 0,0 and one dynamically placed.

This works fine (first picture) but when I try to zoom in the dynamically placed donut gets
cropped in the same way as the 0,0 circle (second picture). This is obviously because I am
creating the donut at 0,0 and then moving it to the correct location.

I've tried modifying the code further to correct this but have been unable to solve this
problem.

Thanks again for the help,

Ewan.
unzoomed.png
zoomed.png

  Re: Donuts on a Scatter Plot
Posted by Peter Kwan on Jan-27-2011 11:20
Hi Ewan,

Instead of "creating the donut at 0,0 and then moving it to the correct location", may be you can consider to create the donut at the correct location in the first place. This should avoid this problem.

Hope this can help.

Regards
Peter Kwan

  Re: Donuts on a Scatter Plot
Posted by Ewan on Jan-27-2011 22:03
Attachments:
Hi Peter,

When I try to position the donut first I can't seem to get them in the right place.

To draw the donut at 0,0 I did :

                c3.setDonutSize(c.getPlotArea().getWidth() / 2,
                c.getPlotArea().getHeight() / 2, r1, r2);

Then:

c.addScatterLayer(new double[] {dataX[0]}, new double[] {dataY[0]}).
                        getDataSet(0).setDataSymbol3(c3.makeChart3());

This produced the results in the pictures in my last post.

To draw the donut in the correct position the closes I have had to success is this:

                int r1 = c.getYCoor(0) - c.getYCoor(maxPadSize);
                int r2 = c.getYCoor(0) - c.getYCoor(minPadSize);

                PieChart c3 = new PieChart(c.getPlotArea().getWidth(),
                        c.getPlotArea().getHeight(),
                        Chart.Transparent);
                c3.setDonutSize(c.getYCoor(dataX[1]),
                        c.getYCoor(dataY[1]), r1, r2);
                c3.setData(new double[] {1});
                c3.setLabelFormat(" ");
                c3.sector(0).setColor(Chart.CColor(compDonutColour));

                c.addScatterLayer(new double[] {0}, new double[] {0}).
                        getDataSet(0).setDataSymbol3(c3.makeChart3());

This does seem to solve the zooming problem but causes the donuts to be drawn in the
wrong place. (Attached pictures)

The values are as follows:

c.getYCoor(0): 143
c.getYCoor(maxPadSize) : 57
c.getYCoor(minPadSize) : 117
r1 2 : 86
r2 2 : 26
dataX[1] : 1.5074519685
dataY[1] : -2.122898622
c.getYCoor(dataX[1]) : 130
c.getYCoor(dataY[1]) : 161

The problem seems to be that c.getYCoor(dataX[1]) and c.getYCoor(dataY[1]) are
coming out far to big and so placing the donut in the wrong place.

The donut should be placed over the pink circle in the picture.

It's probably something very simple that I'm missing, I appreciate all the help you are
giving.

Thanks,

Ewan.
chart.png

  Re: Donuts on a Scatter Plot
Posted by Ewan on Jan-27-2011 22:54
Managed to fix this by doubling the size of the pie chart area :

                PieChart c3 = new PieChart(c.getPlotArea().getWidth() * 2,
                        c.getPlotArea().getHeight() * 2,
                        Chart.Transparent);
                c3.setDonutSize(c.getPlotArea().getWidth(),
                        c.getPlotArea().getHeight(), r1, r2);
                c3.setData(new double[] {1});
                c3.setLabelFormat(" ");
                c3.sector(0).setColor(Chart.CColor(compDonutColour));

                c.addScatterLayer(new double[] {dataX[1]}, new double[] {dataY[1]}).
                        getDataSet(0).setDataSymbol3(c3.makeChart3());

By doubling the area the donut never gets cut where it is visible.

I'm sure there must be a more elegant solution than this however.

Ewan.

  Re: Donuts on a Scatter Plot
Posted by Peter Kwan on Jan-28-2011 01:45
Hi Ewan,

The c.getXCoor and c.getYCoor returns coordinate relative to the chart image, not relative to the plot area. As your donut is using coordinates relative to the plot area, I think the code should be:

c3.setDonutSize(c.getXCoor(dataX[1]) - c.getPlotArea().getLeftX(), c.getYCoor(dataY[1]) - c.getPlotArea().getTopY(), r1, r2);

Hope this can help.

Regards
Peter Kwan