diff --git a/src/components/load3d/Load3D.vue b/src/components/load3d/Load3D.vue
index cbbc41b68d..1c28acaa3b 100644
--- a/src/components/load3d/Load3D.vue
+++ b/src/components/load3d/Load3D.vue
@@ -54,6 +54,7 @@
@updateUpDirection="handleUpdateUpDirection"
@updateMaterialMode="handleUpdateMaterialMode"
@updateEdgeThreshold="handleUpdateEdgeThreshold"
+ @uploadTexture="handleUploadTexture"
@exportModel="handleExportModel"
/>
@@ -155,6 +156,23 @@ const handleBackgroundImageUpdate = async (file: File | null) => {
node.properties['Background Image'] = backgroundImage.value
}
+const handleUploadTexture = async (file: File) => {
+ if (!load3DSceneRef.value?.load3d) {
+ useToastStore().addAlert('No 3D scene to apply texture')
+ return
+ }
+
+ try {
+ const texturePath = await Load3dUtils.uploadFile(file)
+ await load3DSceneRef.value.load3d.applyTexture(texturePath)
+
+ node.properties['Texture'] = texturePath
+ } catch (error) {
+ console.error('Error applying texture:', error)
+ useToastStore().addAlert('Failed to apply texture')
+ }
+}
+
const handleUpdateFOV = (value: number) => {
fov.value = value
diff --git a/src/components/load3d/Load3DControls.vue b/src/components/load3d/Load3DControls.vue
index 07c51ae8c7..07d34f7698 100644
--- a/src/components/load3d/Load3DControls.vue
+++ b/src/components/load3d/Load3DControls.vue
@@ -50,6 +50,7 @@
@updateUpDirection="handleUpdateUpDirection"
@updateMaterialMode="handleUpdateMaterialMode"
@updateEdgeThreshold="handleUpdateEdgeThreshold"
+ @uploadTexture="handleUploadTexture"
ref="modelControlsRef"
/>
@@ -182,6 +183,7 @@ const emit = defineEmits<{
(e: 'updateMaterialMode', mode: MaterialMode): void
(e: 'updateEdgeThreshold', value: number): void
(e: 'exportModel', format: string): void
+ (e: 'uploadTexture', file: File): void
}>()
const backgroundColor = ref(props.backgroundColor)
@@ -230,6 +232,10 @@ const handleUpdateEdgeThreshold = (value: number) => {
emit('updateEdgeThreshold', value)
}
+const handleUploadTexture = (file: File) => {
+ emit('uploadTexture', file)
+}
+
const handleUpdateLightIntensity = (value: number) => {
emit('updateLightIntensity', value)
}
diff --git a/src/components/load3d/Load3DScene.vue b/src/components/load3d/Load3DScene.vue
index 10d4803670..585aa53e7a 100644
--- a/src/components/load3d/Load3DScene.vue
+++ b/src/components/load3d/Load3DScene.vue
@@ -65,7 +65,10 @@ const eventConfig = {
},
exportLoadingEnd: () => {
loadingOverlayRef.value?.endLoading()
- }
+ },
+ textureLoadingStart: () =>
+ loadingOverlayRef.value?.startLoading(t('load3d.applyingTexture')),
+ textureLoadingEnd: () => loadingOverlayRef.value?.endLoading()
} as const
watchEffect(() => {
diff --git a/src/components/load3d/controls/ModelControls.vue b/src/components/load3d/controls/ModelControls.vue
index 4dbbc09292..b3f8de9454 100644
--- a/src/components/load3d/controls/ModelControls.vue
+++ b/src/components/load3d/controls/ModelControls.vue
@@ -58,6 +58,33 @@
+
+
+
+
+