问题标签 [react-native-svg]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
960 浏览

react-native - react-native-svg-charts Areachart 渲染了一个额外的底线

我正在使用 react-native-svg-charts 来渲染一些图表。就我而言,我使用面积图(见下图)。当最后一个数据条目具有相同的值时,会出现一条底线

实际的

预期的

这是我渲染面积图的方式

渐变的代码如下

0 投票
1 回答
1425 浏览

reactjs - react-native-svg onPress 事件不起作用

我正在使用 react-native-svg,因为文档说可以在 svg 元素上触发 onPress 事件,但它不起作用。

然后我尝试了文档中编写的示例:

但是作为第一个它不起作用

0 投票
1 回答
1309 浏览

react-native - 在 react native 中使用 react-native-svg 时发生随机崩溃

我正在使用 react-native-svg 在 react native 中创建速度计,它工作正常,但我面临随机崩溃。这个问题在android中。crashlytics 中的问题:

“com.facebook.react.bridge.JSApplicationIllegalArgumentException:更新类型阴影节点中的属性“高度”时出错:RCTView”

“com.facebook.react.bridge.JSApplicationIllegalArgumentException:更新类型阴影节点中的属性“宽度”时出错:RCTView”

“com.facebook.react.bridge.JSApplicationIllegalArgumentException:更新类型阴影节点中的属性'marginTop'时出错:RCTView”

“com.facebook.react.bridge.JSApplicationIllegalArgumentException:更新类型阴影节点中的属性‘paddingLeft’时出错:RCTView”

如果有人可以帮助我解决问题,这对我很有帮助。谢谢。这是我的 SVG 代码。

我正在使用以下版本:

0 投票
1 回答
2987 浏览

react-native - 带有反应原生和d3的svg水平滚动

我正在尝试使用 react native svg 和 d3绘制水平可滚动条形图。我能够绘制条形图,但不知道如何使其可滚动。此外,在滚动时,我需要调用 Web 服务来获取一些详细信息。有人可以帮我吗?这是我的代码:

数据

渲染函数

}

尝试使用溢出滚动可见并尝试将整个 svg 保留在滚动视图中。那没有用。任何帮助,将不胜感激。编辑:这是它现在的可见方式:需要滚动视图来显示值直到 dec在此处输入图像描述

0 投票
1 回答
3648 浏览

react-native - 更新类型阴影节点中的属性“宽度”时出错:RNSVGsvgView

我在安装后遇到了这个错误react-native-svg。我将所有 svg 图标放在一个单独的.js文件中,并按如下方式调用它们,

根据这个解决方案,我在样式对象中给出的值只是整数。但我仍然面临这个错误。

根据这个git 解决方案,有人要求降级,有人要求升级本机反应。但不确定哪一个可以永久修复此错误。

有人可以让我知道错误的根本原因并为此永久修复。谢谢你。

0 投票
1 回答
1405 浏览

react-native - 渲染网络 SVG 图像会导致 android React-Native 的性能问题(我想避免使用 React-Native-svg-uri)

我想在 React-Native 中渲染网络图像我以前使用过 ttf 方法,效果很好,但这种方法仅用于静态图像我想用轻量级方法渲染 svg 图像,我知道一些库可用但它们在android上非常慢所以我想避免这些有什么方法可以在android上顺利渲染svg图像?

没有完美回答。

从 'reacr-native-svg-uri' 导入 Svg

我目前正在使用的这个库。

我不想使用这个库,因为这会导致 android 出现性能问题。

0 投票
3 回答
1537 浏览

react-native - 无法从“node_modules\react-native-svg\lib\extract\extractProps.js”解析“./patternReg”

我是反应原生的新手。安装新的 react-native-svg-from-uri 库后。并在我的组件中使用

运行我的应用程序时显示错误

无法从“node_modules\react-native-svg\lib\extract\extractProps.js”解析“./patternReg”。

现在如何解决这个问题?提前致谢。

0 投票
1 回答
462 浏览

react-native - React Native - 可滚动的 SVG 文本

我的目标是在屏幕上显示可滚动的 svg 文本,但我似乎无法理解如何。

首先,在尝试使文本可滚动之前,我从以下代码开始:

这是我的renderLegend功能:

上面的代码工作正常,它在页面上并排呈现 SVG 文本元素。但是,在某些情况下,我可能有很多文本元素,所以理想情况下我想让它可滚动。

当我尝试将renderLegendcontent 变量包装在 aScrollView中时,文本会从屏幕上消失:

它消失有什么原因吗?有没有办法用 SVG 文本显示到可滚动区域?

0 投票
1 回答
870 浏览

react-native - react-native-svg-charts / 具有可变条形宽度的条形图?

使用 react-native-svg-chart,我想根据可变参数调整条形宽度,但不幸的是我找不到任何例子,也找不到它。

预期结果如下: 例子

我应该使用带宽参数吗?如果正确,以哪种方式?我找不到任何说明的文档:(我应该编辑你的代码吗?不幸的是我不熟悉 d3 并且找不到正确的方法来......

0 投票
1 回答
412 浏览

react-native - 如何使用 react-native-svg 模块以编程方式将 SVG 元素添加到组件?

我在网上到处搜索有关如何使用 react-native-svg 功能在 React-Native 中创建 SVG Rect 元素的信息,但没有成功。到目前为止,我所做的是在组件中定义一些 SVG 元素,并将 props 传递给现有的 SVG 元素,如 Rect 、 Circle 等。但是如何以编程方式创建随机数量的 SVG 元素并将它们附加到组件?可悲的是,它没有在文档中指定。