French developer @ Uptale.
Machine learning, data,VR and 3D rendering. Sometimes front end when it's needed
Published
Edited
Nov 9, 2020
{
aframe;
return html`<a-scene id="scene" embedded style="width: 100%; height:400px">
<a-assets id="assets">
<img id="image-0" crossorigin="anonymous" src="https://cors-anywhere.herokuapp.com/https://wallpaperaccess.com/full/38191.jpg">
</img>
</a-assets>
<a-sky id="sky-0" src="#image-0" rotation="0 180 0"></a-sky>
</a-scene>`;
}
aframe.registerComponent('unload-component', {
/**
* Initial creation and setting of the mesh.
*/
init: function() {
var data = this.data;
var el = this.el;
},
remove: function() {
// this.el.getObject3D('mesh').material.dispose();
}
})
creationRoutine = {
let videoIndex = 1;
setTimeout(
() =>
setInterval(() => {
$(`#image-${videoIndex - 1}`).remove();
$(`#sky-${videoIndex - 1}`).remove();
const videoSphere = $(
`<a-sky id='sky-${videoIndex}' unload-component/>`
);
videoSphere.attr("visible", true);
const randomNumber = videoIndex % wallpaper_images.length;
const video = $(`<img id='image-${videoIndex}' />`);
video.attr("crossorigin", "anonymous");
video.attr(
"src",
`https://cors-anywhere.herokuapp.com/${wallpaper_images[randomNumber]}`
);
$("#assets").append(video);
videoSphere.attr("src", `#image-${videoIndex}`);
videoIndex++;
$("#assets").append(video);
$("#scene").append(videoSphere);
}, 5000),
3000
);
}
$ = require("jquery")
wallpaper_images = [
"https://wallpaperaccess.com/full/54041.jpg",
"https://wallpaperaccess.com/full/38191.jpg",
"https://wallpaperaccess.com/full/15858.jpg",
"https://wallpaperaccess.com/full/54049.jpg",
"https://wallpaperaccess.com/full/2576094.jpg",
"https://wallpaperaccess.com/full/2576101.png"
]
THREE = aframe.THREE
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
