javascript - 使用 THREE.js TransformControls
问题描述
我正在尝试在我正在创建的 JSBin 项目中使用三个 TransformControls 类。不幸的是,我不能分享我的整个代码。但是,我的 JS 代码在<script type="text/javascript"></script>
HTML 标记中。我所有的导入都由<script src=""> </script>
HTML 标签处理。我尝试了 TransformControls 类的各种源 URL,但均无济于事。
我已经使用以下方法导入了模块: <script src="https://threejs.org/examples/js/controls/TransformControls.js"></script>
但是一旦创建新的 TransformControls 对象,我就会不断收到“脚本错误。(第 0 行)”。
这是我的 TransformControls 代码:
var tC= new THREE.TransformControls(camera, renderer.domElement); // this line causes the error
var cC = new THREE.OrbitControls(camera, renderer.domElement); // camera controls works
tC.addEventListener( 'mousemove', render );
我究竟做错了什么?
免责声明:我对 JavaScript 和三个都非常陌生
解决方案
在您的脚本标签中添加跨域
代码(将在 jsbin 中工作):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r121/three.min.js" crossorigin="anonymous"></script> //<----here
<script type="text/javascript" src="https://threejs.org/examples/js/controls/TransformControls.js" crossorigin></script> //<----here
</head>
<body>
<canvas id="myCanvas"></canvas>
<script>
//import {TransformControls} from "https://threejs.org/examples/jsm/controls/TransformControls.js";
var tC= new THREE.TransformControls(); //<-- not a complete code just for understanding
</script>
</body>
</html>
其他有用的文章:
- https://github.com/getsentry/sentry-javascript/issues/223
- 神秘的“脚本错误”。在 Chrome 和 Firefox 中以 Javascript 报告
只是为了知识:
runner-4.1.8.min.js:1 THREE.TransformControls:作为过渡到 ES6 模块的一部分,“examples/js”中的文件已于 2020 年 5 月 (r117) 弃用,并将于 2020 年 12 月 (r124) 删除. 您可以在https://threejs.org/docs/#manual/en/introduction/Installation中找到有关使用 ES6 模块进行开发的更多信息。
利用
https://threejs.org/examples/jsm/controls/TransformControls.js
推荐阅读
- ansible - Ansible 嵌套定义和引用问题
- nuxt.js - 检查用户是否在初始请求中通过身份验证
- c++ - 如何将 CMAKE_BUILD_TYPE 传播到通过 add_subdirectory 包含的子库?
- c++ - 如何使用 boost asio 内置的协程 ts 支持?
- python - 为什么相同的请求会在两台机器上导致不同的状态码 200 和 429?
- r - ggplot中的分面网格,R
- c++ - c++中的常量方法和常量对象
- wpf - 如何将单选按钮的切换按钮更改为 wpf 中的图像(用于分组单选按钮)?
- python - 函数中未赋值的表达式
- java - JAVA:在发送电子邮件时尝试显示加载屏幕框架