- xml - AJAX/Jquery XML 解析
- 具有多重继承的 XML 模式
- .net - 枚举序列化 Json 与 XML
- XML 简单类型、简单内容、复杂类型、复杂内容
我知道 OrbitControls.js
有一个damping 功能,它增加了全景图的平滑拖动,也称为缓动。我想实现相同的功能但不使用这个库。原因是我需要减少使用的代码量并更严格地控制鼠标或点击事件。
我构建这个 Plunker 是为了展示我用作全景 View 入门项目的演示。
https://plnkr.co/edit/eX2dwgbrfNoX9RwWaPaH?p=preview
在这个演示中,鼠标坐标被转换为纬度/经度,这将调整相机位置。这是来自 three.js 网站的最基本、最小的全景示例。
当我在 OrbitControls.js
( see this line ) 中玩弄阻尼时,我无法完全获得相同的平滑行为 - 交互导致全景图跳来跳去:
if ( scope.enableDamping === true ) {
sphericalDelta.theta *= ( 1 - scope.dampingFactor );
sphericalDelta.phi *= ( 1 - scope.dampingFactor );
panOffset.multiplyScalar( 1 - scope.dampingFactor );
}
我不相信我能完全理解如何将它应用到我在 Plunker 中的示例。
任何人都可以指导我在正确的方向上将阻尼
应用于我的 Plunker 示例吗?
更新:
我通过为经度和纬度添加新的增量值来取得进展:请参阅更新的 Plunker 中的 latDelta
和 lonDelta
。我了解它在 OrbitControls.js
中的工作原理。由于 lonDelta = 0.35
,您现在可以在初始页面加载时观察到理想的平滑滚动。但是,我不确定在用户鼠标滚动期间如何操作。至少我正朝着正确的方向前进。
最佳答案
你很接近!基本思想是计算出用户平移的速度,并以相同的速度继续平移。然后你可以逐渐降低速度来模拟摩擦。如果您不知道,“delta”或 d 通常表示距离。如果您可以获得用户移动的距离以及他们移动所花费的时间,那么您就可以计算速度并使用高中物理来应用它。
https://plnkr.co/edit/xgDTcdOY5ZfnoVuW599u?p=preview
这是来自 update
的重要部分:
// Get time since last frame
var now = Date.now();
var dT = now - then;
if ( isUserInteracting ) {
// Get distance travelled since last frame
var dLon = lon - prevLon;
var dLat = lat - prevLat;
// velocity = distance / time
lonVelocity = dLon / dT;
latVelocity = dLat / dT;
} else {
// old position + ( velocity * time ) = new position
lon += lonVelocity * dT;
lat += latVelocity * dT;
// friction
lonVelocity *= ( 1 - dampingFactor );
latVelocity *= ( 1 - dampingFactor );
}
// Save these for next frame
then = now;
prevLon = lon;
prevLat = lat;
关于javascript - 对全景旋转实现阻尼(惯性),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49392277/
我有一个关于滚动无休止地 self 重复的背景图像的问题。我遇到的问题是它开始很快,但很快变得越来越慢(口吃等)。这是代码: var panoramaTimeOutId = null; var pan
所以我生成了一个漂亮的全景查看器,但相机指向下方。这意味着如果我将手机像放在 table 上一样平放,它就会旋转并很好地环顾球体。我希望能够保持正常(向上)并环顾四周。这是我的代码。 我在这里使用了一
对于一个特殊的项目,我需要找到一个 API/DLL/Library 来帮助我使用该图像的一部分创建一个大图像。例如,如果有人拍摄 4 张代表他周围 360 度的照片,他将能够通过使用识别某些模式的特殊
这是我的情况。 ViewModelA { ObservableCollection ItemsA ObservableCollection ViewModelBs } 将数据上下文
两周以来,我一直在努力解决这个问题,没有使用 Pannellum,而是使用各种 Js 库,其中包括 ThreeJS,但没有成功。 Pannellum 看起来很有前途,并且已经看到它支持部分全景图(1
以前实现的全景照片的 URL 包含全景 ID,因此可以轻松地将特定全景图嵌入到 iframe 中。我似乎无法在新的 Google map 中找到 ID。有什么方法可以在不借助 Javascript 的
这开始让我烦恼,但我一定是犯了一些非常简单的错误。我目前有以下 XAML 代码: 在我需要用名称初始化文本 bl
我有一个非常奇怪的错误,对于大多数坐标,GMSPanoramaView 第二次不起作用。 (女巫 GMSPanoramaView 每次都工作 有一个坐标) By 不起作用,我的意思是它只是黑色 Vie
如果我在 VrPanoramaView 中插入 360 度图像,则图像会成功显示和旋转,但在此库中只有一次单击事件,即 panoramaView.setEventListener(new VrPano
我是一名优秀的程序员,十分优秀!