我们可以使用具有React-Native的Highcharts吗？

Question

目前我正在为我的网络应用程序使用Highcharts，但现在我正在使用react-native构建一个Android应用程序。 Highcharts是否与React-native合作。

Answer 1

HighCharts与DOM一起使用。您不能在React Native中直接使用HighCharts或图表依赖于DOM的库，但您可以在WebView中使用带有React Native的图表库。我没有专门使用High Charts，但是在WebView上使用了其他图表库，效果很好。

Answer 2

在这里你可以使用这个组件将配置json发送给组件并显示它

https://github.com/TradingPal/react-native-highcharts

Answer 3

您可以在React Native应用中使用Highcharts的两种主要方法是：

1. WebView组件。我也在其他平台（Appcelerator Titanium）上也使用了这种技术。
2. Official 用于React的最小Highcharts包装器：highcharts-react-native。
   截至目前，前提条件是：
   • 节点11.2 +
   • npm 6.7.0+或类似的程序包管理器
   • 反应16.4 +
   • 反应本机0.59.3 +

要安装：

npm install @highcharts/highcharts-react-native

  

注意：还有其他非官方包装器，例如react-native-highcharts，但我还没有使用它们。

Answer 4

您可以使用此模块：  react-native-highcharts

它使用Android或iOS上的Web引擎和Highcharts JavaScript模块来渲染动态图表。

示例：

user.cart

Answer 5

将此行添加到ChartView组件中：originWhitelist = {['']}

示例：

<ChartView style={{height:300}} config={conf} originWhitelist={['']}></ChartView>