0.1.8 • Published 5 years ago
particia v0.1.8
particalizor-5000
original | particalized-5000 |
---|---|
settings used to create the example image above
import React from "react";
import MovingPicture from "particalizor-5000";
import testImage from "./testImage.png";
export const MovingPictureApp: React.FC<IMovingPictureAppProps> = ({}) => {
return (
<MovingPicture
imageSource={testImage}
particleNumber={700}
particleTraceWidth={2}
particleLifeTime={7000}
particleVelocity={0.5}
directionChannel={"saturation"}
hueChannel={"blue"}
/>
);
}
api
property | type | required | default | description |
---|---|---|---|---|
imageSource | string | yes | -- | source of the image, either imported image (.png, .jpg), either base64 representation |
particleNumber | number | no | 7000 | number of particles |
particleTraceWidth | number | no | 1 | width of a particle trace |
particleLifeTime | number | no | 700 | lifetime of a particle |
particleVelocity | number | no | 0.5 | velocity of particles |
directionChannel | string | no | "hue" | enum of {"red","green","blue","hue","saturation","light"} |
hueChannel | string | no | "blue" | enum of {"red","green","blue","hue","saturation","light"} |
directionReverse | boolean | no | false | reversed direction |
hueReverse | boolean | no | false | reversed hue |
randomizeSettings | boolean | no | false | randomize properties that are not passed in |
example usage
import React from "react";
import MovingPicture from "particalizor-5000";
import testImage from "./testImage.png";
export const MovingPictureApp: React.FC<IMovingPictureAppProps> = ({}) => {
return (
<MovingPicture
imageSource={testImage}
/>
);
}
copyright and license
MIT License Copyright (c) 2019 Artem Alagizov