TourEXTENDER, Overlay für Google Street View Touren selbst erstellen

TourEXTENDER, Overlay für Google Street View Touren selbst erstellen

DIY – Do It Yourself

TourEXTENDER, Overlay für Google Street View Touren selbst erstellen

Es werden nicht immer die großen Tools (TourEXTENDER, Overlays), benötigt, wenn man z.B. wie im folgenden Beispiel, nur zwei bis drei Panoramagruppen hat.

 

Anzeige nicht Möglich
Bitte akzeptieren Sie unsere Cookie-Richtlinie, und klicken Sie hier

zum Profil Cafe Corner

Kompletter Quellcode

Alles was ROT Eingedruck ist muss angepasst werden
Das einzubindede Panorama bei Google Maps aufrufen!
https://www.google.com/maps/@51.7062531,7.3780813,3a,75y,297.92h,84.54t/data=!3m7!1e1!3m5!1sdyUCMxep1U8AAAQpkDF9Pw!2e0!3e2!7i13312!8i6656?hl=de-DE

Quellcode TourEXTENDER wie oben dargestellt

<!DOCTYPE HTML>
<html>
<head>
<title>TITEL/NAME des Unternehmers</title>
<meta name="description" content="Beschreibung des Business">
<meta name="keywords" content="Stichworte (Kommagertrennt / Leerzeichen) Eins, Zwei, Drei">
<meta property="og:image" content="http://business-photo.molcon.de/google-business-view/recklinghausen/Cafe-Corner/streetview.jpg">
<link href="https://plus.google.com/110738124846448517531/" rel="publisher"><!-- Google+ ID Unternehmer -->
<link href="https://www.google.com/maps/place?cid=18297476467992710619" rel="place_id"><!-- Maps ID Unternehmer -->
<link href="https://plus.google.com/105065516716852340832" rel="author"><!-- Google+ ID Fotograf -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@voninnenansehen" />
<meta name="twitter:title" content="TITEL/NAME des Unternehmers" />
<meta name="twitter:description" content="Beschreibung des Business für Twitter" />
<meta property="og:type" content="company.website">
<!-- 
Folgender unsichbarer Text, bitte in Ihren erstellten Overlays nicht entfernen!
PanoID aus Google URL: https://business-view.photo/?p=8852 
Copyright Detlev Molitor, Business View Photo Ag, CC BY 4.0 https://creativecommons.org/licenses/by/4.0/deed.de 
-->
<script>
var panorama;
var timer;
function jump(index){
var h=[];
h[0]=312;
h[1]=108;
h[2]=22;
h[3]=143;
var p=[];
p[0]="QGyziSLvdN8AAAQfDTk9bA"; <!-- PANO ID aus Link -->
p[1]="UJ5YXwUYpzQAAAQfDTn_aw"; <!-- PANO ID aus Link -->
p[2]="4FpbHhiMeBgAAAQfDU4oHQ"; <!-- PANO ID aus Link -->
p[3]="4x5ovYIJAKAAAAQfDYre6g"; <!-- PANO ID aus Link -->
var heading=h[index];
var pano=p[index];
var canvas=document.getElementById('map-canvas');
var panoramaOptions={
addressControl:false,
panControl:false,
pano:pano,
pov: {
heading:heading,
pitch:0,
zoom:0.3
}
}
panorama=new google.maps.StreetViewPanorama(canvas,panoramaOptions);
}
function spinIt() {
stopIt();
var increment=0.05;
timer=setInterval(function () {
pov=panorama.getPov();
pov.heading += increment;
while(pov.heading > 360.0) {
pov.heading -= 360.0;
}
while(pov.heading < 0.0) {
pov.heading += 360.0;
}
panorama.setPov(pov);
}, 10);
}
function init() {
jump(3);
<?
if ($_GET[run]=="true")echo"
spinIt();
";
?>
}
function stopIt() {
clearInterval(timer);
}
function ddovr(){
document.getElementById('dropdown').size=document.getElementById('dropdown').length;
stopIt();
}
function ddout(){
document.getElementById('dropdown').selectedIndex=0;
document.getElementById('dropdown').size=1;
spinIt();
}
document.getElementById('map-canvas').onmouseover=stopIt;
document.getElementById('map-canvas').onmouseout=spinIt;
document.getElementById('map-canvas').ontouchstart=stopIt;
document.getElementById('map-canvas').ontouchend=spinIt;
document.getElementById('dropdown').onmouseover=ddovr;
document.getElementById('dropdown').onmouseout=ddout;
document.getElementById('dropdown').onclick=ddout;
</script>
<!-- Stylesheet -->
<!-- viel spaß beim ändern der stylesheets -->
<style type="text/css">
#map-container {
position: relative;
width: 700px;
height: 467px;
}
#map-canvas{
z-index: 0;
position: absolute;
top: 0;
left: 0;
width: 700px;
height: 467px;
}
#map-canvas img {
border: none !important;
max-width: none !important;
}
.klick {
cursor: pointer;
}
.normal {
color: #000000;
font-size: 14px;
}
#dropdown{
z-index: 1;
position: absolute;
top: 0;
right: 0;
padding-top:10px;
padding-bottom:10px;
padding-left:10px;
padding-right:10px;
background-color:gold;
color: #0000FF;
font-weight: bold;
font-size: 16px;
border: 1px dotted #405871;
background-repeat: no-repeat;
background-position: 2px 1px;
padding-left: 20px;
border-width: small;
border-color: #FFFF00;
border-style: solid;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
list-style:none;
}
</style>
<!-- php -->
<?php
$aktuell = 'http://'.$_SERVER['SERVER_NAME'].$_SERVER['PHP_SELF'];
?>
<!-- created Wed, 27 May 15 15:24:55 +0200 -->
</head>
<body onload="init();">
<script type="text/javascript" src="https://www.business-view.photo/include/wz_tooltip.js"></script>
 <script type="text/javascript" src="https://www.business-view.photo/include/tip_centerwindow.js"></script>
<div id="map-container">
<div id="map-canvas"></div>
<ul id="dropdown">
<li><a href="http://www.WEBSEITE-DES-KUNDEN.de/" target="_top" title="NAME DES KUNDEN" onmouseover="Tip('<p>STRASSE DES KUNDEN<br><a href=\'https://www.google.com/maps/place?cid=18297476467992710619\' title=\'Auf Google Maps ansehen\' target=\'_top\'>PLZ ORT DES KUNDEN</a><br>Email: <a href=\'mailto:EMAIL@DES-KUNDEN.de\'>EMAIL@DES-KUNDEN.de</a><br>Phone: TELEFON KUNDEN<br>Web: <a href=\'http://www.WEBSEITE-DES-KUNDEN.de/\' target=\'_top\'>www.WEBSEITE-DES-KUNDEN.de</a></p>', TITLE, 'NAME DES KUNDEN', CLICKCLOSE, true, STICKY, true, SHADOW, true, CLOSEBTN, true)" onmouseout="UnTip()"><img src="http://www.example.com/logo-des-kunden.jpg" alt="Logo NAME DES KUNDEN" border="0" width="143" height="86"></a></li>
<li onclick="jump(0)" class="klick">&raquo; Klickname1</li>
<li onclick="jump(1)" class="klick">&raquo; Klickname2</li>
<li onclick="jump(2)" class="klick">&raquo; Klickname3</li>
<li onclick="jump(3)" class="klick">&raquo; Klickname4</li>
<li>
<hr>
<!-- Links zu Sozialen Netzwerken des Kunden, es sollten max. 3 sein -->
<a href="https://business-view.photo/go/facebook/" target="_blank" class="klick"><img src="https://business-view.photo/graphics/facebook.png" alt="facebook" title="Folge uns auf Facebook" border="0" width="30" height="30"></a>
<a href="https://plus.google.com/104367896941189009031/" target="_blank" class="klick"><img src="https://business-view.photo/graphics/google+.png" alt="google+" title="Folge uns auf Google+" border="0" width="30" height="30"></a>
<a href="https://twitter.com/voninnenansehen" target="_blank" class="klick"><img src="https://business-view.photo/graphics/twitter.png" alt="twitter" title="Folge uns auf Twitter" border="0" width="30" height="30"></a>
<!-- Links zu Sozialen Netzwerken des Kunden, es sollten max. 3 sein / ENDE -->
<!-- Google Earth Einbindung, mit www.GeoSetter.de kann die Datei sofort erstellt werden -->
<a href="http://www.example.com/google-earth.kmz" class="klick"><img src="https://business-view.photo/graphics/google_earth.png" alt="Google Earth" title="Auf Google Earth ansehen" border="0" width="30" height="30"></a>
&nbsp;
<? if ($_GET[run]=='true')echo'<a href="'.$aktuell.'" target="_self"><img src="https://business-view.photo/graphics/graphics/Pause_Button.png" title="Animation Stoppen" border="0" width="30" height="30"></a>'; else echo'<a href="'.$aktuell.'?run=true" target="_self"><img src="https://business-view.photo/graphics/Play_Button.png" title="Animation Starten" border="0" width="30" height="30"></a>'; ?>
</li>
<li><hr><nobr><div class="normal">Gefällt mir: <a href="http://www.facebook.com/sharer.php?u=<? echo $aktuell; ?>" onclick="window.open('http://www.facebook.com/sharer.php?u=<? echo $aktuell; ?>','','status=no, scrollbars=yes, toolbar=no, width=650,height=500,screenX=0,screenY=0,left=50,top=50');;return false;" title="Auf Facebook teilen" alt="facebook" border="0"><img src="https://business-view.photo/graphics/facebook-like.png" alt="facebook like" title="Auf Facebook teilen" border="0" height="21"></a> <a href="https://plus.google.com/share?url=<? echo $aktuell; ?>" onclick="window.open('https://plus.google.com/share?url=<? echo $aktuell; ?>','','status=no, scrollbars=yes, toolbar=no, width=650,height=500,screenX=0,screenY=0,left=50,top=50');;return false;" title="Auf Google+ teilen" alt="Google+" border="0"><img src="https://business-view.photo/graphics/google+1button.jpg" alt="google+" title="Auf Google+ teilen" border="0" width="34" height="21"></a> </div></nobr></li>
<li><hr><font size="-2"><a href="https://goo.gl/KurzURL-LinkTeilen-Panorama" target="_blank" onmouseover="Tip('<p>Einfach unten links auf das Wort Google klicken.</p>', TITLE, 'Vergrößerte Darstellung', CLICKCLOSE, true, STICKY, true, SHADOW, true, CLOSEBTN, true)" onmouseout="UnTip()">Vergrößerte Darstellung</a><br>Fotograf: <!-- LINK direkt auf euer Profil bei Business View Photo Ag --> <a href="https://business-view.photo/vorname_nachname/" target="_blank" title="Google Street View Fotograf">Vorname Nachname Fotograf</a></font></li>
</ul>
</div>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;sensor=false"></script><!-- &amp;developerKey=YourKey --><!-- Falls voerhanden die developperKey des Kunden/Fotografen -->
<!-- Hier noch den Original Quellcode für Google Analytik einbinden für Statistik, vom Kunden -->
</body>
</html>

Download Quellcode

Download Quellcode als TXT Datei, mit zusätzlichen Funktionen!
Für den direkten Download Link, einfach ein Like, Tweet oder +1 anklicken.



 




 


Quellcode PanoID

Gerne können Sie mit folgendem Code, die Funktion bei Ihnen in der Webseite anbieten

<h1>PanoID aus Google Street View Panoramen extrahieren</h1>
<iframe src="https://business-view.photo/include/panoid-googlestreetview.php" width="100%" height="400" frameborder="0" style="border:0" allowfullscreen>
<a href="https://business-view.photo/include/panoid-googlestreetview.php">PanoID aus Google Street View Panoramen</a>
</iframe>

Weiterführende Informationen

PanoID aus Google Street View Panoramen extrahieren

Quellcode PanoID für die eigene Webseite

Anzeige nicht Möglich
Bitte akzeptieren Sie unsere Cookie-Richtlinie, und klicken Sie hier


 

Wir hoffen, dass Ihnen unsere Themenauswahl zusagt und freuen uns über Ihr Feedback.

 


 

facebook Gruppe   facebook Seite   twitter   linkedin   XING Gruppe     Google+   tumblr   disqus   Pinterest   YouTube   VK   Marktplatz Mittelstand

 

Mehr kostenlose GOOGLE, Bing, Yahoo, facebook-Tipps

Melden Sie sich jetzt zum kostenlosen Newsletter an und erhalten Sie die neusten Beiträge rund um Google, Bing, Yahoo, facebook-Optimierung.
Enter your email address:


Delivered by FeedBurner

Gefällt Ihnen die Themenauswahl unserer News? Der Aufbau, der Inhalt, die Optik? Wenn ja würden wir uns um eine Nachricht freuen, auch über konstruktive Kritik sind wir sehr dankbar. Gefällt Ihnen unsere Webseite? Fünf Fragen, gestalten Sie unsere Webseite mit.

31. August 2016 / by / in , , , , , , , , , , ,

Schreibe einen Kommentar

Branchenlösungen
Suche
Produktkategorien
Was können wir für Sie tun?

Haben wir Ihr Interesse geweckt? Wir freuen uns über jede Nachricht und jeden neuen Kontakt. Selbst dann wenn sie noch gar nicht genau wissen, was wir für sie tun können und Sie einfach nur das Gefühl haben, dass wir für Sie interessant werden könnten. Wir freuen uns auf ein persönliches Gespräch mit Ihnen:

Rufen Sie und an oder:

Neueste Beiträge
Sicher Surfen
Auf unserer Webseite können Sie sicher surfen und einkaufen. Über verschlüsselte Verbindungen werden Ihre sensiblen Daten übertragen und sind somit gegen unberechtigten Zugriff geschützt. Garantiert!
GoogleSafeBrowsing

Preisangebote, wenn nichts anderes angegeben, in Euro, vorbehaltlich der Verfügbarkeit und zuzüglich der Gesetzlich vorgeschriebenen Mehrwertsteuer, Zwischenverkauf vorbehalten, unsere Rabatte, Sonderpreise und / oder Nettopreise gelten nur für Geschäftskunden, die als Unternehmer im Sinne des BGB (§14, Abs. 1) tätig sind. Es gelten bei Beauftragung / Bestellung ausschließlich unsere AGB : Allgemeinen Liefer- und Geschäftsbedingungen.




Erfahrungen & Bewertungen zu Business View Photo Ag anzeigen - von