使用未托管在谷歌服务器上的图像嵌入谷歌PhotoSphere(gap.panoembed)
Embed Google PhotoSphere (gapi.panoembed) using image NOT hosted on Google servers
谷歌通过plusone.js api ,可以很容易地将安卓手机中的360度全景照片(称为"PhotoSpheres")直接嵌入到您自己的网站上
一个非常基本的例子是:
<html>
<head>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
</head>
<body>
<g:panoembed imageurl="https://lh5.googleusercontent.com/-kr97Eucg6sM/UKGEuvo_eBI/AAAAAAAAi0s/adq8uqyhm_k/photo.jpg" fullsize="4096,2048" croppedsize="4096,1380" offset="0,480" displaysize="600,400"/>
<script>
gapi.panoembed.go();
</script>
</body>
</html>
然而,这似乎只适用于在imageurl中传递的图像托管在Google+中的情况。有没有一种方法可以在不首先将图像提供给谷歌的情况下使用这些图像?我在安卓手机上拍摄全景,可以在我的设备上毫无问题地观看360度魔术。我从设备上复制图像并上传到网络服务器,但如果我链接到自己的图像副本,"神奇的谷歌东西"就不会发生。如果我把图片上传到Google+,然后查看并获得URL并粘贴……那么它就完美地工作了。我当然想跳过Google+的步骤,只使用我的图像,而不把它们交给谷歌。
你知道如何在非谷歌托管的图像上实现这一点吗?
github上的这个项目可能是您想要的:Photosphere-Github
如果您使用AngularJs,我在这里开发了一个小指令:https://github.com/Gullfaxi171/angular-photosphere-directive
你只需要输入:
<photosphere src="path/img.jpg"></photosphere>
在HTML 中
相关文章:
- 谷歌地图固定位置覆盖
- 不显示带有本地json文件数据的谷歌地图脚本
- 谷歌地图不是以HTML显示,而是在JS Fiddle上工作
- 谷歌放置API:按国家或餐馆名称搜索餐馆
- 谷歌地图标记不会显示
- 无法在JS中显示谷歌地图
- 科尔多瓦页面类应用程序中的多个谷歌地图
- 使用谷歌应用程序脚本将服务器端数据表返回到客户端
- 需要帮助谷歌地图方向面板在FancyBox中显示
- 在谷歌地图上获取事件的x,y坐标
- 使用谷歌应用程序脚本从工作表中获取值并将其显示在文本框中
- 谷歌地图API v3不适用于移动浏览器或PhoneGap
- 模拟谷歌地图中的点击
- 谷歌文档表面引擎
- 如何知道哪个标记被谷歌地图点击了
- 谷歌地图JS API+JSON-多个标记没有显示
- 如何在谷歌字体加载时显示加载图像
- 缓存谷歌地图数据
- 谷歌图表-如何更改整个表的css属性
- 使用未托管在谷歌服务器上的图像嵌入谷歌PhotoSphere(gap.panoembed)