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

Message ListMessage List     Post MessagePost Message

  how to draw simple image
Posted by taejin Kim on Mar-07-2022 07:44
| Reply | Monitor
Attachments:
Hi ~~~

How can I draw simple Image ?

As you let me know addText() is very useful.

Is there addImage() like function exist?

Red dot is a sample.

Regards,
20220307_084112.png

  Re: how to draw simple image
Posted by Peter Kwan on Mar-07-2022 14:29
| Reply | Monitor
Hi taejin,

For the red dot, you can add it by adding a scatter layer to the chart, like:

c.addScatterLayer(new double[] { xCoor }, new double[] { yCoor }, "Position",
                    Chart.CircleShape, 13, 0xff0000, 0xff0000);

There are many scatter layer examples included in ChartDirector, and there are a lot of built-in symbols:

https://www.advsofteng.com/doc/cdnet.htm#builtinsymbols.htm

The addText can also be used to add a symbol by using the CDML syntax:

https://www.advsofteng.com/doc/cdnet.htm#cdml.htm

Note that addScatterLayer is using data coordinates (the coordinates for the x-axis and y-axis), but the addText is using pixel coordinates (the coordinates you use in setPlotArea). The addScatterLayer is recommended if your red circle depends on the data value. The addText can be used if the symbol is unrelated to the data, such as if you want to add a company logo on the chart. An example is:

https://www.advsofteng.com/doc/cdnet.htm#splineline.htm

Hope this can help.

Regards
Peter Kwan

  Re: how to draw simple image
Posted by taejin Kim on Mar-11-2022 10:11
| Reply | Monitor
Attachments:
I tried to layer to chart. Line and scatter.
However it dosn't work properly.

scatter image's position is a problem. -_-;;
Also if I trid down code, x Label "30" display twice.

What am I doing wrong?

private void Graph_Carbon()
{
    double[] data = { 0.85, 0.15};
    double[] labels = { 0, 30 };

    XYChart c = new XYChart(545, 250);
    c.setPlotArea(50, 20, 400, 180);

    c.addLegend(460, 100);
    c.yAxis().setTitle("C/02(kg/Nm³)");
    c.xAxis().setTitle("C(wt%x100)at meltdown");

    LineLayer layer = c.addLineLayer(data);
    c.xAxis().setLabels(labels);
    c.xAxis().setMinTickInc(3);

    //c.yAxis().setDateScale(0, 1.5);
    //c.xAxis().setDateScale(0, 30, 3);

    c.addText(180, 70, "Reduction Area");
    c.addText(180, 150, "Oxidation Area");


    // scatter Layer==============================
    double[] dataX0 = new double[1];
    double[] dataY0 = new double[1];

    dataX0[0] = 23;
    dataY0[0] = 0.52352941176470591;
    c.addScatterLayer(dataX0, dataY0, "position", Chart.CircleSymbol, 8, 0xff9933);

    // Output the chart
    winChartViewer1.Chart = c;

    //include tool tip for the chart
    //winChartViewer1.ImageMap = c.getHTMLImageMap("clickable", "", "title='{xLabel}: {value} GBytes'");
}

Regards,
doesntworkproperly.png

  Re: how to draw simple image
Posted by Peter Kwan on Mar-11-2022 12:21
| Reply | Monitor
Hi taejin,

The issue is because the x-coordinates used for the line layer.

In your case, the labels = { 0, 30 } are used as the x-axis labels:

c.xAxis().setLabels(labels);

The labels are not related to the LineLayer and are not the x-coordinates of the line layer.

When the labels are set as the x-axis labels, it means they are just "names" for display. For example, it is common for charts to have repeating labels like { "0:00", "6:00", "12:00", "18:00", "0:00", "6:00", "12:00", "18"00", "0:00"}. These labels is for human reading and have no meaning to the computer, and cannot be used to specify x-position.

For your case, the LineLayer has no x-coordinates. ChartDirector will then use the array index 0, 1 as the x-coordinates of the two points. So it will match the first two labels {0, 30}. (The labels are also positioned using the array index.)

The scatter layer does have x-coordinate at x = 23. As the first two labels are at x = {0, 1}, and the scatter point is at x = 23, so it is at the far right side of the chart.


For your case, the plot what you want, you can use x-coordinates for the line layer. It is like:

double[] dataY = { 0.85, 0.15};
double[] dataX  = { 0, 30 };
LineLayer layer = c.addLineLayer(dataY);
layer.setXData(dataX);

//There is no need to set the labels if there are x-coordinates. ChartDirector
//can auto-scale the x-axis like how it auto-scale the y-axis.
//c.xAxis().setLabels(labels);
//c.xAxis().setMinTickInc(3);

The following is an example of using x-coordinates for the LineLayer.

https://www.advsofteng.com/doc/cdnet.htm#unevenpoints.htm

Hope this can help.

Regards
Peter Kwan

  Re: how to draw simple image
Posted by taejin Kim on Mar-11-2022 13:53
| Reply | Monitor
Thanks a lot.

Solved all problems.

Best regards,