streetsphere/index.html at master · googlearchive/streetsphere · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Street Sphere: Photo Sphere to Street View</title>
    <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:regular,medium,thin,italic,mediumitalic,bold" title="roboto">
    <style>
      html, input, h1 {
        font-family: Roboto, "Open Sans", sans-serif;
        font-weight: normal;
      }
      #file {
        width: 100%;
      }
      #submit {
        padding: 0;
        margin: 0;
      }
    </style>
  </head>
  <body>
    <h1>Street Sphere: Turn your photo spheres into embeddable panoramas</h1>

    <p>
      <a href="https://www.google.com/maps/streetview/publish/">Photo spheres</a>
      are 360-degree images users can create and share with Google Maps.
    </p>

    <p>
      Upload your photo sphere image (<code>.jpg</code>) to download a
      ready-to-use Google Maps API Custom Street View web page.
      Learn more about custom Street View panoramas on the
      <a href="https://developers.google.com/maps/documentation/javascript/streetview#CustomStreetView">Google
      Maps APIs website</a>.
    </p>

    <form action="/upload" method="post" enctype="multipart/form-data">
      <input type="file" name="img" id="file">
      <input type="submit" value="Upload!" id="submit">
    </form>

    <p>
      Want to practice? Download
      <a href="https://drive.google.com/file/d/0BxEeOqcjSE5uY1g0VTFFVmJPRVk/view?usp=sharing" target="_blank">this
      photo sphere image</a>, captured in Indonesia, from Google Drive.
    </p>

    <p>
      Learn more about creating photo spheres on the
      <a href="https://www.google.com/maps/streetview/publish/">Street
      View website</a>.
    </p>

    <p>
      Note: In order to publish this code on your website, be sure to
      <a href="https://developers.google.com/maps/documentation/javascript/get-api-key">sign
      up for a Maps APIs key</a>.
    </p>

    <p>
      The source code for this app is available on
      <a href="https://github.com/googlemaps/streetsphere">GitHub</a>, under an
      <a href="http://www.apache.org/licenses/LICENSE-2.0.html">Apache 2.0 licence</a>.
    </p>
  </body>
</html>