- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有两个查询,我正在我的 React 应用程序中实现 tsParticles。第一个:.
<Particles
id="tsparticles"
options={{
background: {
color: {
value: "black",
},
},
fpsLimit: 60,
interactivity: {
detectsOn: "window",
events: {
onClick: {
enable: true,
mode: "push",
},
onHover: {
enable: true,
mode: "trail",
},
resize: true,
},
modes: {
bubble: {
distance: 400,
duration: 2,
opacity: 0.8,
size: 40,
},
push: {
quantity: 4,
},
repulse: {
distance: 200,
duration: 0.4,
},
},
},
particles: {
color:{
animation:{
enable:true,
speed:50,
},
value:"#f00"
},
links: {
shadow:{
blur:true,
color:"#00ff00"
},
triangles:{
frequency: 1
},
color: "random",
distance: 150,
enable: true,
frequency:1,
opacity: 0.5,
width: 1,
},
collisions: {
enable: true,
},
move: {
angle:{
offset: 45,
value: 90
},
attract:{
rotate:{
x:3000,
y:3000
}
},
gravity:{
acceleration: 9.81,
enable:false,
maxSpeed:1
},
direction: "none",
enable: true,
outMode: "bounce",
random: false,
speed: 6,
straight: false,
},
number: {
density: {
enable: true,
value_area: 1000,
},
value: 80,
},
opacity: {
value: 0.5,
},
shape: {
type: "circle",
},
size: {
random: true,
value: 5,
},
},
detectRetina: true,
}}
/>
里面有一段onHover和mode的键值。它有8种不同的模式,可以在https://particles.matteobruni.it/中查看。 .所有其他模式都可以正常工作,但当我使用此代码时使用跟踪模式,我是否缺少粒子组件的其他一些属性?
第二个:还,我有两个 div,一个用于粒子,另一个用于显示在它上面的文本。我使用 z-index 和位置实现了这一点。
我需要 Canvas 高度是动态的,无论屏幕大小如何,它都占据其父元素的 100% 高度。我尝试通过将 Particles 组件包含在 div 中并将其高度保持为 100% 来实现此目的,但 Canvas 高度会随着屏幕尺寸的减小而减小。
请帮助我,谢谢:)
最佳答案
哇,这里有很多问题要回答,但我会尽力而为。
鼠标轨迹需要更多配置,在modes
节interactivity
你必须配置 trail
部分。
您可以在此处查看示例:https://codepen.io/matteobruni/pen/abdpbBY
如果您需要更多文档,请查看文档中的正确部分:https://particles.js.org/interfaces/_options_interfaces_interactivity_modes_itrail_.itrail.html
如果您需要动态 Canvas 大小,最好的解决方案是使用 backgroundMode
在选项根对象中
您可以在此处查看示例:https://codepen.io/matteobruni/pen/MWeqxNL
如果启用后台模式设置 canvas
风格与 fixed
位置和所需的 zIndex
如果您使用 backgroundMode
, 在不为包含 div
设置任何样式的情况下获得更好的结果(tsParticles 目标/容器)
关于javascript - 悬停事件的轨迹模式在 tsParticles 中不起作用(类似于 particlejs),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65195973/
我有一系列 gps 值,每个值包含:timestamp, latitude, longitude, n_sats, gps_speed, gps_direction, ... ( NMEA data
我正在尝试绘制两点之间的轨迹路径。我只知道有问题的两点和它们之间的距离。我希望能够计算的是到达终点所需的速度和角度。 我还希望能够将一些重力和风因素考虑在内,这样路径/轨迹就不那么“完美”了。它用于电
有没有人对使用顶点缓冲区/4f 颜色缓冲区绘制粒子在 opengl 中对来自喷气发动机(带有加力燃烧室)的粒子流进行编码的近似值有任何指导? 我认为这个问题有两个方面: 作为温度和与燃烧的气体类型相关
问题 我正在迁移多个 ggplot/ggvis plotly 到 plotly在 shiny应用。我遇到了一个关于跟踪链接的问题。我希望能够通过 group 显示/隐藏痕迹在图例上,在相关数据框之间共
我想为玩具车在没有障碍物的平面 (2d) 上规划一条路线。玩具车应该从点 (p1x,p1y) 移动到 (p2x,p2y)(又名狄利克雷边界条件)。此外,玩具车在起点的速度是(v1x,v1y),终点处要
我正在开发一个路径/ map 应用程序,该应用程序在一个区域中绘制了自定义路径,并将帮助用户在“森林”区域的一些路径周围导航。 目前,我正在使用 MKMapView 来获取用户数据/位置,并从 KML
我目前正在尝试根据从 iPhone 视频中拍摄的一系列图像重建坠落物体(例如球或石头)的 3D 轨迹。 我应该从哪里开始寻找?我知道我必须校准相机(我想我会使用 Jean-Yves Bouguet 的
我正在尝试使用 matplotlib 在 map 上绘制 CSV 文件中的线条和标记。 数据: AL99,2017080912,SHIP,0,17.1,-55.6,25,0 AL99,20170809
我正在尝试仅使用广播源来重建篮球的 3D 轨迹。 为此,我必须计算单应矩阵,因此在每一帧中,我都成功地跟踪了球,以及它们在“现实世界”中的位置已知的 6 个点(4 个在球场上,2 个在篮板上)为在图片
如果我有一个像这样的动画圈 example , 有没有一种方法可以在 Canvas 上留下 1px 纯白色的永久痕迹? 我试过动态构建路径,但无法让它工作。 提前致谢,如有任何帮助,我们将不胜感激 最
正在工作,即将发布,没有真正的更新,[6.3.2] 突然出现此错误。 花了一天时间在 OAuthSwift V0.3.4、0.3.5、0.3.6 之间切换,同样的错误发生了。还有一次(但非常罕见),我
我正在尝试使用 matlab/octave 为这个螺旋制作动画我希望它向上或向下螺旋 t = 0:0.1:10*pi; r = linspace (0, 1, numel (t)); z = lins
我有一个有点难的算法问题,我从很多搜索中找不到任何合适的算法,所以我希望 stackoverflow 上的人可能知道答案。 我有一组车辆在 2D 空间中移动时的 x,y 坐标,坐标记录在时间段内的“决
在服务器(MySQL 或 Oracle 或任何文件)上存储 GPS 坐标(航迹)的最佳方式是什么?例如,GoogleMaps 是如何实现的?我想保存和比较相同部分的轨道。 附言我有所有必要的数据。 最
The link to download the GPS traces on OSM is quite easy to get. 但是,里面的每个文件都 super 大。而且也没有地理位置分类。所以我
这个问题与地理空间信息系统的知识有些重叠,但我认为它属于这里而不是 GIS.StackExchange 有很多应用程序处理具有非常相似对象的 GPS 数据,其中大多数由 GPX standard 定义
我正在使用此处找到的 locu-node node.js 库:https://github.com/Locu-Unofficial/locu-node ,这是 Locu 服务的 API 客户端。在提供
我正在尝试将一个元素从位置 A 动画到位置 B,但我不希望它在每个点之间线性移动,我希望有一种“抛物线”轨迹。 我可以使用 jQuery.animate() 吗? 或者我应该使用 setInterva
总结:如何避免不同线程的不同工作负载导致的性能损失? (内核在每个线程上都有一个 while 循环) 问题:我想在许多不同的初始条件下使用 Runge-Kutta 求解粒子轨迹(由二阶微分方程描述)。
我正在创建一个应用程序,其中包含一些变量的区域数据。该应用程序允许您通过 selectInput 选择用户想要可视化的区域。出于比较/信息目的,我希望用户在 plot_ly 中可视化所选区域以及全国平
我是一名优秀的程序员,十分优秀!