- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
对于我的论文项目,我使用 DataArts WebGL Globe 来开发一个网页,该网页将在触摸显示器上的展览中使用。作为监视器触摸,我需要使地球可点击以选择单个国家并打开弹出窗口并突出显示选定的国家。我正在使用 RayCaster 来查找触摸/点击的坐标,但是使用我的方法我获得了镜像选择(实际上,如果我点击一个点,点击会定位在地球的相反大小)。问题似乎只在 x 轴上,但我认为我犯了更多错误。整个代码和整个项目上传到http://www.pietroforino.com/globe/ , raycaster 代码位于第 660 行的 onMouseDown 函数中。 这里的代码
var raycaster = new THREE.Raycaster();
var mouse = new THREE.Vector3();
[...]
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
raycaster.setFromCamera( mouse, camera );
var intersects = raycaster.intersectObjects( scene.children );
for ( var i = 0; i < intersects.length; i++ ) {
data = intersects[i];
var d = data.point.clone().normalize();
var u = Math.round(4096 * (1 - (0.5 + Math.atan2(d.z, d.x) / (2 * Math.PI))));
var v = Math.round(2048 * (0.5 - Math.asin(d.y) / (Math.PI)));
var p = mapContext.getImageData(u,v,1,10).data;
countryCode = p[0];
for( var prop in countryColorMap ) {
if( countryColorMap.hasOwnProperty( prop ) ) {
if( countryColorMap[ prop ] === countryCode )
console.log(prop, countryCode);
}
} // end for loop
lookupContext.clearRect(0,0,256,1);
for (var j = 0; j < 228; j++)
{
if (j == 0)
lookupContext.fillStyle = "rgba(0,0,0,1.0)"
else if (j == countryCode)
lookupContext.fillStyle = "rgba(240,48,104,0.6)"
else
lookupContext.fillStyle = "rgba(0,0,0,1.0)"
lookupContext.fillRect( j, 0, 1, 1 );
}
lookupTexture.needsUpdate = true;
}
for ( var i = 0; i < intersects.length; i++ ) {
最佳答案
您的代码中存在错误。外for
循环变量 i
在内部 for
中进行了修改环形。换句话说,这里的循环变量:
for ( var i = 0; i < intersects.length; i++ )
for (var i = 0; i < 228; i++)
i
与
j
在第二个循环中应该解决这个问题。
intersects
.我想只选择离相机最近的交叉点的第一个条目就足够了。
关于three.js - WebGl Globe 上的镜像 Raycaster(球体),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59731149/
我需要制作一个像这样的 WebGL Globe: https://trends.google.com/trends/zeitgeist/2013/globe#frame=314 我已经开始使用这个例子
我使用 GADM 数据绘制了俄罗斯地区的 map : setwd("~/Desktop/Master thesis/") library(sp) library(RColorBrewer) libra
我已经能够关注 source code让我的 WebGL 地球像 the example 一样工作.我正在尝试自定义这个 Globe。我有不止一项指标需要在全局范围内展示。例如我不想只显示地球上的整个
经过长时间的搜索,我发现没有选项可以自定义标记图标。我现在尝试用两种不同类型绘制我的标记。我需要通过使用两个单独的图标来清楚地可视化它,是否有任何选项可以在 Globe 中设置自定义标记图标。更快的响
我一直在努力让 Web GL Globe ( http://code.google.com/p/webgl-globe) 正常工作。我从 Google 代码页下载源代码并将所有文件解压缩到一个文件夹中
我正在玩 WebGL Globe ( http://globe.chromeexperiments.com/ ),并希望能够用新数据“刷新”它,然后将其设置为新状态的动画。库中提供的示例没有帮助,因为
我正在开发 D3 Globe 的实现。我试图在用户单击按钮时添加到地球的路径,但事实证明这并不成功。如果我一次添加所有路径,则没有问题,但如果我尝试在触发事件后添加它们,则会失败。我的jsfiddle
我在我的程序中生成了一系列 png 图像,我计划获取的文件通过一些工具传递,将它们转换为视频文件。我正在按照我想要的正确顺序一个一个地生成文件。我想以这样的方式命名它们,以便后续的视频转换工具将在 s
如果您在 NSString 中包含 Unicode 字符,它们中的很多将采用该文本的颜色集 - 它们只是该字体的常规字形,因此它们的显示方式与其他任何字符一样特点。但是有一些 Unicode 字符是彩
我想在 planetaryJS 中添加两个功能地球仪 我想提高行星 JS 创建的地球仪的缩放速度 我怎样才能像正在生成的那样生成多个 ping here .我知道它需要一组经度和纬度,但我做不到即使是
我正在开发 WhirlyGlobe 组件测试器应用程序(mousebird 团队在 ios 中开发的地球应用程序的伟大框架)并尝试创建纬度和经度。我使用以下方法在地球上创建了经度:- (void)ad
我可以使用 Three.js 渲染 3D 地球并为其旋转设置动画,方法是使用以下链接中的教程将世界地图图像纹理添加到球体上。我打算让全局的国家都可以点击。即,每当用户单击任何国家/地区时,该国家/地区
我需要在我的网页中放置一个 3d 地球仪,我最近看到了新的谷歌地图的地球仪,这太棒了! 您可以在以下位置找到它:https://www.google.com/maps/@24.0333789,-47.
我正在尝试实现 Mike Bostock 的旋转地球仪的一个版本并覆盖国家/地区标签。这已在这里成功实现:http://bl.ocks.org/dwtkns/4686432 不幸的是,我无法隐藏应该落
你可以在给定的地球旋转链接中看到 https://codepen.io/Designer12/pen/pXxKEQ 在那里,你可以看到太多垂直和水平的蓝线,我只需要两三条线... 从脚本中,我从 中删
我们都知道http://www.chromeexperiments.com/globe/ WebGL 实验,我真的对他们在那里做了什么很感兴趣。 他们在那里所做的是根据 GPS(JSON 格式)信息在
对于我的论文项目,我使用 DataArts WebGL Globe 来开发一个网页,该网页将在触摸显示器上的展览中使用。作为监视器触摸,我需要使地球可点击以选择单个国家并打开弹出窗口并突出显示选定的国
我有一个使用 Three.js 构建的地球仪 引用:http://callumprentice.github.io/apps/globe_manipulator/index.html 我需要在特定的纬
如果这是重复的,我深表歉意(环顾四周,但我似乎找不到答案)。 假设您要将命令行属性传递给 Java 程序。例如。 -Djava.library.path=/usr/lib/jvm/java-awsom
我正试图在 python 中弄清楚如何使用 basemap 来制作这样的图: 关注左上角的图,这是每个 bin 中密度的二维直方图,图形地球覆盖在中心。 我遇到的一个大问题是, basemap 似乎不
我是一名优秀的程序员,十分优秀!