chart-fx

ChartFx 是一个由 GSI 为 FAIR 开发的科学绘图库，专注于性能优化的实时数据可视化，可以处理每秒 25 次更新率的数据集，数据点数量从几万到 500 万不等，常用于数字信号处理应用。基于早期在 GSI 和 CERN 使用的基于 Swing 的设计，它是对 JavaFX 默认 Chart 实现的重写，旨在保留早期和其他类似基于 Swing 库的丰富功能和可扩展性，同时解决性能瓶颈和 API 问题。重新设计的动机已在 IPAC'19 上展示（论文，海报）。您可以在 JFX Days 上观看最近的演示这里。

<figure> <img src="https://yellow-cdn.veclightyear.com/835a84d5/48fbc8ff-a856-4cba-900f-2b5350f90b3b.png" alt="ChartFx 示例" width=1200/> <figcaption> 示例展示了误差条和误差面表示、模拟元数据显示、`ChartPlugin` 交互器和数据参数测量指示器（此处：'Marker#0' 和 'Marker#1' 之间的 '20%-80% 上升时间'）。 </figcaption> </figure>

功能和特性

该库提供了科学信号处理领域常见的各种绘图类型、灵活的插件系统以及实验室仪器中常见的在线参数测量。其一些特性包括（详情请参见演示）：

DataSet：基本的 XY 类型数据集，可通过 DataSetError 扩展以考虑测量不确定性，DataSetMetaData、EditableDataSet、Histogram 或 DataSet3D 接口；
数学子库：FFT、小波和其他谱分析和线性代数例程，数值稳健的积分和微分，IIR 和 FIR 类型滤波，线性回归和非线性 chi-square 类型函数拟合；
Chart：提供欧几里得、极坐标或 3D 数据集的 2D 投影，以及可配置的图例；
Axis：一个或多个线性、对数、时间序列、反转、动态自动（增长）范围、基于范围的自动 SI 和时间单位转换的轴；
Renderer：散点图、折线图、面积图、误差条和误差面、垂直条形图、贝塞尔曲线、阶梯图、1D/2D 直方图、山脉图显示、真实等高线图、热图、淡出数据集历史、标记图表范围和指示标记、六边形图、元数据（例如用于指示常见测量错误、警告或信息，如超出或低于范围、设备或配置错误等）；
ChartPlugin：带历史记录的数据缩放器、缩放至原点、并可选择限制为 X 和/或 Y 坐标、平移器、数据值和范围指示器、十字光标指示器、数据点工具提示、DataSet 编辑、表格视图、导出为 CSV 和系统剪贴板、在线轴编辑、数据集参数测量（如上升时间、最小值、最大值、均方根等）。

为了在使用 Canvas 作为图形后端的同时提供一些场景图级别的功能，每个模块的功能都经过扩展，可以通过直接的 API 方法以及外部 CSS 类型样式表轻松自定义。

使用示例

将库添加到您的项目中

所有 chart-fx 版本都部署到 Maven 中央仓库，对于 Maven，您可以将其添加到 pom.xml 中，如下所示：

<dependencies>
  <dependency>
    <groupId>io.fair-acc</groupId>
    <artifactId>chartfx</artifactId>
    <version>11.3.1</version>
  </dependency>
</dependencies>

或者在 build.gradle 中这样添加：

implementation 'io.fair-acc:chartfx:11.3.1'

要使用不同的构建系统或库版本，请查看 maven central 上的代码片段。

虽然大多数用户需要 io.fair-acc:chartfx 构件，但也可以独立使用来自 io.fair-acc:dataset 的数据容器和来自 io.fair-acc:math 的算法，而无需依赖较重的 UI 组件。

使用快照仓库

如果您想尝试主分支或某个特性分支中未发布的功能，无需下载源代码并自行构建 chart-fx。您可以直接使用 sonatype 快照仓库中的 <分支名>-SNAPSHOT 版本，例如通过在 pom.xml 中添加以下内容来使用当前的主分支。所有可用的快照版本都可以在 sonatype 快照仓库中找到。

<details><summary> 当前主分支的 pom.xml 示例（点击展开） </summary>

<dependencies>
    <dependency>
        <groupId>io.fair-acc.chartfx</groupId>
        <artifactId>chartfx</artifactId>
        <version>main-SNAPSHOT</version>
        <!-- <version>main-20200320.180638-78</version> 固定到特定的快照构建-->
    </dependency>
</dependencies>
<repositories>
    <repository>
        <id>oss.sonatype.org-snapshot</id>
        <url>https://s01.oss.sonatype.org/content/repositories/snapshots</url>
        <releases>
            <enabled>false</enabled>
        </releases>
        <snapshots>
            <enabled>true</enabled>
        </snapshots>
    </repository>
</repositories>

</details>

代码示例

以下最小工作示例可用作入门 chart-fx 的样板项目。

<img src="https://yellow-cdn.veclightyear.com/835a84d5/d6176e05-74e7-4237-841f-f5909d4f0bd2.png" width=800 alt="简单的 ChartFx 示例"/> <details><summary>相应的源代码 `ChartFxSample.java`（展开）</summary>

package com.example.chartfx;

import io.fair_acc.chartfx.XYChart;
import io.fair_acc.chartfx.axes.spi.DefaultNumericAxis;
import io.fair_acc.dataset.spi.DoubleDataSet;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class SimpleChartSample extends Application {
    private static final int N_SAMPLES = 100;

    @Override
    public void start(final Stage primaryStage) {
        final StackPane root = new StackPane();

        final XYChart chart = new XYChart(new DefaultNumericAxis(), new DefaultNumericAxis());
        root.getChildren().add(chart);

        final DoubleDataSet dataSet1 = new DoubleDataSet("数据集 #1");
        final DoubleDataSet dataSet2 = new DoubleDataSet("数据集 #2");
        // lineChartPlot.getDatasets().add(dataSet1); // 用于单个数据集
        chart.getDatasets().addAll(dataSet1, dataSet2); // 两个数据集

        final double[] xValues = new double[N_SAMPLES];
        final double[] yValues1 = new double[N_SAMPLES];
        final double[] yValues2 = new double[N_SAMPLES];
        for (int n = 0; n < N_SAMPLES; n++) {
            xValues[n] = n;
            yValues1[n] = Math.cos(Math.toRadians(10.0 * n));
            yValues2[n] = Math.sin(Math.toRadians(10.0 * n));
        }
        dataSet1.set(xValues, yValues1);
        dataSet2.set(xValues, yValues2);
final Scene scene = new Scene(root, 800, 600);
    }
    public static void main(final String[] args) {
        Application.launch(args);
    }
}

</details><details><summary>对应的构建规范(展开)</summary> pom.xml:

<project>
<groupId>com.example.chartfx</groupId>
<artifactId>chartfx-sample</artifactId>
<name>chart-fx 示例</name>
<dependencies>
  <dependency>
    <groupId>io.fair-acc</groupId>
    <artifactId>chartfx</artifactId>
    <version>11.3.0</version>
  </dependency>
  <dependency>
    <groupId>org.slf4j</groupId>
    <artifactId>slf4j-simple</artifactId>
    <version>2.0.9</version>
  </dependency>
</dependencies>
</project>

</details> <details><summary>运行方式(展开)</summary>

mvn compile install
mvn exec:java

</details>

示例

chart-fx 示例子模块包含大量示例,展示了该库的功能和用法。如果你想自己尝试,请运行:

mvn compile install
mvn exec:java

<table> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/6305d573-6b54-4801-92a8-e6abc28499ce.png" alt="类别轴示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/CategoryAxisSample.java">CategoryAxisSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/8afe160e-a068-4641-a65e-646bf54cc62b.png" alt="多轴示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/MultipleAxesSample.java">MultipleAxesSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/906eb0fc-7a98-4fb4-a43b-a1de5d9bb61d.png" alt="时间轴示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/TimeAxisSample.java">TimeAxisSample.java</a></figcaption></figure></td> </tr> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/7381ac2b-f6ab-4d5d-a918-764c752d387a.png" alt="对数轴示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/LogAxisSample.java">LogAxisSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/64c13683-9954-43c3-bfd4-aca15fad2bd4.png" alt="直方图示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/HistogramSample.java">HistogramSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/a89dbd5a-8cc4-4c63-b7df-44d1980e2f2e.png" alt="二维直方图示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/Histogram2DimSample.java">Histogram2DimSample.java</a></figcaption></figure></td> </tr> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/7926f9bb-4f56-48d9-ac6b-4d9e7ea9167d.png" alt="编辑数据集示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/EditDataSetSample.java">EditDataSetSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/62a4ce5c-3f2a-401a-98bc-5a66aae622e7.png" alt="极坐标图示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/PolarPlotSample.java">PolarPlotSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/f775ed7e-cbf6-4601-a599-d264a7dac8cd.png" alt="编辑数据示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/MetaDataRendererSample.java">MetaDataRendererSample.java</a></figcaption></figure></td> </tr> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/82353f5a-6e18-4fc0-895c-56cf8d4823d9.png" alt="历史数据集渲染器示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/HistoryDataSetRendererSample.java">HistoryDataSetRendererSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/613df0c4-d10f-46dd-849f-f41b0c023d9d.png" alt="山脉图渲染器示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/MountainRangeRendererSample.java">MountainRangeRendererSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/e2137577-0852-4603-bfba-8a325d43d185.png" alt="图表解剖示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/ChartAnatomySample.java">ChartAnatomySample.java</a></figcaption></figure></td> </tr> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/f214186f-49d1-4447-942f-b3fb6f433167.png" alt="误差数据集渲染器样式示例1" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/ErrorDataSetRendererStylingSample.java">ErrorDataSetRendererStylingSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/9eea8c79-aa98-427c-bcff-c2d9bd3ce2bc.png" alt="误差数据集渲染器样式示例2" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/ErrorDataSetRendererStylingSample.java">ErrorDataSetRendererStylingSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/c092ea99-0eaf-484a-b9cf-45b1f380b83c.png" alt="带标签标记示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/LabelledMarkerSample.java">LabelledMarkerSample.java</a></figcaption></figure></td> </tr> <tr> <td colspan=2><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/9b98a3e5-4a2b-4b49-bdfb-b6f2854d6547.png" alt="等高线图示例1" width=600/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/ContourChartSample.java">ContourChartSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/1661cd10-b334-4eda-b248-04ce36d0ab4a.png" alt="散点和气泡图渲染器示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/ScatterAndBubbleRendererSample.java">ScatterAndBubbleRendererSample.java</a></figcaption></figure></td> </tr> <tr> <td colspan=2><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/ae0148cc-38c2-4180-99c9-d8a5a0837e0d.png" alt="等高线图示例" width=600/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/ContourChartSample.java">ContourChartSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/0300b110-bb4a-4f36-a473-f54310be72b5.png" alt="散点和气泡图渲染器示例" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/ScatterAndBubbleRendererSample.java">ScatterAndBubbleRendererSample.java</a></figcaption></figure></td> </tr> <tr> <td colspan=2><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/8fd0d0d1-64af-4563-b7c9-174ede6a6ac8.png" alt="ChartIndicatorSample" width=600/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/chart/ChartIndicatorSample.java">ChartIndicatorSample.java</a></figcaption></figure></td> <td></td> </tr> <tr> <td colspan=2><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/543b3108-c477-4bd2-bece-4fadf5ee0ad6.png" alt="HistogramRendererTests" width=600/><figcaption><a href="chartfx-chart/src/test/java/io/fair_acc/chartfx/renderer/spi/HistogramRendererTests.java">HistogramRendererTests.java</a></figcaption></figure></td> <td></td> </tr> </table>

金融相关示例

金融图表是一种可视化追踪各种业务和金融指标（如流动性、价格变动、支出、现金流等）随时间变化的图表类型。金融图表是表达业务或金融市场（金融工具、金融资产）故事的绝佳方式。

chart-fx samples子模块包含金融图表和工具箱示例。

如果你想自己尝试，请运行：

mvn compile install
mvn exec:java

<table> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/8ca7093b-38e8-41e8-b10c-73d0b4d6f792.png" alt="FinancialCandlestickSample" width=600/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/financial/FinancialCandlestickSample.java">FinancialCandlestickSample.java（支持多种主题）</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/1937352d-c31d-48a7-b1d1-5d0cc91f29f5.png" alt="FinancialHiLowSample" width=600/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/financial/FinancialHiLowSample.java">FinancialHiLowSample.java（OHLC渲染器）</a></figcaption></figure></td> </tr> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/7e6b67d8-ac56-4182-b195-5abd1617d833.png" alt="FinancialAdvancedCandlestickSample" width=600/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/financial/FinancialAdvancedCandlestickSample.java">FinancialAdvancedCandlestickSample.java（高级绘制条和扩展点）</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/aec2c9bc-b23b-41bb-8a13-ea7a129d7e71.png" alt="FinancialAdvancedCandlestickSample" width=600/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/financial/FinancialRealtimeCandlestickSample.java">FinancialRealtimeCandlestickSample.java（OHLC实时处理）</a></figcaption></figure></td> </tr> </table>

金融足迹图

<figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/237c945b-6f40-4f20-b0cd-f42cb918c791.png" alt="FinancialAdvancedCandlestickSample" width=1600/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/financial/FinancialRealtimeFootprintSample.java">FinancialRealtimeFootprintSample.java（足迹实时处理）</a></figcaption></figure>

数学和信号处理相关示例

数学示例可以通过以下命令启动：

mvn compile install
mvn exec:java@math

<table> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/3d1c0ae8-754b-400d-b462-335898c46021.png" alt="DataSetAverageSample" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/DataSetAverageSample.java">DataSetAverageSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/ba7d3165-0572-4939-8104-1a36cc57b5c0.png" alt="DataSetFilterSample" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/DataSetFilterSample.java">DataSetFilterSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/8b47cd9e-234d-4176-b065-9dc4b85eb4a9.png" alt="DataSetIntegrateDifferentiateSample" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/DataSetIntegrateDifferentiateSample.java">DataSetIntegrateDifferentiateSample.java</a></figcaption></figure></td> </tr> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/8f13743e-f7c2-46f5-8df2-3e2c0e677358.png" alt="DataSetSpectrumSample" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/DataSetSpectrumSample.java">DataSetSpectrumSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/d7c8d221-e97f-49ea-8563-053da173ef69.png" alt="FourierSample" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/FourierSample.java">FourierSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/90354358-b5bc-4362-9cfe-699491b4cee2.png" alt="FrequencyFilterSample" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/FrequencyFilterSample.java">FrequencyFilterSample.java</a></figcaption></figure></td> </tr> <tr> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/55136427-03fd-4fc5-a5db-8277d5f3b827.png" alt="GaussianFitSample" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/GaussianFitSample.java">GaussianFitSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/e0fc81d8-fa76-41ea-8441-7f4e5544c62d.png" alt="IIRFilterSample" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/IIRFilterSample.java">IIRFilterSample.java</a></figcaption></figure></td> <td><figure><img src="https://yellow-cdn.veclightyear.com/835a84d5/8b9bcb40-6a56-46fc-9e8a-f3b87e4f61bb.png" alt="WaveletScalogram" width=300/><figcaption><a href="chartfx-samples/src/main/java/io/fair_acc/sample/math/WaveletScalogram.java">WaveletScalogram.java</a></figcaption></figure></td> </tr> </table>

其他示例

还有dataset和accelerator UI子模块的示例，随着新功能的添加，这些示例将随时间扩展。

mvn compile install
mvn exec:java@dataset
mvn exec:java@acc-ui

性能比较

除了上述扩展功能外，ChartFx的优化目标还包括实现数据集从几万到500万个数据点的25 Hz实时更新率。为了优化性能并与其他图表库（尤其是功能较少的库）进行比较，我们选择了一个简化的示波器风格测试用例（参见演示中的RollingBufferSample），该用例显示两条具有独立自动调整y轴、共同滑动时间序列轴的曲线，且不使用其他ChartPlugin。下面展示了ChartFx和JavaFX图表库在25 Hz和2 Hz更新率下的测试用例和直接性能比较。

<table style="width:100%"> <tr><td colspan=2><figure> <img src="https://yellow-cdn.veclightyear.com/835a84d5/fb18f468-f508-450f-b55e-f3251c8796d9.png" alt="ChartFx性能对比测试用例" width=99%/> <figcaption>性能测试场景：两个独立图表，独立自动调整的y轴，以及共用的滚动时间序列轴。测试系统：Linux 4.12.14，Intel(R) Core(TM) i7 CPU 860 @2.80GHz和GeForce GTX 670 GPU（NVIDIA驱动）。</figcaption> </figure></td></tr> <tr><td><figure> <img src="https://yellow-cdn.veclightyear.com/835a84d5/c8c1d47e-15d3-41cc-b6c1-35dcea5c56f6.png" alt="JavaFX-ChartFx 25 Hz更新率性能对比" width=90%/> <figcaption>25 Hz更新率性能对比。</figcaption> </figure></td> <td><figure> <img src="https://yellow-cdn.veclightyear.com/835a84d5/5c7104f8-d49a-44db-aafa-e857c8e5e791.png" alt="JavaFX-ChartFx 2 Hz更新率性能对比" width=90%/> <figcaption>2 Hz更新率性能对比。</figcaption> </figure></td></tr> </table>

虽然ChartFx实现已经在功能上有所改进，并且在处理超大数据集时性能提升了两个数量级，但基本测试场景也与流行的现有Java-Swing和非Java基础UI图表框架进行了对比。下图总结了在25 Hz更新率和1k样本条件下评估的图表库。

<figure> <img src="https://yellow-cdn.veclightyear.com/835a84d5/920011c1-93e0-4568-84b4-c002c253b553.png" alt="ChartFx性能对比" width=800/> <figcaption> 流行的JavaFX、Java-Swing、C++/Qt和WebAssembly基础实现的图表性能对比：<a href="https://github.com/extjfx/extjfx">ExtJFX</a>、<a href="https://github.com/fair-acc/chart-fx">ChartFx</a>、<a href="https://github.com/HanSolo/charts">HanSolo Charts</a>、<a href="http://www.jfree.org/jfreechart/">JFreeChart</a>、<a href="https://cds.cern.ch/record/1215878">JDataViewer</a>、<a href="https://www.qcustomplot.com/">QCustomPlot</a>、<a href="https://doc.qt.io/qt-5/qtcharts-index.html">Qt-Charts</a>、<a href="https://doc.qt.io/qt-5/wasm.html">WebAssembly</a>。最后的`Qt Charts`条目显示了10万个数据点以25 Hz更新率的结果。 </figcaption> </figure>

一些思考

从最初通过扩展来改进JDK的JavaFX图表功能和性能开始，然后逐步替换瓶颈，最终重新设计并替换原始实现，由此产生的ChartFx库提供了实质性的更大功能，并实现了约两个数量级的性能提升。然而，撇开功能改进不谈，即使是JavaFX最佳场景（静态轴）与其他非JavaFX库的直接性能对比也表明，尽管经过重新设计，JavaFX原始图形性能仍落后于现有的基于Java Swing的JDataViewer，尤其是Qt Charts实现。该库将继续在GitHub上维护，并用于GSI现有和未来基于JavaFX的控制室UI。获得的经验和接口将为计划中的基于C++的对应实现提供起点，该实现将使用Qt或其他合适的低级图表库。

处理源代码

如果你想处理chart-fx源代码，无论是想尝试样例还是为chartFX贡献一些改进，这里有一些说明，介绍如何获取源代码并使用命令行maven或eclipse进行编译。

命令行Maven

只需克隆仓库并从顶级目录运行maven。exec:java目标可用于执行样例。 Maven使用相应的选项调用java，以使JavaFX正常工作。由于项目的设置方式，只有chartfx-samples项目中的类可以通过这种方式启动。

git clone
cd chart-fx
mvn compile install
mvn exec:java

Eclipse

以下内容已在eclipse-2019-03上测试，并使用m2e maven插件。其他版本或IDE可能类似工作。使用Import -> Existing Maven Project导入仓库。这应该会导入父项目和四个子项目。不幸的是，由于chartfx不使用jigsaw模块系统，而javafx使用，使用"run as Java Application"运行样例将导致错误，抱怨缺少JavaFX运行时。作为解决方法，我们包含了一个小型辅助类LaunchJFX，可以用"run as Java Application"调用，它会启动样例应用。它接受类名作为参数，所以如果你编辑运行配置并将${java_type_name}作为参数，它将尝试启动在项目资源管理器中选择的类作为JavaFX应用。

JavaFX jvm命令行选项

如果你无法使用前两种方法，也可以手动指定模块系统的访问规则作为jvm标志。将以下内容添加到java命令行调用或IDE的运行配置中，使所需模块可用并可被chartfx访问：

--add-modules=javafx.graphics,javafx.fxml,javafx.media
--add-reads javafx.graphics=ALL-UNNAMED
--add-opens javafx.controls/com.sun.javafx.charts=ALL-UNNAMED
--add-opens javafx.controls/com.sun.javafx.scene.control.inputmap=ALL-UNNAMED
--add-opens javafx.graphics/com.sun.javafx.iio=ALL-UNNAMED
--add-opens javafx.graphics/com.sun.javafx.iio.common=ALL-UNNAMED
--add-opens javafx.graphics/com.sun.javafx.css=ALL-UNNAMED
--add-opens javafx.base/com.sun.javafx.runtime=ALL-UNNAMED
--add-exports javafx.controls/com.sun.javafx.scene.control.behavior=ALL-UNNAMED

由于这些参数可能会随依赖项更新而改变，并根据项目设置方式的不同，如果遇到模块可访问性问题，请查看以下资源：

扩展chartfx

如果你发现缺少某些功能或无法访问特定的图表内部，通常的做法是实现自定义插件或渲染器。

插件是向chart-fx添加新可视化和交互功能的简单方法。实际上，chart-fx的许多功能（如缩放、数据编辑、测量）都是作为插件实现的，正如你在样例应用中看到的那样。你的插件可以直接扩展ChartPlugin或扩展任何内置插件。 Plugin Base类通过getChart()提供对图表对象的访问。你的插件应始终向chartProperty添加监听器，因为创建时不会有关联的图表，所以在创建时调用例如getChart()将返回null。使用自定义插件归结为通过chart.getPlugins().add(new MyPlugin())将其添加到图表中。如果你编写的插件可能对chart-fx的其他用户有用，请考虑对chart-fx进行pull请求。

渲染器是实际执行将图表组件绘制到画布上的重要组件。可以使用chart.getRenderers().add(...)向图表添加多个渲染器有些渲染器可视化实际数据，如ErrorDataSetRenderer，它也是默认添加到新图表的渲染器。这些渲染器对添加到图表的所有DatasSets（chart.getDatasets.add(...)）以及添加到渲染器本身的数据集进行操作。根据经验，如果你需要可视化大量数据点或想在图表本身后面绘制内容，就需要实现自定义渲染器。