![单代号网络图](https://i-blog.csdnimg.cn/blog_migrate/5172a1fa07b723d6b9c5311a69aa7515.png)
单代号网络图
这篇文章由史蒂夫·汉纳( Steve Hannah )撰写,他是Codename One团队的最新成员之一,也是社区的长期贡献者。即将对Codename One进行的更新将包括一个新包(com.codename1.charts),用于在您的应用程序中呈现图表。 其中包括许多常见图表类别的模型和渲染器,包括多种条形图,折线图,散点图和饼图。
目标
对于图表包,我们希望使Codename One开发人员能够向其应用程序添加图表和可视化,而不必包括外部库或嵌入Web视图。 我们还希望利用图形管道中的新功能来最大化性能。
与CN1aChartEngine的区别
该程序包基于现有的CN1aChartEngine库,但是已经进行了实质性的重构,以减小其大小,提高其性能并简化其API。 如果您使用了现有的CN1aChartEngine库,则许多API(例如模型和渲染器)将是熟悉的。 关键区别在于:
- API 。 它包括ChartComponent,它是一流的代号一个组件,可以包含在表单内的任何位置。 CN1aChartEngine使用了许多类似Android的抽象(例如View,Intent和Activity)来简化从原始Android库的移植过程。 虽然这确实使移植变得更容易,但它使Codename One开发的API有点混乱。
- 表现。 它使用内置的Codename One图形管道来渲染所有图形。 CN1aChartEngine使用CN1Pisces库渲染图形,它比内置管道慢一个数量级。 这是出于历史原因。 最初开发CN1aChartEngine时,内置管道缺少实现图表所需的某些功能。
注意:实际上,在重构CN1aChartEngine来生成图表包之前,我将其移植到了内置管道中。 如果您已经在应用程序中使用了CN1aChartEngine,并且希望在无需更改代码的情况下从改进的性能中受益,则可以更新至该版本。
设备支持
由于海图程序包利用2D变换和形状,因此需要一些并非所有平台都可用的新图形功能。 当前支持以下平台:
- 仿真器
- 安卓
- 的iOS
如果需要对其他平台的支持,则可能要使用CN1aChartEngine库。
特征
- 内置支持许多常见类型的图表,包括条形图,折线图,堆积图,散点图,饼图等。
- 捏缩放– ChartComponent类包括可选的捏缩放支持。
- 平移支持– ChartComponent类包括对平移的可选支持。
图表类型
com.codename1.charts包包括用于许多不同类型图表的模型和渲染器。 它也是可扩展的,因此您可以根据需要添加自己的图表类型。 以下屏幕截图演示了可以创建的图表类型的一小部分示例。
注意:上面的屏幕截图来自ChartsDemo应用程序。 您现在可以通过从我们的Subversion存储库中签出该应用程序来开始使用该应用程序。
如何创建图表
向您的应用添加图表涉及四个步骤:
- 建立模型。 您可以使用com.codename1.charts.models包中的现有模型类之一为图表构建模型(即数据集)。 本质上,这就是您要添加要显示的数据的地方。
- 设置渲染器。 您可以使用com.codename1.charts.renderers包中的现有渲染器类之一为图表创建渲染器。 渲染器允许您指定图表的外观。 例如要使用的颜色,字体,样式。
- 创建图表视图。 使用com.codename1.charts.views包中的现有视图类之一。
- 创建一个ChartComponent 。 为了将图表添加到UI,您需要将其包装在ChartComponent对象中。
您可以查看ChartsDemo应用程序中的特定示例,但这是一些创建饼图的代码的高级视图。
/**
* Creates a renderer for the specified colors.
*/
private DefaultRenderer buildCategoryRenderer(int[] colors) {
DefaultRenderer renderer = new DefaultRenderer();
renderer.setLabelsTextSize(15);
renderer.setLegendTextSize(15);
renderer.setMargins(new int[]{20, 30, 15, 0});
for (int color : colors) {
SimpleSeriesRenderer r = new SimpleSeriesRenderer();
r.setColor(color);
renderer.addSeriesRenderer(r);
}
return renderer;
}
/**
* Builds a category series using the provided values.
*
* @param titles the series titles
* @param values the values
* @return the category series
*/
protected CategorySeries buildCategoryDataset(String title, double[] values) {
CategorySeries series = new CategorySeries(title);
int k = 0;
for (double value : values) {
series.add("Project " + ++k, value);
}
return series;
}
public Form createPieChartForm() {
// Generate the values
double[] values = new double[]{12, 14, 11, 10, 19};
// Set up the renderer
int[] colors = new int[]{ColorUtil.BLUE, ColorUtil.GREEN, ColorUtil.MAGENTA, ColorUtil.YELLOW, ColorUtil.CYAN};
DefaultRenderer renderer = buildCategoryRenderer(colors);
renderer.setZoomButtonsVisible(true);
renderer.setZoomEnabled(true);
renderer.setChartTitleTextSize(20);
renderer.setDisplayValues(true);
renderer.setShowLabels(true);
SimpleSeriesRenderer r = renderer.getSeriesRendererAt(0);
r.setGradientEnabled(true);
r.setGradientStart(0, ColorUtil.BLUE);
r.setGradientStop(0, ColorUtil.GREEN);
r.setHighlighted(true);
// Create the chart ... pass the values and renderer to the chart object.
PieChart chart = new PieChart(buildCategoryDataset("Project budget", values), renderer);
// Wrap the chart in a Component so we can add it to a form
ChartComponent c = new ChartComponent(chart);
// Create a form and show it.
Form f = new Form("Budget");
f.setLayout(new BorderLayout());
f.addComponent(BorderLayout.CENTER, c);
return f;
}
翻译自: https://www.javacodegeeks.com/2015/02/codename-one-charts.html
单代号网络图