Страницы

пятница, 10 мая 2013 г.

Как добавить панорамные фото на веб-сайт.

Photo Spheres - интересная штука. Как это можно использовать на веб-сайте? Вот так. Для начала необходимо подцепить библиотеку plusone.js. Чтобы добавить вьювер панорамных фото используем элемент g:panoembed. Google+ API превратит элемент в интерактивный вьювер панорамных фото после выполнения следующей функции:

gapi.panoembed.go();

Рабочий пример может выглядеть так:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
 <head>
  <title>Photo Spheres</title>
  <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
  <script type="text/javascript">
   gapi.panoembed.go();
  </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"/>
 </body>
</html>