pixelDensity does not take effect
FloLech opened this issue · comments
Flo Lech commented
I have embedded shadergradient into a simple CRA. I get the settings via query generated here: https://www.shadergradient.co/customize.
Everything works fine besides the property: pixelDensity.
Here is the code of my component:
` <ShaderGradientCanvas
importedfiber={{ ...fiber, ...drei, ...reactSpring }}
style={{
position: 'absolute',
top: 0,
pointerEvents: "none",
}}
>
<ShaderGradient
control={"query"}
urlString="https://www.shadergradient.co/customize?animate=on&axesHelper=off&bgColor1=%23000000&bgColor2=%23000000&brightness=1.2&cAzimuthAngle=180&cDistance=3.6&cPolarAngle=90&cameraZoom=1&color1=%234fc4ff&color2=%23396fdb&color3=%236f46e1&destination=onCanvas&embedMode=off&envPreset=city&format=gif&fov=45&frameRate=10&gizmoHelper=hide&grain=on&lightType=3d&pixelDensity=0.1&positionX=-1.4&positionY=0&positionZ=0&range=enabled&rangeEnd=40&rangeStart=0&reflection=0.1&rotationX=0&rotationY=10&rotationZ=50&shader=defaults&type=plane&uDensity=1.3&uFrequency=5.5&uSpeed=0.4&uStrength=4&uTime=0&wireframe=false"
/>
</ShaderGradientCanvas>`
How can I get around this?
ruucm commented
you should put pixelDensity
prop to the ShaderGradientCanvas
component.
<ShaderGradientCanvas style={{ position: 'absolute' }} pixelDensity={0.1}>
<Gradient />
</ShaderGradientCanvas>