Jede Möglichkeit zum Live-Videostreaming innerhalb eines Frames?

Ich möchte eine Website mit einem 360-Video erstellen, die von meinem Computer 360 Cam (Ricoh Theta s) gestreamt und nutzt die Möglichkeiten von A-Frame. Ich hatte jedoch kein Glück, Youtube Livestreaming in A-Frame einzubetten. Ich hätte einen Webserver und der Stream wäre nicht wirklich öffentlich, also gibt es vielleicht eine Lösung, die Selfhosting beinhaltet? Hat jemand Erfahrung damit, etw so zu erreichen? Ich kann nicht alles im Zusammenhang bisher finden und dies spielt eine entscheidende Rolle in meinem robotproject ...Jede Möglichkeit zum Live-Videostreaming innerhalb eines Frames?

EDIT 1:

Ich könnte angeben, noch nach einigen Recherchen:

es wäre perfekt, wenn a- Videosphäre und A-Video würden sth wie hls oder MPEG-Dash-Streams unterstützen. da dies eine art von player für chrome und android-sachen benötigen würde, denke ich, dass der einfachste weg wäre, eine motionjpg-support zu unterstützen, da sie sehr einfach zu erstellen sind. flashstreams kann auch gut sein, aber ich denke nicht, dass es eine Zukunft dafür gibt.

gibt es so etwas in der Planung von jemandem, weil ich bin mir ziemlich sicher, dass so etwas noch nicht existiert ... ich brauchte 2-3 Tage der Forschung und nichts zu diesem Thema finden ... nur eine getUserMedia für Webcam Beispiel aufgetaucht, aber es ist nicht gut für meinen Zweck.

ein anderer Ansatz, mit dem ich leben könnte, wäre eine Routine, die Bilder in a-sky automatisch lädt (wenn möglich ohne Flackern). Ich habe versucht, Javascripts zu integrieren, die das innerhalb normaler divs tun sollen und so, aber nichts hat funktioniert ...

oder habe irgendwo jemand einen Stream jeglicher Art bekommen, der in der A-Videosphäre läuft und wenn ja wie?

EDIT 2: ich habe es funktioniert ... irgendwie ... nicht wirklich, aber vielversprechend aussieht ...

der Strom von „Yawcam“ versehen ist, die ein neues Bild in jeder Sekunde zu meinem FTP-Uploads. Wenn ich jetzt auf die rote Kugel klicke startet das Skript über addEventListener 'click' und der Inhalt von a-sky wird aktualisiert ... gibt es eine Möglichkeit eine Schleife aus dem Skript zu machen, so dass man nicht mehr klicken muss und es einfach Update selbst jede Sekunde?

<head> 
 

 
    <meta charset="utf-8"> 
 
    <title>joeinterface</title> 
 
    <meta name="description" content="360 Video — A-Frame"> 
 
    <script src="https://aframe.io/releases/0.3.2/aframe.min.js"></script> 
 

 
</head> 
 

 

 

 
<body> 
 

 
<script> 
 
    AFRAME.registerComponent('set-sky', { 
 
    schema: {default:''}, 
 
    init() { 
 
     const sky = document.querySelector('a-sky'); 
 
     this.el.addEventListener('click',() => { 
 
     sky.setAttribute('src', this.data + "?" + Math.random()); 
 
     }); 
 
    } 
 
    }); 
 

 
</script> 
 

 
<a-scene> 
 
    <a-camera position="0 0 0"> 
 
    <a-cursor color="#4CC3D9" fuse="true" timeout="10"></a-cursor> 
 
    </a-camera> 
 

 
    <a-sphere color="#F44336" radius="8" position="-8 2 -8" set-sky="image1.jpg"></a-sphere> 
 

 
    
 

 
    <a-sky></a-sky> 
 
</a-scene> 
 

 
</body>

Quelle

2016-11-27 Josef P. Wagner

so hier ist die Lösung für die "Art-of" Lösung vorgeschlagen ...

das Bild "out" über "Yawcam" auf meinem Server aktualisiert jede Sekunde und im a-sky tag aktualisiert - auch ohne flackern ... also kein ton, aber zumindest eine art live-video-feed in a-sky.

<head> 
 

 
    <meta charset="utf-8"> 
 
    <title>joeinterface</title> 
 
    <meta name="description" content="360 Video � A-Frame"> 
 
    <script src="https://aframe.io/releases/0.3.2/aframe.min.js"></script> 
 

 
</head> 
 

 

 

 
<body> 
 

 
<script> 
 
AFRAME.registerComponent('set-sky', { 
 
    schema: {default:''}, 
 
    init: function() { 
 
    this.timeout = setInterval(this.updateSky.bind(this), 100); 
 
    this.sky = this.el; 
 
     
 
    }, 
 
    remove: function() { 
 
    clearInterval(this.timeout); 
 
    this.el.removeObject3D(this.object3D); 
 
    }, 
 
    updateSky: function() { 
 
    this.sky.setAttribute('src', this.data + "?" + Math.random()); 
 
    } 
 
}); 
 

 
</script> 
 

 
<a-scene> 
 
<a-camera position="0 0 0"> 
 
    <a-cursor color="#4CC3D9 " fuse="true" timeout="10"></a-cursor> 
 
</a-camera> 
 

 
<a-sphere color="#F44336 " radius="2" position="-8 2 -8"></a-sphere> 
 

 
    
 

 
<a-sky set-sky="out"></a-sky> 
 
</a-scene> 
 

 
</body>

Quelle

2016-12-06 12:38:16

Jede Möglichkeit zum Live-Videostreaming innerhalb eines Frames?

Antwort

Verwandte Themen