想实现像街景地图那样的热点跳转,在网上下了一个可以通过导入全景照片自动生成的软件,但是热点的跳转太生硬,没有真实代入感,街景地图那种类似无缝连接的跳转是通过什么软件或技术实现的?
更新一下:全景照片是用相机拍摄的,在软件上显示,使用的是panorama,可以说已经实现了,只是在热点跳转上想有更深一步的追求,即实现漫游功能。
腾讯搜搜街景360度实景拍摄照片,采用户外采集设备街景推车及单点形式进行拍摄,数据采集车辆无法到达的地方由人工徒步完成,真正实现了“人视角”的地图浏览体验。实地采集然后数据录入到数据后期处理(指图像拼接、优化、压缩、匹配和切割上线)。一张 360 度角度的街景,采集下来的数据有 50M,分割上传到 Web 后约为 600K,手机上的大小控制在 200K。画面中采用了高清标准,实现对街景细节的逼真还原。
据SOSO街景地图技术人员介绍,SOSO街景地图的核心技术均采用自主技术,其中包括3D引擎、云平台存储计算及配套的图形图像技术。此外,产品在用户体验上也进行了大量创新,如白天与夜景一键切换、图像清晰度提升、移动流畅度提升、画面惯性系统等。这位技术人员还透露,考虑到目前国内用户的网络带宽,此次发布的SOSO街景地图采用的图片经过压缩,但SOSO地图已经做好了提供更好视觉效果的准备,随着网络环境的改善,未来将推出更高画面质量的街景产品进行迭代。
如果需要追求完美,建议你找专业公司进行制作
谷歌街景可能使用的是GDAL - Geospatial Data Abstraction Library
关于如何切割大型的全景图片,剋有参考如何将1.38G的JP2格式图片分割中提到的一些软件。
首先你的全景图是怎么制作的?像MAYA等3D软件都是可以制作全景图的,你使用的是什么软件,亦或是用相机直接拍摄的。如果是相机拍摄的,可以使用软件拼接生成全景图(有些手机软件可以直接拍摄生成全景的)。
其次,你需要怎么样来展示你的全景图片?使用软件来显示,还是通过网页来显示?上面提到的通过软件来拼接生成的360全景图,这些软件可以自动生成html和js代码,也可以用相关软件直接查看。可以使用360 panorama作为关键词搜索一下。比如Virtual Tour Examples
找这方面的砖家 聊聊吧
应该有专做这些的公司,费点钱估计能办到,C币吸引力不够
望采纳:
Demo地址:https://pan.baidu.com/s/1dEAvdV7 密码:h10e
请复制下面代码:
<plugin name="slider_bg" url="slider_background.png" align="bottom" x="0" y="30" handcursor="false" zorder="1" />
<plugin name="slider_grip" url="slider_grip.png" align="left" edge="center" parent="slider_bg" x="0" zorder="2"
dragging="if(pressed,
sub(dx, mouse.stagex, drag_stagex);
add(newx, drag_currentx, dx);
if(newx LT 0, set(newx,0));
if(newx GT plugin[slider_bg].pixelwidth, copy(newx,plugin[slider_bg].pixelwidth));
copy(x,newx);
div(val, newx, plugin[slider_bg].pixelwidth);
setblend(get(val));
delayedcall(0,dragging());
);"
ondown="copy(drag_currentx,x); copy(drag_stagex,mouse.stagex); dragging();"
/>
<action name="addface">
addhotspot(%1);
set(hotspot[%1].url, %2);
set(hotspot[%1].ath, %3);
set(hotspot[%1].atv, %4);
set(hotspot[%1].width, 1000);
set(hotspot[%1].height, 1000);
if(device.html5, if(device.desktop,
<!-- desktop html5 browsers need overlapping cube faces -->
set(hotspot[%1].width, 1002);
set(hotspot[%1].height, 1002);
));
set(hotspot[%1].distorted, true);
set(hotspot[%1].enabled, false);
if(isflash, set(hotspot[%1].visible, false));
set(hotspot[%1].alpha, 0.0);
set(hotspot[%1].details, 16);
</action>
<action name="addcube">
addface(face_%1_F, '%CURRENTXML%/%1_f.jpg', 0, 0);
addface(face_%1_L, '%CURRENTXML%/%1_l.jpg', -90, 0);
addface(face_%1_R, '%CURRENTXML%/%1_r.jpg', +90, 0);
addface(face_%1_B, '%CURRENTXML%/%1_b.jpg', +180, 0);
addface(face_%1_Z, '%CURRENTXML%/%1_u.jpg', 0, -90);
addface(face_%1_N, '%CURRENTXML%/%1_d.jpg', 0, +90);
</action>
<action name="setalpha" devices="flash">
set(%1.alpha, %2);
if(%1.alpha == 0.0, set(%1.visible,false), set(%1.visible,true));
</action>
<action name="setalpha" devices="html5">
<!-- safari has some framerate stops/problems when toggling the visibility - so keep here the spots always visible -->
set(%1.alpha, %2);
</action>
<action name="setcubealpha">
setalpha(hotspot[face_%1_F], %2);
setalpha(hotspot[face_%1_L], %2);
setalpha(hotspot[face_%1_R], %2);
setalpha(hotspot[face_%1_B], %2);
setalpha(hotspot[face_%1_Z], %2);
setalpha(hotspot[face_%1_N], %2);
</action>
<action name="start">
addcube(pano1);
addcube(pano2);
setblend(0);
</action>
<action name="setblend" devices="flash">
sub(blend2, 1.0, %1);
setcubealpha(pano1, get(blend2));
setcubealpha(pano2, %1);
</action>
<action name="setblend" devices="html5">
set(blend1, %1);
sub(blend2, 1.0, %1);
copy(hotspot[face_pano1_F].alpha, blend1);
copy(hotspot[face_pano1_L].alpha, blend1);
copy(hotspot[face_pano1_R].alpha, blend1);
copy(hotspot[face_pano1_B].alpha, blend1);
copy(hotspot[face_pano1_Z].alpha, blend1);
copy(hotspot[face_pano1_N].alpha, blend1);
copy(hotspot[face_pano2_F].alpha, blend2);
copy(hotspot[face_pano2_L].alpha, blend2);
copy(hotspot[face_pano2_R].alpha, blend2);
copy(hotspot[face_pano2_B].alpha, blend2);
copy(hotspot[face_pano2_Z].alpha, blend2);
copy(hotspot[face_pano2_N].alpha, blend2);
</action>