Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Maya exported json file not able to play animation and display multiple texture

See original GitHub issue

Hi Devs, I am trying to display a 3D model using .json file with the help of JSONLoader, but it display only black screen. I have exported .json from ‘maya exporter plugin’. I want to load all its texture from json file only. I have tried several ways but still result is far away? I have spend lots of time on Google, Stack Overflow, Clara.io but not getting any relevant answer. I already added this issue on SO, but not found any solution. Here it is link :

I am being confused that is it possible to render maya exported json with Three.js till current release or not. Please help me to sort out this issue.

Here it is my json file: new-heart.txt

Here it is my json (material array):

"materials": [{
        "opacity": 0.0, 
        "mapDiffuseRepeat": [1, 1], 
        "mapNormalFactor": 1, 
        "depthTest": true, 
        "colorDiffuse": [0.5, 0.5, 0.5], 
        "vertexColors": false, 
        "blending": "NormalBlending", 
        "mapDiffuseAnisotropy": 4, 
        "shading": "Lambert", 
        "transparent": true, 
        "depthWrite": true, 
        "mapNormalRepeat": [1, 1], 
        "mapNormalWrap": ["repeat", "repeat"], 
        "DbgName": "Arota", 
        "mapNormalAnisotropy": 4, 
        "mapNormal": "Heart_Arota_NM.jpg", 
        "mapDiffuseWrap": ["repeat", "repeat"], 
        "mapDiffuse": "Heart_Arota_Diffuse.jpg"
    }, {
        "opacity": 0.0, 
        "mapDiffuseRepeat": [1, 1], 
        "mapNormalFactor": 1, 
        "depthTest": true, 
        "colorDiffuse": [0.5, 0.5, 0.5], 
        "vertexColors": false, 
        "blending": "NormalBlending", 
        "mapDiffuseAnisotropy": 4, 
        "shading": "Lambert", 
        "transparent": true, 
        "depthWrite": true, 
        "mapNormalRepeat": [1, 1], 
        "mapNormalWrap": ["repeat", "repeat"], 
        "DbgName": "Full_Heart1", 
        "mapNormalAnisotropy": 4, 
        "mapNormal": "Full_Heart_NM.jpg", 
        "mapDiffuseWrap": ["repeat", "repeat"], 
        "mapDiffuse": "Full_Heart_Diffuse.jpg"
    }]

Here it is my code:

var jsonloader = new THREE.JSONLoader( manager ); 
jsonloader.load( jsonFileName, function( geometry, materials ) { 
    mesh = new THREE.Mesh(geometry, new THREE.MultiMaterial(materials)); 
    scene.add( mesh ); 
} );

Here it is my screen shot:

black-screen

Description of the problem

Three.js version

Browser

All of them
Chrome
Firefox
Internet Explorer

OS

All of them
Windows
Linux
Android
IOS

Hardware Requirements (graphics card, VR Device, …)

Issue Analytics

State:
Created 7 years ago
Comments:8 (2 by maintainers)

Top GitHub Comments

1reaction

Mugen87commented, Dec 27, 2017

@samiasultan Please don’t post your help request here. Use the forum or stackoverflow instead.

0reactions

samiasultancommented, Dec 28, 2017

hi i uploaded model in blender and used three.js plugin in blender to convert it into json file. but it does not appear in web page. (black screen). i used three.js for this purpose. Please help me out. Here is my code.

<html>
<head>
<script src="three.js"></script>
<script src="three.min.js"></script>
</head>
<body>
<script>
var camera, scene, renderer;
var geometry, material, mesh;

init();
animate();

function init() {

	camera = new THREE.PerspectiveCamera(35, window.innerWidth / window.innerHeight, 0.01, 1000 );
	camera.position.z = 1;

	scene = new THREE.Scene();
  
	renderer = new THREE.WebGLRenderer( { antialias: true } );
	renderer.setClearColor(0*000000);
	renderer.setSize( window.innerWidth, window.innerHeight );
	document.body.appendChild( renderer.domElement );
	
	var light= new THREE.AmbientLight(0*ffffff , 0.5);
	scene.add(light);
	
	var light2= new THREE.PointLight(0*ffffff , 0.5);
	scene.add(light2);
	
	var loader= new THREE.JSONLoader();
	loader.load('untitled.json', handle_load);
	
	function handle_load(geometry, material){
	   var mesh= new THREE.mesh(geometry, material);
	   scene.add(mesh);
	   mesh.position.z = -10;
	   
	}
	
	function render(){
	   renderer.render(scene, camera);
	   requestAnimationFrame(render);
	}
	
	render();
}


</script>

</body>
</html>

Top Results From Across the Web

Maya exported json file not able to play animation and display ...

I am working with three.js (latest version r82) and want to display maya 2016 exported json models on webpage. I have tried MultiMaterial...

FBX Troubleshooting - Maya - Autodesk Knowledge Network

Textures disappear from files when if you move or delete any texture from the relative and absolute paths of the associated media files...

Animation not loading properly - PlayCanvas Forum

I upoload a .dae file, which brings a .json file, a texture and an animation. This same file runs well when imported to...

Exporting Unreal Engine Content to glTF

You can also export glTF files from the Editor using Blueprint, ... When enabled, the glTF exporter does not export floating-point-based JSON properties ......

Export formats - Keyshot Manual

It can also be used with AR viewers mainly on Windows and Android. The glTF format will bake materials and textures in a...