kostenloser Webspace werbefrei: lima-city


Panorama Software

lima-cityForumHeim-PCSoftware

  1. Autor dieses Themas

    christian1603

    Kostenloser Webspace von christian1603

    christian1603 hat kostenlosen Webspace.

    Hallo LC,
    war lange nicht mehr hier^^

    Ich suche eine Software mit der ich ein 360 Panorama auf meiner Website darstellen kann.
    Man soll sich quasi umschauen können -> aber seitlich reicht nach oben und unten brauch ich noch nicht unbedingt.

    HTML5 oder SWF wäre mir egal. (is SWF hier erlaubt? wenn nicht lade ich es woanders hoch)


    LG
    Christian



    Beitrag zuletzt geändert: 24.9.2015 2:38:59 von christian1603
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. burgi

    Co-Admin Kostenloser Webspace von burgi

    burgi hat kostenlosen Webspace.

    Bezüglich der möglichen Software kann ich Dir leider nicht weiterhelfen, da ich keine kenne.
    Betreffend Dateiformate:
    https://www.lima-city.de/hilfe/welche-dateiformate-sind-auf-dem-webspace-verboten
    Ausdrücklich erlaubt sind sind natürlich *.png, *.gif, *.jpg, *.jpeg, *.ico, *.swf, *.pdf, *.doc, *.docx, *.odt, *.xls, *.xlsx, *.ods, *.ppt, *.pptx und *.odp Dateien.
  4. mein-wunschname

    mein-wunschname hat kostenlosen Webspace.

    Flash (swf) wie z.B. hier
    http://www.paris-26-gigapixels.com/index-fr.html
    eingesetzt, ist wegen der unsicheren Zukunft bzw. schon jetzt fehlenden Unterstützung auf manchen Geräten nicht zu empfehlen.
    Dieses jQuery-Plugin
    http://codecanyon.net/item/360-panoramic-viewer-jquery-plugin/2684810
    kostet $8
  5. Ich denke, das kann man leicht selbst programmieren. Ich teste es mal heute Abend, sobald ich Zeit habe.

    So, nun habe ich doch noch eine kleine Pause nutzen können und ein funktionierendes Ergebnis bekommen:
    test42test.lima-city.de/index.php
    Den Code kann man von der Internetseite kopieren, aber ich schreibe ihn hier auch nochmals auf:
    <div id="Panorama">
                <div id="PBildA"><img id='IPBildA' src="Lab_nat.png" height="100" width="500"></div>
                <div id="PBildB"><img id='IPBildB' src="Lab_nat.png" height="100" width="500"></div>
            </div>
            <div id="Schutz"></div>
            <div id="Debug">
                <input type="button" onClick="wechsel();" value="Grafik wechseln"><br>
                Status:<br><input type="text" id="S" style="width:100%"><br>
                X:<input type="text" id="X"><br>
                DX:<input type="text" id="DX">
            </div>

    #Panorama{
                width:200px;
                height:110px;
                background-color:black;
                position:absolute;
                left:50px;
                top:50px;
                overflow: hidden;
                z-index: 0;
            }
            #Schutz{
                width:100%;
                height:100%;
                position:fixed;
                left:0px;
                top:0px;
                overflow: hidden;
                z-index: 1;
            }
            #Debug{
                background-color:lightgrey;
                position:absolute;
                left:50px;
                top:200px;
                overflow: hidden;
                z-index: 2;
            }
            #PBildA{
                width:500px;
                height:100px;
                position:absolute;
                left: -400px;
                top:0px;   
                z-index: 0;        
            }
            #PBildB{
                width:500px;
                height:100px;
                position:absolute;
                left: 100px;
                top:0px; 
                z-index: 0;          
            }

    PosX=0;
                PosAX=-400;
                SPosAX=-400;
                PosBX=100;
                SPosBX=100;
                SXBild=500;
                SXP=200;
                drag=false;
                bild=true;
                function Mausd (Ereignis) {
                    document.getElementById('S').value="Maustaste gedrückt";
                    PosX=Ereignis.clientX;
                    drag=true;                 
                }
                function Mausu (Ereignis) {
                    document.getElementById('S').value="Maustaste losgelassen"; 
                    drag=false; 
                    SPosAX=PosAX;
                    SPosBX=PosBX;             
                }
                function Mausm (Ereignis) {
                    document.getElementById('X').value=Ereignis.clientX;
                    if (drag==true){
                        DX=Ereignis.clientX-PosX;
                        document.getElementById('DX').value=DX;
                    
                        PosAX=SPosAX+DX;
                        PosBX=SPosBX+DX;
                        if(PosAX<-1*SXBild){
                            PosAX=PosBX+SXBild;
                        }
                        if(PosBX<-1*SXBild){
                            PosBX=PosAX+SXBild;
                        }
                        if(PosAX>SXP){
                            PosAX=PosBX-SXBild;
                        }
                        if(PosBX>SXP){
                            PosBX=PosAX-SXBild;
                        }
                    
                        document.getElementById('PBildA').style.left=PosAX;
                        document.getElementById('PBildB').style.left=PosBX;;
                    }
                }
                
                
                function wechsel(){
                    if(bild){
                        document.getElementById('IPBildA').src="Test.png";
                        document.getElementById('IPBildB').src="Test.png";
                        bild=!bild;
                    }else{
                        document.getElementById('IPBildA').src="Lab_nat.png";
                        document.getElementById('IPBildB').src="Lab_nat.png";
                        bild=!bild;
                    }                
                }
                document.onmousedown = Mausd;
                document.onmouseup = Mausu;
                document.onmousemove=Mausm;


    Zum Testen habe ich zwei Grafiken erstellt. Die Standardgrafik ist Natlos, d.h. wenn ihr den Anfang gefunden habt, stimmt etwas mit dem Script nicht.
    Damit aber jeder sehen kann, wo die Grafiken sich befinden, ist die zweite Grafik nicht Natlos und so gestaltet, dass das Ende leicht zu erkenne ist.

    Beitrag zuletzt geändert: 24.9.2015 15:44:20 von test42test
  6. Oh, und was ich nicht drin habe:
    Die Größe der Bilder und der DIVs kann man auch auslesen. Damit braucht man keine Größenangaben mehr im JS-Code machen und das ganze geht anpassungsfrei mit verschiedenen Bildern. Man könnte sich auch vorstellen, dass die Größe des tatsächlich angezeigten Panoramas frei veränderbar ist (z.B: ganze Seitenbreite).
    Ausbaufähig ist es schon noch.
  7. Hallo Christian,

    schau mal auf meine neue Webseite "thorenzie.lima-city.de" Willkommenseite da habe ich eine Panoramatour (Paristour) erstellt.
    Meinst Du so etwas in der Art? Ich bin erst seit einigen Tagen bei lima-city. Hast du schon die Bilder fürs Panrama erstellt?
    Brauchst Du eine Software Panorama-Viewer oder für ein bis 360°-Stitching-Programm (der die Bilder zu einen Panorama zusammen setzt).

    Gruß thorenzie

    Beitrag zuletzt geändert: 29.9.2015 9:31:03 von thorenzie
  8. topfenstrudel

    topfenstrudel hat kostenlosen Webspace.

    Also wenn ein Java-Applet okay wäre: Panorado Applet wäre eine Lösung. Auf der Webseite gibt es auch Beispiele, wie das dann aussieht.

    Noch besser finde ich ansonsten Pannellum. Es basiert nur auf HTML5, CSS und Javascript, läuft also auf jedem Betriebssystem, und ist Open Source. :wink: Unter dem Link ist auch direkt ein Beispiel sichtbar. Du kannst sogar im Bild Anmerkungen einfügen und Point of Interest markieren.

    MfG Georg
  9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!