mirror of
https://github.com/yeicor-3d/yet-another-cad-viewer.git
synced 2025-12-19 22:24:17 +01:00
double-sided CAD models
This commit is contained in:
@@ -15,6 +15,7 @@ import {watch} from "vue";
|
|||||||
import type ModelViewerWrapper from "../viewer/ModelViewerWrapper.vue";
|
import type ModelViewerWrapper from "../viewer/ModelViewerWrapper.vue";
|
||||||
import {mdiCircleOpacity, mdiDelete, mdiRectangle, mdiRectangleOutline, mdiVectorRectangle} from '@mdi/js'
|
import {mdiCircleOpacity, mdiDelete, mdiRectangle, mdiRectangleOutline, mdiVectorRectangle} from '@mdi/js'
|
||||||
import SvgIcon from '@jamescoyle/vue-icon/lib/svg-icon.vue';
|
import SvgIcon from '@jamescoyle/vue-icon/lib/svg-icon.vue';
|
||||||
|
import type {WebGLProgramParametersWithUniforms, WebGLRenderer} from "three";
|
||||||
|
|
||||||
const props = defineProps<{ mesh: Mesh, viewer: InstanceType<typeof ModelViewerWrapper> | null, document: Document }>();
|
const props = defineProps<{ mesh: Mesh, viewer: InstanceType<typeof ModelViewerWrapper> | null, document: Document }>();
|
||||||
const emit = defineEmits<{ remove: [] }>()
|
const emit = defineEmits<{ remove: [] }>()
|
||||||
@@ -85,9 +86,13 @@ function onModelLoad() {
|
|||||||
// of not actually removing the primitives from the scene graph
|
// of not actually removing the primitives from the scene graph
|
||||||
sceneModel.traverse((child) => {
|
sceneModel.traverse((child) => {
|
||||||
if (child.userData[extrasNameKey] === modelName) {
|
if (child.userData[extrasNameKey] === modelName) {
|
||||||
// if (child.type == 'Line') child.material.linewidth = 2; // Not supported in WebGL2
|
// if (child.type == 'Line') {
|
||||||
|
// child.material.linewidth = 3; // Not supported in WebGL2
|
||||||
|
// If wide lines are really needed, we need https://threejs.org/examples/?q=line#webgl_lines_fat
|
||||||
|
// }
|
||||||
if (child.type == 'Points') {
|
if (child.type == 'Points') {
|
||||||
child.material.size = 5;
|
child.material.size = 5;
|
||||||
|
child.material.needsUpdate = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -10,7 +10,6 @@ import {
|
|||||||
VToolbarTitle,
|
VToolbarTitle,
|
||||||
VTooltip,
|
VTooltip,
|
||||||
} from "vuetify/lib/components";
|
} from "vuetify/lib/components";
|
||||||
import {defineAsyncComponent, ref, Ref} from "vue";
|
|
||||||
import OrientationGizmo from "./OrientationGizmo.vue";
|
import OrientationGizmo from "./OrientationGizmo.vue";
|
||||||
import type {PerspectiveCamera} from "three/src/cameras/PerspectiveCamera";
|
import type {PerspectiveCamera} from "three/src/cameras/PerspectiveCamera";
|
||||||
import {OrthographicCamera} from "three/src/cameras/OrthographicCamera";
|
import {OrthographicCamera} from "three/src/cameras/OrthographicCamera";
|
||||||
@@ -21,6 +20,7 @@ import type {Intersection} from "three";
|
|||||||
import type {MObject3D} from "./Selection.vue";
|
import type {MObject3D} from "./Selection.vue";
|
||||||
import Loading from "../misc/Loading.vue";
|
import Loading from "../misc/Loading.vue";
|
||||||
import type ModelViewerWrapper from "./viewer/ModelViewerWrapper.vue";
|
import type ModelViewerWrapper from "./viewer/ModelViewerWrapper.vue";
|
||||||
|
import {defineAsyncComponent, Ref, ref} from "vue";
|
||||||
|
|
||||||
const SelectionComponent = defineAsyncComponent({
|
const SelectionComponent = defineAsyncComponent({
|
||||||
loader: () => import("./Selection.vue"),
|
loader: () => import("./Selection.vue"),
|
||||||
@@ -150,6 +150,7 @@ async function openGithub() {
|
|||||||
<v-tooltip activator="parent">Open GitHub</v-tooltip>
|
<v-tooltip activator="parent">Open GitHub</v-tooltip>
|
||||||
<svg-icon type="mdi" :path="mdiGithub"/>
|
<svg-icon type="mdi" :path="mdiGithub"/>
|
||||||
</v-btn>
|
</v-btn>
|
||||||
|
<div ref="statsHolder"></div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!--suppress CssUnusedSymbol -->
|
<!--suppress CssUnusedSymbol -->
|
||||||
|
|||||||
@@ -4,18 +4,16 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import {settings} from "../misc/settings";
|
import {settings} from "../misc/settings";
|
||||||
import {onMounted} from "vue";
|
import {onMounted} from "vue";
|
||||||
import {$scene} from "@google/model-viewer/lib/model-viewer-base";
|
import {$scene, $renderer} from "@google/model-viewer/lib/model-viewer-base";
|
||||||
import Loading from "../misc/Loading.vue";
|
import Loading from "../misc/Loading.vue";
|
||||||
import {ref} from "vue";
|
import {ref} from "vue";
|
||||||
import {ModelViewerElement} from '@google/model-viewer';
|
import {ModelViewerElement} from '@google/model-viewer';
|
||||||
import type {ModelScene} from "@google/model-viewer/lib/three-components/ModelScene";
|
import type {ModelScene} from "@google/model-viewer/lib/three-components/ModelScene";
|
||||||
|
import type {Renderer} from "@google/model-viewer/lib/three-components/Renderer";
|
||||||
|
|
||||||
ModelViewerElement.modelCacheSize = 0; // Also needed to avoid tree shaking
|
ModelViewerElement.modelCacheSize = 0; // Also needed to avoid tree shaking
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{ load: [] }>()
|
||||||
// noinspection ThisExpressionReferencesGlobalObjectJS
|
|
||||||
load: []
|
|
||||||
}>()
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
src: String
|
src: String
|
||||||
@@ -23,7 +21,8 @@ const props = defineProps({
|
|||||||
|
|
||||||
const elem = ref<ModelViewerElement | null>(null);
|
const elem = ref<ModelViewerElement | null>(null);
|
||||||
const scene = ref<ModelScene | null>(null);
|
const scene = ref<ModelScene | null>(null);
|
||||||
defineExpose({elem, scene});
|
const renderer = ref<Renderer | null>(null);
|
||||||
|
defineExpose({elem, scene, renderer});
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
elem.value.addEventListener('load', () => {
|
elem.value.addEventListener('load', () => {
|
||||||
@@ -34,6 +33,7 @@ onMounted(() => {
|
|||||||
if (banner) banner.remove();
|
if (banner) banner.remove();
|
||||||
// Set the scene
|
// Set the scene
|
||||||
scene.value = elem.value[$scene] as ModelScene;
|
scene.value = elem.value[$scene] as ModelScene;
|
||||||
|
renderer.value = elem.value[$renderer] as Renderer;
|
||||||
// Emit the load event
|
// Emit the load event
|
||||||
emit('load')
|
emit('load')
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -55,7 +55,7 @@ class GLTFMgr:
|
|||||||
new_material: Material
|
new_material: Material
|
||||||
if kind == "face":
|
if kind == "face":
|
||||||
new_material = Material(name="face", alphaCutoff=None, pbrMetallicRoughness=PbrMetallicRoughness(
|
new_material = Material(name="face", alphaCutoff=None, pbrMetallicRoughness=PbrMetallicRoughness(
|
||||||
baseColorTexture=TextureInfo(index=0), baseColorFactor=[1, 1, 0.5, 1]))
|
baseColorTexture=TextureInfo(index=0), baseColorFactor=[1, 1, 0.5, 1]), doubleSided=True)
|
||||||
elif kind == "edge":
|
elif kind == "edge":
|
||||||
new_material = Material(name="edge", alphaCutoff=None, pbrMetallicRoughness=PbrMetallicRoughness(
|
new_material = Material(name="edge", alphaCutoff=None, pbrMetallicRoughness=PbrMetallicRoughness(
|
||||||
baseColorFactor=[0, 0, 0.5, 1]))
|
baseColorFactor=[0, 0, 0.5, 1]))
|
||||||
|
|||||||
Reference in New Issue
Block a user