|
 Negative values in polar chart |
| Posted by Felix on Aug-11-2021 22:42 |
|
Hello Peter,
I am trying to plot negative values in a polar chart. That’s already possible as you can see in my example below, but the problem is the color infill. The infill starts at the middle of the circle (the most negative value) and ends at the specific value of the graph. Instead, I would like to show the deviation of the graph-value compared to zero. So I would like the infill to start at the zero-line and go out (or in for negative values) until it reaches the graph-value. My second picture shows how the plot would look like for my example values. (I used paint to create it.) Would it be possible to do that with ChartDirector?
Regards,
Felix
|
| Re: Negative values in polar chart |
| Posted by Peter Kwan on Aug-12-2021 15:57 |
|
Hi Felix,
To achieve the coloring you want, I can only think of using the polyShape method introduced in ChartDirector 7.0.
Basically, instead of filling the region with a polar area layer, you can create a polyShape consisting of the outline of the shape and the circle at r = 0, and fill the polyShape. See attached image.
I am not certain which programming language you are using. My test code is written using C#:
// The data
double[] data = {17, 7, 16, 7, 18, -13, 5, 11};
string[] labels = {"1", "2", "3", "4", "5", "6", "7", "8"};
// The polar chart with the data added as a line layer
PolarChart c = new PolarChart(460, 460);
c.setPlotArea(230, 230, 180);
c.setGridStyle(false);
c.angularAxis().setLabels(labels);
c.radialAxis().setLinearScale(-20, 20, 10);
c.addLineLayer(data, 0x66CCFF);
// Auto-scale axis
c.layout();
// Trace out the polygon
List<int> shape = new List<int>();
for (int i = 0; i < data.Length; ++i) {
shape.Add(c.getXCoor(data[i], i));
shape.Add(c.getYCoor(data[i], i));
}
// Now add the circle at r = 0
int cx = c.getXCoor(c.radialAxis().getMinValue(), 0);
int cy = c.getYCoor(c.radialAxis().getMinValue(), 0);
int radius = Math.Abs(c.getYCoor(0, 0) - cy);
shape.Add(Chart.NewShape);
shape.Add(cx);
shape.Add(cy);
shape.Add(radius);
shape.Add(radius);
// Draw the polyShape in a separate DrawArea
DrawArea d = new DrawArea();
d.setSize(c.getWidth(), c.getHeight(), Chart.Transparent);
d.polyShape(shape.ToArray(), 0x66CCFF, 0x66CCFF);
// Add the polyShape to the chart so that it is in front of the plot area
// background but behind the axis and the line layer
c.setResource("myShape", d);
ChartDirector.TextBox t = c.addText(0, 0, "<*img=@/myShape*>");
t.setMargin(0);
t.setZOrder(Chart.PlotAreaZ);
.... output chart as usual ....
Regards
Peter Kwan
|
| Re: Negative values in polar chart |
| Posted by Felix on Aug-16-2021 14:53 |
|
Hi Peter,
thanks a lot for your reply! Yes, you’re right. That’s exactly what I want to achieve. But it seems to be a pretty manual way. Isn’t there an easier solution? I think a lot of users would like to fill the graph starting from zero instead from the most negative value, so a functionality like this would be a huge improvement. As you can see in your own plot, it’s very easy to tell, that the value at position 6 is negative. If the graph was filled up from the center point, you couldn’t tell that by just having a quick glance at the graph. I’d really appreciate your help if you have any ideas!
Regards
Felix |
| Re: Negative values in polar chart |
| Posted by Peter Kwan on Aug-17-2021 00:03 |
|
Hi Felix,
I agree that the filling method you use is useful, but ChartDirector currently does not support this filling method in any polar chart layer. So we can only use the DrawArea object to perform the filling with our own code.
Regards
Peter Kwan |
| Re: Negative values in polar chart |
| Posted by Felix on Aug-18-2021 17:38 |
|
Hi Peter,
thanks for your help. So I’ll try it, using the DrawArea object. Unfortunately I don’t really understand your code in C#. Could you tell me, how that would look like in C++?
Regards
Felix |
| Re: Negative values in polar chart |
| Posted by Felix on Aug-18-2021 23:01 |
|
One additional thing: I tried to use your example above, but there are two problems:
1. There is no ChartDirector Legend.
2. The code doesn’t work for multiple polygons. If I want to show only one graph it’s working, but unfortunately I’m not able to plot multiple graphs at once. What would I have to modify to do that?
I really appreciate your help
Regards
Felix |
| Re: Negative values in polar chart |
| Posted by Peter Kwan on Aug-19-2021 19:25 |
|
Hi Felix,
You can add a legend box using BaseChart.addLegend. ChartDirector will automatically add legend entries to the legend box for any data series that has a name.
I have put the code that creates the polygon into a function "addShape". In the Page_Load event handler, I call the function two times to add two polygons.
private void addShape(PolarChart c, double[] data, int color)
{
List<int> shape = new List<int>();
for (int i = 0; i < data.Length; ++i) {
shape.Add(c.getXCoor(data[i], i));
shape.Add(c.getYCoor(data[i], i));
}
int cx = c.getXCoor(c.radialAxis().getMinValue(), 0);
int cy = c.getYCoor(c.radialAxis().getMinValue(), 0);
int radius = Math.Abs(c.getYCoor(0, 0) - cy);
shape.Add(Chart.NewShape);
shape.Add(cx);
shape.Add(cy);
shape.Add(radius);
shape.Add(radius);
DrawArea d = new DrawArea();
d.setSize(c.getWidth(), c.getHeight(), Chart.Transparent);
d.polyShape(shape.ToArray(), color, color);
string id = Guid.NewGuid().ToString();
c.setResource(id, d);
ChartDirector.TextBox t = c.addText(0, 0, "<*img=@/" + id + "*>");
t.setMargin(0);
t.setZOrder(Chart.PlotAreaZ);
}
protected void Page_Load(object sender, EventArgs e)
{
double[] data = {17, 7, 16, 7, 18, -13, 5, 11};
double[] data2 = { 7, 16, 7, 18, -13, 5, 11, 17 };
string[] labels = {"1", "2", "3", "4", "5", "6", "7", "8"};
PolarChart c = new PolarChart(460, 500);
c.setPlotArea(230, 260, 180);
c.setGridStyle(false);
LegendBox b = c.addLegend(230, 10, false, "Arial Bold", 8);
b.setAlignment(Chart.TopCenter);
c.addLineLayer(data, 0x7F66CCFF, "Alpha");
c.addLineLayer(data2, 0x7FFF9966, "Beta");
c.angularAxis().setLabels(labels);
c.radialAxis().setLinearScale(-20, 20, 10);
c.layout();
addShape(c, data, 0x7F66CCFF);
addShape(c, data2, 0x7FFF9966);
// Output the chart
WebChartViewer1.Image = c.makeWebImage(Chart.PNG);
}
Regards
Peter Kwan
|
| Re: Negative values in polar chart |
| Posted by Rick Issen on Aug-20-2021 15:34 |
|
Hi Peter,
regarding your example code here, I'd like to add markers on the corner points of each graph in the usual CD way.
Unfortunately, the first graph shows the marker but not the second one! Why?
Regards,
Rick |
| Re: Negative values in polar chart |
| Posted by Peter Kwan on Aug-21-2021 01:11 |
|
Hi Rick,
In my previous message, there are the lines:
c.addLineLayer(data, 0x7F66CCFF, "Alpha");
c.addLineLayer(data2, 0x7FFF9966, "Beta");
To add symbols, in the simplest case, just add the symbols like in the "Polar Line Chart" example included in ChartDirector. It is like:
PolarLineLayer layer0 = c.addLineLayer(data, 0x7F66CCFF, "Alpha");
layer0.setDataSymbol(Chart.SquareSymbol, 11, 0x7F66CCFF);
PolarLineLayer layer1 = c.addLineLayer(data2, 0x7FFF9966, "Beta");
layer1.setDataSymbol(Chart.CircleSymbol, 11, 0x7FFF9966);
Regards
Peter Kwan |
| Re: Negative values in polar chart |
| Posted by Rick Issen on Aug-21-2021 02:17 |
|
Hi Peter,
Thank you very much for your quick response!!!
I know how to add marker. The problem was in my code - that was slightly different from yours - that the "layout" function was called twice. Read about it in your manual: That must be avoided.
So, I could solve it (see attached picture).
Regards,
Ralf
|
|
Forum Home
Search
Message List
Post Message
(Felix)