0

我将开始一个需要自定义图表和图形的新项目。我将为存储在云中的大量数据构建特殊的趋势、分析和甘特图。

过去我使用 D3/Raphael/Ant + JQuery，但现在我正在转向移动和 React。据我所知，svg tas是DOM标签作为HTML标签，所以我的第一印象是React会正常处理。我也听说过 Tiny SVG，它是移动 SVG 的一个子集，所以我的疑惑是：

a) React 和 React Native 能否与 SVG 一起正常工作？使用它有限制吗？

b) 2013 年推出的 Tiny SVG 规范应该是什么？

c) 在较旧的浏览器中，通常不支持 SVG。在桌面应用程序中，我使用了带有 javascript 的 Raphael，但是 React 和 React Native 呢？

d) React 和 React Native 是否支持 D3 进行数据操作？

e) React 和 React Native 环境是否支持 Raphael？

f) React 和 React Native 环境是否支持 Ant？

g) 应用程序性能如何，如果是 D3、Raphael 或 Ant、React 或 React Native 的堆栈，特别是在移动环境中？

如果有用于 React 或 React Native 的最佳实践或所需的堆栈，我很想听听。

4

2 回答 2

4

a) 是的，React 和 React-native 使用 SVG 非常有效。React-Native 有它自己的 ART 库，您可以导入它来创建图形，但它仍在开发中。

b) 在 React 和 React Native 中，一切都是组件。所以使用 Tiny SVG 并不是一个好主意。

c) 生成 SVG 有很多可能的选项。您可以从 react-native 本身导入 ART，但正如我提到的它仍在开发中，我最喜欢的是 'react-native-svg'。易于使用且维护良好的包装。

d) 是的，两者都支持 D3。但不是原始的 D3，因为它缺少组件系统。您需要改用react-d3，因为它已经实现了组件。它是用于从头开始操作图表的最强大和可定制的库之一。对于实施，您可以在此处查看我的 react-native 项目，其中我使用了 reat-native-svg 和 react-d3。

e) 可以使用 react-raphael。

f) 是的，支持 Ant。看看“Ant Design of React”。

g) 没有使用过 Raphael 或 Ant，但我可以向你保证 react-d3 在原生环境中工作得很好！

于 2017-06-17T07:25:28.587 回答
0

a) 有限制。React Native 使用 react native art，它不能像 web 上那样接受普通的 svg。此外，它可以创建的 svg 只是视图，而不是您习惯的可扩展向量。然而，有些库可以将复杂的 svg 编译到本机视图中。

c) react native 中 svg 的多种解决方案，我见过的一个是https://github.com/react-native-community/react-native-svg。

d) 不支持 d3js，因为它不使用本机视图。经验法则是，如果它具有基于 Web 的 ui，它将无法与 react native 一起使用。如果它只是 javascript 即 lodash 它将工作。

e) 见 d

g）根据我的经验，svgs 在本机反应中存在内存泄漏，这可能会导致性能问题。他们可能已经在较新的版本中修复了这个问题。我最近使用的是 0.40

于 2017-06-16T22:14:31.387 回答