mirror of
https://github.com/troisjs/trois.git
synced 2024-11-24 04:12:02 +08:00
feat: add texture props
This commit is contained in:
parent
9438b79b56
commit
9f65387068
@ -1,15 +1,24 @@
|
|||||||
import { TextureLoader } from 'three';
|
import { ClampToEdgeWrapping, LinearFilter, LinearMipmapLinearFilter, TextureLoader, UVMapping } from 'three';
|
||||||
import { watch } from 'vue';
|
import { watch } from 'vue';
|
||||||
|
import { bindProp } from '../tools.js';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
inject: ['material'],
|
inject: ['material'],
|
||||||
emits: ['loaded'],
|
emits: ['loaded'],
|
||||||
props: {
|
props: {
|
||||||
|
id: { type: String, default: 'map' },
|
||||||
src: String,
|
src: String,
|
||||||
onLoad: Function,
|
onLoad: Function,
|
||||||
onProgress: Function,
|
onProgress: Function,
|
||||||
onError: Function,
|
onError: Function,
|
||||||
id: { type: String, default: 'map' },
|
mapping: { type: Number, default: UVMapping },
|
||||||
|
wrapS: { type: Number, default: ClampToEdgeWrapping },
|
||||||
|
wrapT: { type: Number, default: ClampToEdgeWrapping },
|
||||||
|
magFilter: { type: Number, default: LinearFilter },
|
||||||
|
minFilter: { type: Number, default: LinearMipmapLinearFilter },
|
||||||
|
repeat: { type: Object, default: { x: 1, y: 1 } },
|
||||||
|
rotation: { type: Number, default: 0 },
|
||||||
|
center: { type: Object, default: { x: 0, y: 0 } },
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.refreshTexture();
|
this.refreshTexture();
|
||||||
@ -22,6 +31,10 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
createTexture() {
|
createTexture() {
|
||||||
this.texture = new TextureLoader().load(this.src, this.onLoaded, this.onProgress, this.onError);
|
this.texture = new TextureLoader().load(this.src, this.onLoaded, this.onProgress, this.onError);
|
||||||
|
const wathProps = ['mapping', 'wrapS', 'wrapT', 'magFilter', 'minFilter', 'repeat', 'rotation', 'rotation', 'center'];
|
||||||
|
wathProps.forEach(prop => {
|
||||||
|
bindProp(this, prop, this.texture);
|
||||||
|
});
|
||||||
},
|
},
|
||||||
refreshTexture() {
|
refreshTexture() {
|
||||||
this.createTexture();
|
this.createTexture();
|
||||||
|
Loading…
Reference in New Issue
Block a user