Comments (8)
how to change the background?
from react-3d-viewer.
how to change the background?
yes how to ?
from react-3d-viewer.
You can pass a property "background" to model. For example <OBJModel {...props} background="rgba(0,0,0)" />
from react-3d-viewer.
rgba doesn't work cause three needs another param to set alpha: true
from react-3d-viewer.
Add support pls for transparent background
from react-3d-viewer.
Gotta bundle the scripts outside of node modules and into my project in order to pass a param to set alpha true.
Would love to have these props:
background="rgba(0,0,0,0)" alpha={true}
And
In model.js Line 242 : this.renderer.setClearColor(new THREE.Color(background, alpha));
from react-3d-viewer.
the alpha must be set en the WebGLRenderer instance in conjunction with the setClearColor() function:
So it should look like this
const { width, height, antialias, background, alpha } = this.props; this.renderer = new THREE.WebGLRenderer({ antialias, alpha: alpha }); this.renderer.setClearColor(background, 0);
from react-3d-viewer.
the alpha must be set en the WebGLRenderer instance in conjunction with the setClearColor() function:
So it should look like this
const { width, height, antialias, background, alpha } = this.props; this.renderer = new THREE.WebGLRenderer({ antialias, alpha: alpha }); this.renderer.setClearColor(background, 0);
Hey, I'm racking my brains trying to get this to work
I'm bundling the code outside of the node modules, looks like:
var { width, height, antialias, background, alpha } = this.props;
this.scene = new THREE.Scene();
this.camera = new THREE.PerspectiveCamera(45,width/height,.1,8888);
this.renderer = new THREE.WebGLRenderer({antialias, alpha: alpha});
this.renderer.setClearColor(background, 0);
this.renderer.setSize(width,height);
I haven't added any new code, just modified the existing- any advice would be rad.
from react-3d-viewer.
Related Issues (20)
- 3d object is gray and not affected with tex file HOT 5
- Setting zoom level HOT 1
- WebpackError: ReferenceError: window is not defined HOT 2
- Failed to load Resource (ERROR 404 not FOUND) Model cannot see
- 模型的透明没生效,MTLModel
- Dae file texture problem HOT 2
- Unable to Update Model Source With State Update
- Can we use it with react-native?
- unable to show the file HOT 2
- THREE.GLTFLoader: Unknown extension "KHR_texture_transform" HOT 1
- How to access model meshes etc
- Setting width by percentage
- 20 MB OBJ file not loading.
- 请问能设置背景图片吗?或者让整个渲染器透明?
- Initial zoom and max/min zoom level?
- Cross Origin with textures
- THREE.OBJLoader: Unexpected line: "<!DOCTYPE html>" HOT 8
- How to use Gltf viewer HOT 1
- r.setValue is not a function error in production HOT 15
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-3d-viewer.