【开发总结】—— BABYLON 3D开发常见问题及解决方法

【开发总结】—— BABYLON 3D开发常见问题及解决方法

前言:组内同事们根据长时间的Babylon.js开发实践,一起将项目开发中遇到的问题及解决方法做了一个梳理。


 【开发总结】—— BABYLON 3D开发常见问题及解决方法_第1张图片

  1. ios 【最好】 关闭离线缓存—— 解决添加了反射的mesh 丢失的问题
  2. 不要使用 position:fixed; —— 微信里面是不会认的
  3. 天空盒的贴图尽可能调小,防止闪退,纯色的可以设为 1*1
  4. 模型上的文字、 小图标之类,最好前端贴透明贴图,避免模型贴上不去的模糊不清
  5. 透明贴图贴不上去的情况下,可以使用GUI的img控件来贴png
  6. 当UScale和vScale等于1时,切换UV通道没有反应,可以先改变uScale,再过100毫秒切换通道,再切换回原来的uScale;
  7. 多相机layerMask的情况下,使用actionManager是没有反应的,可以使用scene.pick(x,y,pre,camera)
  8. camera.targetScreenOffset动画要stopAnimation两次才能取消
  9. input和button点击时的蓝色外边框和灰色半透明背景处理:a,button,input,optgroup,select,textarea{- webkit-tap-highlight-color:rgba(0,0,0,0);}
  10. 移动端点透问题:1)尽量使用touch事件替换click事件。 2)用preventDefault阻止a标签的click
  11. 设置小于12px的字体,可用transform:scale(0.8),进行缩放设置
  12. audio元素和video元素在ios和andriod中无法自动播放应对方案:触屏即播
    $('html').one('touchstart',function(){ audio.play() })
  13. active兼容处理即伪类:active 失效。 body添加ontouchstart
  14. GUI显示在ios 和android 显示有差异, 可以用dom来显示
  15. 贴图UV通道Material.贴图类型.coordinatesIndex=number;
  16. 翻转贴图法线mesh.flipFaces()
  17. 把mainTextureRatio略微调大点可以解决辉光闪烁的问题
    new BABYLON.HighlightLayer("dianchi", scene,{mainTextureRatio:1.5});
  18. 第一人称相机或物体开启重力在不移动的情况下回停止掉落camera._needMoveForGravity = true;
  19. 手动设置mesh层级mesh.renderingGroupId=1
  20. 视频材质的一些属性不能直接设置,需要视频加载完成后才可以,设置如下。
    var videoTexture = new BABYLON.VideoTexture("video", ["video/video3.mp4","textures/babylonjs.webm"], scene, false, false); videoTexture.video.loop=true; //无效scene.registerBeforeRender(function(){ if(videoTexture.isReady()==true){
          videoTexture.video.loop=true //有效
          } 
     })
  21. 移动端锯齿严重问题engine.setHardwareScalingLevel(0.4)
  22. 动态阴影不精确可以调下面的参数设置灯光阴影的范围和平接头
    light = new BABYLON.DirectionalLight("Dir0", new BABYLON.Vector3(10, -3, -10), scene); light.intensity = 2;
    light.position=new BABYLON.Vector3(-26.053449678125286, 4.620522808003314, 43.64921550154328)
    light.autoUpdateExtends=false; light.shadowFrustumSize=110
    shadowGenerator = new BABYLON.ShadowGenerator(4800, light); shadowGenerator.bias = 0.001; shadowGenerator.useBlurCloseExponentialShadowMap = true;
    // shadowGenerator.forceBackFacesOnly= true; shadowGenerator.depthScale=100
    //shadowGenerator.blurScale=0.6
    // shadowGenerator.frustumEdgeFalloff = 10.0; light.shadowMinZ=0
    light.shadowMaxZ=100 scene.meshes.forEach(function(mesh){ shadowGenerator.getShadowMap().renderList.push(mesh); mesh.receiveShadows = true;
    })
  23. 骨骼动画导出错乱
  • 3dsmax每个顶点支持的最多骨骼个数默认为20个,babylonjs最多支持每个顶点4个骨骼,你必须将
  • 3dsmax中的顶点最多支持的骨骼个数手动设置为4,这样就可以正常使用。
  •  参考:http://doc.babylonjs.com/exporters/bones_influences_per_vertex

 


注:本文整理只作学习,非本人允许不得转载 

posted @ 2018-11-04 20:06 柳洁琼Elena 阅读( ...) 评论( ...) 编辑 收藏

你可能感兴趣的:(【开发总结】—— BABYLON 3D开发常见问题及解决方法)