40 lines
835 B
Vue
40 lines
835 B
Vue
<template>
|
|
<div ref="contentRef" class="content"></div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref, onMounted } from "vue";
|
|
import { WebGLRenderer } from "@ray-lab/renderer-webgl";
|
|
|
|
const contentRef = ref<HTMLDivElement>();
|
|
const canvasEle = document.createElement("canvas");
|
|
|
|
onMounted(() => {
|
|
const renderer = new WebGLRenderer({
|
|
canvas: canvasEle,
|
|
container: contentRef.value,
|
|
autoResize: true,
|
|
width: 800,
|
|
height: 600
|
|
});
|
|
|
|
if (contentRef.value) {
|
|
contentRef.value.appendChild(canvasEle);
|
|
}
|
|
|
|
console.log(renderer);
|
|
})
|
|
</script>
|
|
|
|
<style>
|
|
|
|
html, body {
|
|
margin: 0;
|
|
}
|
|
|
|
div.content {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
</style> |