收藏
回答

小程序中引入threejs中的WebGLRenderer方法后报错?

这里我是用的 import * as THREE from 'three-platformize';库

当我引入renderer = new THREE.WebGLRenderer();时出现以下错误

请问有对应的解决方法吗

回答关注问题邀请回答
收藏

2 个回答

  • Southern Wind
    Southern Wind
    2023-07-10
    <template>
    	<view class="content">
    		2
    		{{renderer}}
    	</view>
    </template>
    
    
    <script setup>
    	import * as THREE from 'three-platformize';
    	import {
    		OBJLoader
    	} from 'three-platformize/examples/jsm/loaders/OBJLoader';
    	import {
    		GLTFLoader
    	} from 'three-platformize/examples/jsm/loaders/GLTFLoader';
    	import {
    		OrbitControls
    	} from 'three-platformize/examples/jsm/controls/OrbitControls';
    	import {
    		ref,
    		reactive,
    		computed,
    		onMounted,
    		getCurrentInstance,
    		nextTick,
    	} from 'vue'
    	var camera, scene, renderer;
    	var geometry, material, mesh;
    	let innerWidth = ref(123);
    	let innerHeight = ref(123);
    	console.log(THREE);
    	let currentInstance = getCurrentInstance();
    	const query = uni.createSelectorQuery().in(currentInstance);
    	
    	query.select('.content').boundingClientRect(data => {
    		console.log("得到布局位置信息" + JSON.stringify(data));
    		console.log("宽" + data.width);
    		console.log("高" + data.height);
    		innerWidth.value = data.width;
    		innerHeight.value = data.height;
    		init(innerWidth.value,innerHeight.value)
    	}).exec();
    	function init(innerWidth,innerHeight){
    		scene = new THREE.Scene();
    		scene.background = new THREE.Color(0x000000);
    		 camera = new THREE.PerspectiveCamera(
    		      60,
    		      innerWidth / innerHeight,
    		      0.1,
    		      1000
    		    );
    		    // 相机坐标
    		    camera.position.set(200, 200, 200);
    		    // 相机观察目标
    		    camera.lookAt(scene.position);
    	 // 渲染器
    
    
    	 renderer = new THREE.WebGLRenderer();
    	 console.log(renderer);
    	}
    
    
    
    
    </script>
    
    
    <style>
    </style>
    
    

    到下面这个位置就报错了,用的是V3版本

    renderer = new THREE.WebGLRenderer();
    console.log(renderer);
    

    2023-07-10
    有用
    回复 1
    • 云阣
      云阣
      2023-07-10
      new THREE.WebGLRenderer() 传一下 canvas 参数试一下
      2023-07-10
      回复
  • 云阣
    云阣
    2023-07-10

    请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

    2023-07-10
    有用
    回复
登录 后发表内容