XCL-Charts chart library brief tutorial and FAQs, xcl-charts chart

XCL-Charts chart library brief tutorial and FAQs, xcl-charts chart

From the very beginning, this Andriod chart library project has almost exhausted enthusiasm. Fortunately, I have basically implemented what I want to do. While there is still some interest, we can simply sum up some points.

Supported chart types:

Base chart name

BarChart horizontal/vertical column chart and back column chart

BarChart3D horizontal/vertical 3D column chart

StackBarChart horizontal/vertical Stacked column chart

RangeBarChart range column chart

LineChart

SplineChart

AreaChart Area Chart (line/smooth)

PieChart

PieChart3D pie chart

DountChart

ArcLineChart arc comparison chart

RoseChart Nightingale rose diagram/rose direction Diagram

FunnelChart funnel chart

CircleChart circle/semi-circular chart

BubbleChart bubble chart

RadarChart radar chart

GaugeChart dial

ScatterChart scatter chart

DialChart dashboard

Main Components(Note: many names are named out of order by myself. Professional names do not need to be too real, so they can achieve good results .)

Chart range:

That is, the range of the blue gradient background in the figure.

Setting function:

SetChartRange (float width, float height)
SetChartRange (float startX, float startY, float width, float height)

Drawing area:

The range of the yellow part in the figure.

The following function is used to set the shrinkage interval between the drawing area and the entire chart range:

SetPadding (float left, float top, float right, float bottom)

GetPlotArea ()

If the data volume is too large and the screen cannot be displayed, you can use getPlotArea (). extWidth () to expand the range and use gesture slide to view it.

Title bar:

Sub-title and sub-title

Some functions:

SetTitle (java. lang. String title)
AddSubtitle (java. lang. String subtitle)

Axis:

The axis is divided into two types: The data axis and the classification axis. The axis can be displayed in the upper, lower, left, and right positions, or any position based on the data value.

Reference function:

GetDataAxis ()
GetCategoryAxis ()

Axis title:

You can set the titles of the top, bottom, and bottom parts.

Reference function:

GetAxisTitle ()

Legend:

You can set the line or column mode and display it in any position in the chart.

Some functions:

GetPlotLegend ()

Dynamic legend:

You can add various chart descriptions.

Reference function:

GetDyLegend ()

Custom line

Used for marking or dividing lines.

Setting function:

SetCustomLines ()

Graph Annotation

This parameter is used when a chart is displayed with a special identifier on a specified element of the chart.

Setting function:

SetAnchorDataPoint ()

Focus box

When you click Select, the selected items are identified.

Activation function:

ShowClikedFocus ();

Focus line (dynamic line ):

It is used to display related cross lines and other identification lines when you click.

ShowDyLine () is activated.

GetDyLine () to obtain related objects.

Chart Scaling:

DisableScale () Disabled

EnabledScale () Enabled

Gesture slide

DisablePanMode () Disabled

EnabledPanMode () Enabled

SetPlotPanMode () sets the sliding mode (up/down/left/any direction)

FAQs:

1. The color setting function is not found.

Find the paint brush of the subclass and set the color on your own.

For example, set the axis color:

Chart. getDataAxis (). getAxisPaint (). setColor (Color. BLUE );

2. the font size does not change with the screen size.

Set the font size of the sub-class paint based on the screen size.

For example, set the font size of the Main title of a chart:

Chart. getPlotTitle (). getTitlePaint (). setTextSize (22 );

3. Hide the scale/label on the axis or axis

Take the data axis as an example:

Chart. getDataAxis (). hideAxisLine ();
Chart. getDataAxis (). hideTickMarks ();
Chart. getDataAxis (). hideAxisLabels ();

The same is true for the category axis.

4. How to set the display format on the axis or chart object:

The Image Library provides related callback functions.

A simple example code:

// Define the data axis Label display format chart. getDataAxis (). setLabelFormatter (new IFormatterTextCallBack () {@ Overridepublic String textFormatter (String value) {// TODO Auto-generated method stubDouble tmp = Double. parseDouble (value); DecimalFormat df = new DecimalFormat ("#0"); String label = df. format (tmp ). toString (); return (label );}});

Others.

5. If you pass a value from the Activity to the view, refresh

A simple example of refreshing two curves at the same time:

Activity:   chartView.refreshChart(linePoint1, linePoint2);View:   public void refreshChart( List<PointD> linePoint1, List<PointD> linePoint2){dataSeries1.setLineDataSet(linePoint1);dataSeries2.setLineDataSet(linePoint2);this.invalidate();}

6. How to Deal with the Double Y axis?

Add multiple images. See the mixed legend sub-in the Demo.

7. The column chart and line chart must be displayed together.

Add multiple images. See the mixed legend sub-in the Demo.

8. A specific vertex or value must be identified.

Use graph annotation.

9. This or that animation effect needs to be displayed.

You can refer to the animations in some examples in the Demo, such as gradual display, and implement them by yourself, or you can use a third-party library.

10. Can I set the bar width?

The size of a column is automatically set based on the width and number of columns in the drawing area. It cannot be explicitly specified.

11. The chart is removed from the drawing area.

Hscrollview can be used for any movement currently. See related examples

12. Large data volume, slow Sliding Speed

If you do not need to click or zoom in, you can use hscrollview. Otherwise, you can use disableHighPrecision () to improve performance.

However, this function is used with caution in pie charts.

13. How to get the click object and related values of the chart in the Activity?

See the Demo for a demonstration.

14. How does the thermometer axis/unequal axis work?

XCL-Charts is not currently supported, but fortunately big S has written a classic implementation, which is under the directory of the online chart library.

15. The area chart has no gradient effect.

Yes. You can specify the start and end colors of the gradient, from top to bottom or from left to right.

16. The legend must be shown below or left or right.

You can directly set related functions. Related examples are provided in the Demo.

17. There is an axis to display on the top

You can directly set relevant attributes. Related examples are provided in the Demo.

18. Example of a line chart sliding between the left and right

Two views, one for displaying the Y axis, the graph title, and the legend, and the other for displaying the scrollview and chart.

19. The Y axis title is displayed on the top, and the X axis title is displayed on the bottom right.

Either way, you can refer to the "vertical custom line column Chart" example in the Demo.

In view render (), you can use functions such as chart. getPlotArea (). getLeft () and chart. getPlotArea (). getTop () to obtain related coordinates,

Directly drawText.

20. What should I do if I do not have enough sensitivity when I click?

Use extPointClickRange (10) to expand the selected range.

21. When the gesture moves, the Axis label is removed from the drawing area and displayed.

Related functions are provided to control the display range after removal. Take the X direction as an example:

// Scale down during translation
Float margin = DensityUtil. dip2px (getContext (), 20 );
Chart. setXTickMarksOffsetMargin (margin );

Y direction and so on.

22. The tab line of the pie chart is extended from the beginning of the slice.

Set the starting point of the line. Chart. getLabelBrokenLine (). setBrokenStartPoint (10f); ratio of 0 to 10.

23. The labels and lines of the pie chart must be the same color as those of the slice.

Chart. syncLabelLineColor.

24. Is there a gap or is it not displayed when the pie chart data is passed in?

The float and double types of Java have errors in calculation. Resulting in a sum of less than or greater than 360 degrees.

We recommend that you call the related functions in the Mathhelper class in the library for computation.

25. The pie chart labels are too dense and cannot be seen clearly.

Processing algorithms with too many tags that do not overlap are not interested in research, but the library has provided 5 or 6 Label display styles. We recommend that different slice be staggered by angle and size,

And specify different Label display styles for different sectors.

26. I need to synchronize multiple images and regularly refresh the data.

In the Demo, see the example of a two-line chart.

27. Where can I download the source code?

Https://github.com/xcltapestry/XCL-Charts

28. Why are there so many forks after the download.

Re-import xclcharts. jar.

29. How can I have two projects.

Xcl-charts is the jar project generated

Xcl-charts-demo is a demo project.

30. How to place charts in xml is generated by code in ChartsActivity.

You can also put the view in xml. Do not always stare at ChartsActivity.

31. The online point is too large or too small. How can I adjust it?

There are related functions to set the radius, such as lineData5.setDotRadius (15 );

32. Labels overlap when multiple lines are together.

Data sources cannot be controlled. You can set different styles and rotation angles for different lines.

It can be adjusted. Some of them can be displayed on the top, and some are displayed under the points.

33. How to occupy so much memory.

For example, ChartsActivity generates more than 40 views at a time. You can try it one by one. Although the customization is strong, there are many options,

But the Buddy used a lot of memory optimization methods at the beginning.

34. Many sub-categories.

Well, because of my ambition, I have encapsulated parts, and I don't want to add any images in the future, I just need to focus on the implementation logic of the graph itself.

Brother builds a basic platform for Android plotting, instead of just drawing a certain type of image.

To put it another way, writing code in Java is too long. I like Golang very much now.

35. What is the design idea of the database for the group master?

I don't know how to answer this question. I only want to think of a few items. The graphic effects should be dazzling, the customization should be high, the calling should be flexible, and the complex diagrams can be implemented through the combination of graphs.

All parts must be encapsulated, so that I can add images in the future.

36. Where are the documents of this library?

The doc directory contains Javadoc information about functions and related classes. Let's look at the Demo directly. There are currently more than 40 examples. Do you think I am really idle?

37. Contact the group owner for an aChartEngine question.

Sorry, I have never used aChartEngine. I have browsed the source code and it is very classic, but I have never understood it.

38. For more information, see MPAndroidChart.

Sorry, I have never studied it, but I have read the MPAndroidChart demo. Then, I think I have done a lot better than this.

At least the chart presentation methods and combinations should be more flexible, and there should be more types of charts.

39. I just want to extract some of your code.

Roll.

40. Don't you want to close your hand?

Yes, I have said many times.

MAIL: xcl_168@aliyun.com

BLOG: http://blog.csdn.net/xcl168