开发者 |
Matteo Bruni
matteobruni |
---|---|
更新时间 | 2023年12月26日 19:19 |
捐献地址: | 去捐款 |
PHP版本: | 7.0 及以上 |
WordPress版本: | 6.1 |
版权: | GPL-2.0-or-later |
版权网址: | 版权信息 |
/wp-content/plugins/wordpress-particles
directory, or install the plugin through the WordPress plugins screen directly.load
methods to keep only a single one using a single object
parametershape.image
, shape.polygon
, shape.stroke
particles section
, not in the shape
objectshape.options
object@tsparticles/angular
): https://github.com/tsparticles/angular (v3 under development)@tsparticles/astro
): https://github.com/tsparticles/astro (v3 under development)@tsparticles/ember
): https://github.com/tsparticles/ember (v3 under development)@tsparticles/inferno
): https://github.com/tsparticles/inferno (v3 under development)@tsparticles/jquery
): https://github.com/tsparticles/jquery (v3 under development)@tsparticles/lit
): https://github.com/tsparticles/lit (v3 under development)@tsparticles/preact
): https://github.com/tsparticles/preact (v3 under development)@tsparticles/react
): https://github.com/tsparticles/react (v3 under development)@tsparticles/riot
): https://github.com/tsparticles/riot (v3 under development)@tsparticles/solid
): https://github.com/tsparticles/solid (v3 under development)@tsparticles/svelte
): https://github.com/tsparticles/svelte (v3 under development)@tsparticles/vue
): https://github.com/tsparticles/vue (v3 under development)@tsparticles/webcomponents
): https://github.com/tsparticles/webcomponents (v3 under development)@tsparticles/wordpress
): https://github.com/tsparticles/wordpress (v3 under development)@tsparticles/preset-<name>
#3977)@tsparticles/
organization in the package name, replacing tsparticles-
prefix, except for tsparticles
package which will remain the same.@tsparticles/slim
bundle, only included in @tsparticles/all
.@tsparticles/slim
bundle, included in tsparticles
.@tsparticles/slim
bundle.@tsparticles/basic
: minimum plugins for having circular dots moving in the canvas, common package for all bundles, and presets after this is released. Packages included:@tsparticles/engine
@tsparticles/move-base
@tsparticles/shape-circle
@tsparticles/updater-color
@tsparticles/updater-opacity
@tsparticles/updater-out-modes
@tsparticles/updater-size
@tsparticles/all
: a package that includes all the plugins, it's not a best practice to use this, but the easiest way for trying every feature available for sure. It will be used mainly in the website.console.log
mistakenly left in the code.no-console
rule, to avoid other issues likes #5003, getLogger
must be used when needed some logs.setLogger
and getLogger
functions work?
If you want to customize the log of tsParticles
you can call setLogger(logger)
function, passing a ILogger
object.
The setLogger
function prevents undefined
properties assigning the default one.
ts
setLogger({
debug: console.debug,
error: console.error,
info: console.info,
log: console.log,
verbose: console.log,
warning: console.warn,
});
This assigns all the log functions console functions, but you can use empty functions (() => {}
) to disable every function.
If there's a console.log
left like in #3552, #3528 or #5003, you can disable the log
property of the setLogger
parameter to get rid of it, so you don't have to wait the next release.
The getLogger
function, returns the object set using setLogger
, every plugin MUST use getLogger()
for logging things, so mistakes can be fixed easily, even errors can be muted or redirected to your favorite logging platform.
If you want to log something use this code:
ts
getLogger().log("tsParticles is awesome");
= 2.10.0
New Features
widthFactor
valueopacity
, size
, color
, stroke
), closes #4985ICoordinates
typesng-particles
): https://github.com/tsparticles/angularastro-particles
): https://github.com/tsparticles/astroember-tsparticles
): https://github.com/tsparticles/emberinferno-particles
): https://github.com/tsparticles/infernojquery-particles
): https://github.com/tsparticles/jquerylit-tsparticles
): https://github.com/tsparticles/lit (WIP)preact-particles
): https://github.com/tsparticles/preactreact-particles
): https://github.com/tsparticles/reactriot-particles
): https://github.com/tsparticles/riotsolid-particles
): https://github.com/tsparticles/solidsvelte-particles
): https://github.com/tsparticles/sveltevue2-particles
): https://github.com/tsparticles/vue2vue3-particles
): https://github.com/tsparticles/vue3web-particles
): https://github.com/tsparticles/webcomponentswordpress-particles
): https://github.com/tsparticles/wordpressconfetti
function from the preset, this bundle replaces this feature.Engine
object.color
and colorOffset
properties to split
options.number
value to 0
, the previous default value was meaningless. You must specify a number now, it's easier to implement emitters
plugin since you can declare just the emitters
property without specifying 0
particles. If you need any number, you declare it ignoring the default value.fill
property that is an object with color and image, closes #4882EventType
width
is mapped to area
and height
to factor
.particle.shape
now it's possible to set another option to the circle
shape, angle
. The new property accepts a number
or a { min: number; max: number }
object, when only number
it's going to be { min: 0, max: <value> }
.
This creates partial circles starting from min
to max
, both values must be specified in degrees. If this value is ignored the default value is: { min: 0, max: 360 }
(the full circle).
Examples
...
shape: {
type: "circle",
options: {
circle: {
angle: 180
}
}
}
...
This examples creates horizontal half circles
...
shape: {
type: "circle",
options: {
circle: {
angle: { min: 90, max: 270 }
}
}
}
...
This examples creates vertical half circles
Density options
The density options are changed a bit, instead of area
/factor
values, the width
/height
values are introduced and mapped respectively. The default values are changed to width
1920
and height
1080
, so on a FullHD resolution on device pixel ratio 1
the particles number is the one specified in the options. Since width
and height
are multiplied together, they can be swapped and nothing changes.
The formula for the density is:
(canvasWidth * canvasHeight) / (densityWidth * densityHeight * devicePixelRatio^2)
Notes on existing configurations
Since many configs had a density.area
value of 800
, you'll see less particles, just a few less. If you have also a factor
value, you won't notice any difference. When only area
is set, if you want to keep the previous configuration, set factor
to 1000
. Since the default factor
(height
) value is 1080
now, the difference should be barely noticeable.
2.6.0
Bug Fixes
reset
method to updaters, this method will be called after a particle loses a life.fullScreen
option is enabled (default behavior)aria-hidden="true"
to canvas element, fixes #4785absorb.speed
option to collisions
sectionrgb()
, hsl()
and hsv()
values in color option valuesinitAsync
function from plugins, standard init
is now async for all pluginstsparticles
package, this is a breaking change only for those that are using it. Since it's a heavy plugin and not so much used, I have preferred removing it from the tsparticles
package.