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

Message ListMessage List     Post MessagePost Message

  Axis label in a colored Box
Posted by Medic89 on May-13-2022 00:36
Hello Peter,

is it possible to display the the axis label in an XY chart inside of a colored box. I used to add a colored zone to each line of my chart like seen in the screenshot below. Now i'd like to extend this zone to the left right to the end of the chart, so I have my axis label displayed inside a colored box so to say. Is this possible? I'm using chartdirector with Visual Studio and MFC.
Screenshot 2022-05-12 183340.png

  Re: Axis label in a colored Box
Posted by Peter Kwan on May-13-2022 18:39
Hi Medic89,

If you mean each axis label should be contained inside the colored text box, you can try:

TextBox *t = c->yAxis()->setLabelStyle("arialbd.ttf", 10, 0x000000);
t->setBackground(0xffff00, 0xffff00);

Hope this can help.

Peter Kwan

  Re: Axis label in a colored Box
Posted by Medic89 on May-15-2022 22:44
Hello Peter,

I already tried that, but then the colored Box is only as wide as the text is, also the Box mostly doesn't correctly align with the layer on the right.

Is it possible to extend the scatterlayer to the left, but without having gridlines on the new lefthand section like shown in my screen below?
Screenshot 2022-05-15 164424.png

  Re: Axis label in a colored Box
Posted by Peter Kwan on May-16-2022 17:51
Hi Medic89,

There are several methods. It depends on exact how your chart is configured. The followings are some options;

(a) If the labels on the right side are axis labels (configured with Axis.setLabels), you can turn them into a table, like:

In the above example, the horizontal axis labels are turned into a CDMLTable object. You can apply them to vertical axis labels too. Each label will then be contained within a "cell" (which is TextBox object) in the table, and you can configure their background colors and other attributes (font size, font style ...) independently.

(b) You can make the plot wider and put the axis labels inside the plot area. It is like:

The advantage of this style is you can maximize the plot area. The drawback is that labels may overlap with the chart contents. You can avoid the overlapping by configuring an horizontal axis margin. Normally, the horizontal axis starts at the left side of the plot area. You can use Axis.setMargin to moves the axis starting point to the right, so that the left side of the plot area will not contain any data point.

To put the axis labels inside the plot area, use a negative label gap:


To set the axis margin, use:

c->xAxis()->setMargin(0, 100);

(Note: In the above, I assume the vertical axis is the y-axis, and the horizontal axis is the x-axis.)

Peter Kwan

  Re: Axis label in a colored Box
Posted by Medic89 on May-20-2022 01:15
Thank you Peter, setMargin() did the trick!

Another question:

On top of my chartObject I have a diagram whose yAxis starts at 0 and goes up to 100. On the left side the yAxis labels every 10 steps from 0 to 100. Is it possible to skip the "0" label, so I want my diagram to start at 0, but the first label I want to be drawn is 10. Is that possible?

  Re: Axis label in a colored Box
Posted by Peter Kwan on May-20-2022 22:20
Hi Medic89,

There are several methods, depending on how your y-axis is configured.

First, we need to know why the y-axis is from 0 to 100 and have labels every 10 units. In most of our sample code, ChartDirector will automatically configure the y-axis scale based on the data, and it can happen by chance the the scale is 0 to 100. It is also possible your code explicitly set the y-axis scale from 0 to 100 with a label every 10 units.

If your code configures the y-axis to be 0 to 100, then it is easy to configure the labels too. If the y-axis is configured using Axis.setLinearScale, you can simply specify the labels directly:

// *** The first label is an empty space ***
const char* labels[] = {" ", "10", "20", "30", "40", "50", "60", "70", "80", "90", "100"};
const int labels_size = (int)(sizeof(labels)/sizeof(*labels));
c->yAxis()->setLinearScale(0, 100, StringArray(labels, labels_size));

Another method is to add a mark at y=0 to replace the y=0 label. You can replace it with an empty space.

c->yAxis()->addMark(0, -1, " ")->setMarkColor(Chart::Transparent, 0x000000, 0x000000);

A third method is to add a label at y=0 after you have configure the axis labels. The added label will replace any existing label, and you can add an empty space as the label.

c->yAxis()->setLinearScale(0, 100, 10);
c->yAxis()->addLabel(0, " ");

Best Regards
Peter Kwan