diff --git a/package-lock.json b/package-lock.json index 3e4e1fa..21aeb08 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,7 +15,8 @@ "lodash": "^4.17.21", "normalize.css": "^8.0.1", "proj4": "^2.6.3", - "three": "^0.129.0" + "three": "^0.129.0", + "three-csg-ts": "^3.1.3" }, "devDependencies": { "@babel/core": "^7.12.9", @@ -65,17 +66,17 @@ } }, "node_modules/@babel/core": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.14.5.tgz", - "integrity": "sha512-RN/AwP2DJmQTZSfiDaD+JQQ/J99KsIpOCfBE5pL+5jJSt7nI3nYGoAXZu+ffYSQ029NLs2DstZb+eR81uuARgg==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.14.6.tgz", + "integrity": "sha512-gJnOEWSqTk96qG5BoIrl5bVtc23DCycmIePPYnamY9RboYdI4nFy5vAQMSl81O5K/W0sLDWfGysnOECC+KUUCA==", "dev": true, "dependencies": { "@babel/code-frame": "^7.14.5", "@babel/generator": "^7.14.5", "@babel/helper-compilation-targets": "^7.14.5", "@babel/helper-module-transforms": "^7.14.5", - "@babel/helpers": "^7.14.5", - "@babel/parser": "^7.14.5", + "@babel/helpers": "^7.14.6", + "@babel/parser": "^7.14.6", "@babel/template": "^7.14.5", "@babel/traverse": "^7.14.5", "@babel/types": "^7.14.5", @@ -152,9 +153,9 @@ } }, "node_modules/@babel/helper-create-class-features-plugin": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.14.5.tgz", - "integrity": "sha512-Uq9z2e7ZtcnDMirRqAGLRaLwJn+Lrh388v5ETrR3pALJnElVh2zqQmdbz4W2RUJYohAPh2mtyPUgyMHMzXMncQ==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.14.6.tgz", + "integrity": "sha512-Z6gsfGofTxH/+LQXqYEK45kxmcensbzmk/oi8DmaQytlQCgqNZt9XQF8iqlI/SeXWVjaMNxvYvzaYw+kh42mDg==", "dev": true, "dependencies": { "@babel/helper-annotate-as-pure": "^7.14.5", @@ -419,9 +420,9 @@ } }, "node_modules/@babel/helpers": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.14.5.tgz", - "integrity": "sha512-xtcWOuN9VL6nApgVHtq3PPcQv5qFBJzoSZzJ/2c0QK/IP/gxVcoWSNQwFEGvmbQsuS9rhYqjILDGGXcTkA705Q==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.14.6.tgz", + "integrity": "sha512-yesp1ENQBiLI+iYHSJdoZKUtRpfTlL1grDIX9NRlAVppljLw/4tTyYupIB7uIYmC3stW/imAv8EqaKaS/ibmeA==", "dev": true, "dependencies": { "@babel/template": "^7.14.5", @@ -447,9 +448,9 @@ } }, "node_modules/@babel/parser": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.14.5.tgz", - "integrity": "sha512-TM8C+xtH/9n1qzX+JNHi7AN2zHMTiPUtspO0ZdHflW8KaskkALhMmuMHb4bCmNdv9VAPzJX3/bXqkVLnAvsPfg==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.14.6.tgz", + "integrity": "sha512-oG0ej7efjEXxb4UgE+klVx+3j4MVo+A2vCzm7OUN4CLo6WhQ+vSOD2yJ8m7B+DghObxtLxt3EfgMWpq+AsWehQ==", "dev": true, "bin": { "parser": "bin/babel-parser.js" @@ -1380,9 +1381,9 @@ } }, "node_modules/@babel/plugin-transform-spread": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.14.5.tgz", - "integrity": "sha512-/3iqoQdiWergnShZYl0xACb4ADeYCJ7X/RgmwtXshn6cIvautRPAFzhd58frQlokLO6Jb4/3JXvmm6WNTPtiTw==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.14.6.tgz", + "integrity": "sha512-Zr0x0YroFJku7n7+/HH3A2eIrGMjbmAIbJSVv0IZ+t3U2WUQUA64S/oeied2e+MaGSjmt4alzBCsK9E8gh+fag==", "dev": true, "dependencies": { "@babel/helper-plugin-utils": "^7.14.5", @@ -1441,12 +1442,12 @@ } }, "node_modules/@babel/plugin-transform-typescript": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.14.5.tgz", - "integrity": "sha512-cFD5PKp4b8/KkwQ7h71FdPXFvz1RgwTFF9akRZwFldb9G0AHf7CgoPx96c4Q/ZVjh6V81tqQwW5YiHws16OzPg==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.14.6.tgz", + "integrity": "sha512-XlTdBq7Awr4FYIzqhmYY80WN0V0azF74DMPyFqVHBvf81ZUgc4X7ZOpx6O8eLDK6iM5cCQzeyJw0ynTaefixRA==", "dev": true, "dependencies": { - "@babel/helper-create-class-features-plugin": "^7.14.5", + "@babel/helper-create-class-features-plugin": "^7.14.6", "@babel/helper-plugin-utils": "^7.14.5", "@babel/plugin-syntax-typescript": "^7.14.5" }, @@ -1609,9 +1610,9 @@ } }, "node_modules/@babel/runtime": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.14.5.tgz", - "integrity": "sha512-121rumjddw9c3NCQ55KGkyE1h/nzWhU/owjhw0l4mQrkzz4x9SGS1X8gFLraHwX7td3Yo4QTL+qj0NcIzN87BA==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.14.6.tgz", + "integrity": "sha512-/PCB2uJ7oM44tz8YhC4Z/6PeOKXp4K588f+5M3clr1M4zbqztlo0XEfJ2LEzj/FgwfgGcIdl8n7YYjTCI0BYwg==", "dev": true, "dependencies": { "regenerator-runtime": "^0.13.4" @@ -1987,9 +1988,9 @@ "dev": true }, "node_modules/acorn": { - "version": "8.3.0", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.3.0.tgz", - "integrity": "sha512-tqPKHZ5CaBJw0Xmy0ZZvLs1qTV+BNFSyvn77ASXkpBNfIRk8ev26fKrD9iLGwGA9zedPao52GSHzq8lyZG0NUw==", + "version": "8.4.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.4.0.tgz", + "integrity": "sha512-ULr0LDaEqQrMFGyQ3bhJkLsbtrQ8QibAseGZeaSUiT/6zb9IvIkomWHJIvgvwad+hinRAgsI51JcWk2yvwyL+w==", "dev": true, "bin": { "acorn": "bin/acorn" @@ -2347,9 +2348,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001236", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz", - "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==", + "version": "1.0.30001237", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001237.tgz", + "integrity": "sha512-pDHgRndit6p1NR2GhzMbQ6CkRrp4VKuSsqbcLeOQppYPKOYkKT/6ZvZDvKJUqcmtyWIAHuZq3SVS2vc1egCZzw==", "dev": true, "funding": { "type": "opencollective", @@ -4799,9 +4800,9 @@ } }, "node_modules/postcss": { - "version": "8.3.2", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.2.tgz", - "integrity": "sha512-y1FK/AWdZlBF5lusS5j5l4/vF67+vQZt1SXPVJ32y1kRGDQyrs1zk32hG1cInRTu14P0V+orPz+ifwW/7rR4bg==", + "version": "8.3.4", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.4.tgz", + "integrity": "sha512-/tZY0PXExXXnNhKv3TOvZAOUYRyuqcCbBm2c17YMDK0PlVII3K7/LKdt3ScHL+hhouddjUWi+1sKDf9xXW+8YA==", "dev": true, "dependencies": { "colorette": "^1.2.2", @@ -6154,6 +6155,15 @@ "resolved": "https://registry.npmjs.org/three/-/three-0.129.0.tgz", "integrity": "sha512-wiWio1yVRg2Oj6WEWsTHQo5eSzYpEwSBtPSi3OofNpvFbf26HFfb9kw4FZJNjII4qxzp0b1xLB11+tKkBGB1ZA==" }, + "node_modules/three-csg-ts": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/three-csg-ts/-/three-csg-ts-3.1.3.tgz", + "integrity": "sha512-LOTJeO/FpkjHjTbuuV3k/Odr1gdbGJJLzVcD3T50B7p3IjMPa0TrZbNQK/wpB0GMaHmzikgX/hCcP9Ube9ExoQ==", + "peerDependencies": { + "@types/three": ">= 0.125.0", + "three": ">= 0.125.0" + } + }, "node_modules/to-fast-properties": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", @@ -6445,9 +6455,9 @@ } }, "node_modules/webpack": { - "version": "5.38.1", - "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.38.1.tgz", - "integrity": "sha512-OqRmYD1OJbHZph6RUMD93GcCZy4Z4wC0ele4FXyYF0J6AxO1vOSuIlU1hkS/lDlR9CDYBz64MZRmdbdnFFoT2g==", + "version": "5.39.0", + "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.39.0.tgz", + "integrity": "sha512-25CHmuDj+oOTyteI13sUqNlCnjCnySuhiKWE/cRYPQYeoQ3ijHgyWX27CiyUKLNGq27v8S0mrksyTreT/xo7pg==", "dev": true, "dependencies": { "@types/eslint-scope": "^3.7.0", @@ -6872,17 +6882,17 @@ "dev": true }, "@babel/core": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.14.5.tgz", - "integrity": "sha512-RN/AwP2DJmQTZSfiDaD+JQQ/J99KsIpOCfBE5pL+5jJSt7nI3nYGoAXZu+ffYSQ029NLs2DstZb+eR81uuARgg==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.14.6.tgz", + "integrity": "sha512-gJnOEWSqTk96qG5BoIrl5bVtc23DCycmIePPYnamY9RboYdI4nFy5vAQMSl81O5K/W0sLDWfGysnOECC+KUUCA==", "dev": true, "requires": { "@babel/code-frame": "^7.14.5", "@babel/generator": "^7.14.5", "@babel/helper-compilation-targets": "^7.14.5", "@babel/helper-module-transforms": "^7.14.5", - "@babel/helpers": "^7.14.5", - "@babel/parser": "^7.14.5", + "@babel/helpers": "^7.14.6", + "@babel/parser": "^7.14.6", "@babel/template": "^7.14.5", "@babel/traverse": "^7.14.5", "@babel/types": "^7.14.5", @@ -6937,9 +6947,9 @@ } }, "@babel/helper-create-class-features-plugin": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.14.5.tgz", - "integrity": "sha512-Uq9z2e7ZtcnDMirRqAGLRaLwJn+Lrh388v5ETrR3pALJnElVh2zqQmdbz4W2RUJYohAPh2mtyPUgyMHMzXMncQ==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.14.6.tgz", + "integrity": "sha512-Z6gsfGofTxH/+LQXqYEK45kxmcensbzmk/oi8DmaQytlQCgqNZt9XQF8iqlI/SeXWVjaMNxvYvzaYw+kh42mDg==", "dev": true, "requires": { "@babel/helper-annotate-as-pure": "^7.14.5", @@ -7138,9 +7148,9 @@ } }, "@babel/helpers": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.14.5.tgz", - "integrity": "sha512-xtcWOuN9VL6nApgVHtq3PPcQv5qFBJzoSZzJ/2c0QK/IP/gxVcoWSNQwFEGvmbQsuS9rhYqjILDGGXcTkA705Q==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.14.6.tgz", + "integrity": "sha512-yesp1ENQBiLI+iYHSJdoZKUtRpfTlL1grDIX9NRlAVppljLw/4tTyYupIB7uIYmC3stW/imAv8EqaKaS/ibmeA==", "dev": true, "requires": { "@babel/template": "^7.14.5", @@ -7160,9 +7170,9 @@ } }, "@babel/parser": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.14.5.tgz", - "integrity": "sha512-TM8C+xtH/9n1qzX+JNHi7AN2zHMTiPUtspO0ZdHflW8KaskkALhMmuMHb4bCmNdv9VAPzJX3/bXqkVLnAvsPfg==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.14.6.tgz", + "integrity": "sha512-oG0ej7efjEXxb4UgE+klVx+3j4MVo+A2vCzm7OUN4CLo6WhQ+vSOD2yJ8m7B+DghObxtLxt3EfgMWpq+AsWehQ==", "dev": true }, "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": { @@ -7760,9 +7770,9 @@ } }, "@babel/plugin-transform-spread": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.14.5.tgz", - "integrity": "sha512-/3iqoQdiWergnShZYl0xACb4ADeYCJ7X/RgmwtXshn6cIvautRPAFzhd58frQlokLO6Jb4/3JXvmm6WNTPtiTw==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.14.6.tgz", + "integrity": "sha512-Zr0x0YroFJku7n7+/HH3A2eIrGMjbmAIbJSVv0IZ+t3U2WUQUA64S/oeied2e+MaGSjmt4alzBCsK9E8gh+fag==", "dev": true, "requires": { "@babel/helper-plugin-utils": "^7.14.5", @@ -7797,12 +7807,12 @@ } }, "@babel/plugin-transform-typescript": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.14.5.tgz", - "integrity": "sha512-cFD5PKp4b8/KkwQ7h71FdPXFvz1RgwTFF9akRZwFldb9G0AHf7CgoPx96c4Q/ZVjh6V81tqQwW5YiHws16OzPg==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.14.6.tgz", + "integrity": "sha512-XlTdBq7Awr4FYIzqhmYY80WN0V0azF74DMPyFqVHBvf81ZUgc4X7ZOpx6O8eLDK6iM5cCQzeyJw0ynTaefixRA==", "dev": true, "requires": { - "@babel/helper-create-class-features-plugin": "^7.14.5", + "@babel/helper-create-class-features-plugin": "^7.14.6", "@babel/helper-plugin-utils": "^7.14.5", "@babel/plugin-syntax-typescript": "^7.14.5" } @@ -7932,9 +7942,9 @@ } }, "@babel/runtime": { - "version": "7.14.5", - "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.14.5.tgz", - "integrity": "sha512-121rumjddw9c3NCQ55KGkyE1h/nzWhU/owjhw0l4mQrkzz4x9SGS1X8gFLraHwX7td3Yo4QTL+qj0NcIzN87BA==", + "version": "7.14.6", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.14.6.tgz", + "integrity": "sha512-/PCB2uJ7oM44tz8YhC4Z/6PeOKXp4K588f+5M3clr1M4zbqztlo0XEfJ2LEzj/FgwfgGcIdl8n7YYjTCI0BYwg==", "dev": true, "requires": { "regenerator-runtime": "^0.13.4" @@ -8269,9 +8279,9 @@ "dev": true }, "acorn": { - "version": "8.3.0", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.3.0.tgz", - "integrity": "sha512-tqPKHZ5CaBJw0Xmy0ZZvLs1qTV+BNFSyvn77ASXkpBNfIRk8ev26fKrD9iLGwGA9zedPao52GSHzq8lyZG0NUw==", + "version": "8.4.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.4.0.tgz", + "integrity": "sha512-ULr0LDaEqQrMFGyQ3bhJkLsbtrQ8QibAseGZeaSUiT/6zb9IvIkomWHJIvgvwad+hinRAgsI51JcWk2yvwyL+w==", "dev": true }, "adjust-sourcemap-loader": { @@ -8548,9 +8558,9 @@ } }, "caniuse-lite": { - "version": "1.0.30001236", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz", - "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==", + "version": "1.0.30001237", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001237.tgz", + "integrity": "sha512-pDHgRndit6p1NR2GhzMbQ6CkRrp4VKuSsqbcLeOQppYPKOYkKT/6ZvZDvKJUqcmtyWIAHuZq3SVS2vc1egCZzw==", "dev": true }, "caseless": { @@ -10391,9 +10401,9 @@ } }, "postcss": { - "version": "8.3.2", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.2.tgz", - "integrity": "sha512-y1FK/AWdZlBF5lusS5j5l4/vF67+vQZt1SXPVJ32y1kRGDQyrs1zk32hG1cInRTu14P0V+orPz+ifwW/7rR4bg==", + "version": "8.3.4", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.4.tgz", + "integrity": "sha512-/tZY0PXExXXnNhKv3TOvZAOUYRyuqcCbBm2c17YMDK0PlVII3K7/LKdt3ScHL+hhouddjUWi+1sKDf9xXW+8YA==", "dev": true, "requires": { "colorette": "^1.2.2", @@ -11411,6 +11421,12 @@ "resolved": "https://registry.npmjs.org/three/-/three-0.129.0.tgz", "integrity": "sha512-wiWio1yVRg2Oj6WEWsTHQo5eSzYpEwSBtPSi3OofNpvFbf26HFfb9kw4FZJNjII4qxzp0b1xLB11+tKkBGB1ZA==" }, + "three-csg-ts": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/three-csg-ts/-/three-csg-ts-3.1.3.tgz", + "integrity": "sha512-LOTJeO/FpkjHjTbuuV3k/Odr1gdbGJJLzVcD3T50B7p3IjMPa0TrZbNQK/wpB0GMaHmzikgX/hCcP9Ube9ExoQ==", + "requires": {} + }, "to-fast-properties": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", @@ -11628,9 +11644,9 @@ } }, "webpack": { - "version": "5.38.1", - "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.38.1.tgz", - "integrity": "sha512-OqRmYD1OJbHZph6RUMD93GcCZy4Z4wC0ele4FXyYF0J6AxO1vOSuIlU1hkS/lDlR9CDYBz64MZRmdbdnFFoT2g==", + "version": "5.39.0", + "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.39.0.tgz", + "integrity": "sha512-25CHmuDj+oOTyteI13sUqNlCnjCnySuhiKWE/cRYPQYeoQ3ijHgyWX27CiyUKLNGq27v8S0mrksyTreT/xo7pg==", "dev": true, "requires": { "@types/eslint-scope": "^3.7.0", diff --git a/package.json b/package.json index 7f10118..c26a119 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,8 @@ "lodash": "^4.17.21", "normalize.css": "^8.0.1", "proj4": "^2.6.3", - "three": "^0.129.0" + "three": "^0.129.0", + "three-csg-ts": "^3.1.3" }, "author": "Arno Kaimbacher", "license": "MIT", diff --git a/src/js/clip/Selection.ts b/src/js/clip/Selection.ts index 3a36886..5404687 100644 --- a/src/js/clip/Selection.ts +++ b/src/js/clip/Selection.ts @@ -7,6 +7,7 @@ import { SelectionBoxLine } from './SelectionBoxLine'; import { Layer } from '../layer/Layer'; import { Group } from 'three/src/objects/Group'; import { UpdatableBoxGeometry } from './UpdatableBoxGeometry'; +import { TinLayer } from '../layer/TinLayer'; export class Selection extends Layer { visible; @@ -96,8 +97,15 @@ export class Selection extends Layer { onAdd(map) { this.map = map; - this.build(this.getScene()); + this.build(this.getScene()); this.emit('add'); + if (this.map.layers) { + for (const [key, layer] of Object.entries(this.map.layers)) { + if (layer instanceof TinLayer) { + layer.buildBorder(this.vertices); + } + } + } } onRemove(map) { @@ -226,5 +234,12 @@ export class Selection extends Layer { this.updateGeometries(); // this.setBox(); this.box.update(); + // if (this.map.layers) { + // for (const [key, layer] of Object.entries(this.map.layers)) { + // if (layer instanceof TinLayer) { + // layer.box.update(); + // } + // } + // } } } \ No newline at end of file diff --git a/src/js/intersectionArea.txt b/src/js/intersectionArea.txt new file mode 100644 index 0000000..ca88434 --- /dev/null +++ b/src/js/intersectionArea.txt @@ -0,0 +1,3 @@ +https://jsfiddle.net/prisoner849/8uxw667m/ + +https://stackoverflow.com/questions/42348495/three-js-find-all-points-where-a-mesh-intersects-a-plane \ No newline at end of file diff --git a/src/js/layer/TinLayer.ts b/src/js/layer/TinLayer.ts index 7f5bca6..806406b 100644 --- a/src/js/layer/TinLayer.ts +++ b/src/js/layer/TinLayer.ts @@ -6,6 +6,7 @@ import { Layer } from './Layer'; import { BitStream } from '../lib/bitstream'; import { Vector3 } from 'three/src/math/Vector3'; import { MyMeshStandardMaterial } from '../clip/MyMeshStandardMaterial'; +import { MeshBasicMaterial } from 'three/src/materials/MeshBasicMaterial'; import { Group } from 'three/src/objects/Group'; import { TextureLoader } from 'three/src/loaders/TextureLoader'; import proj4 from 'proj4/dist/proj4-src'; @@ -16,6 +17,9 @@ import { Vector2 } from 'three/src/math/Vector2'; import { Matrix4 } from 'three/src/math/Matrix4'; import { Box3 } from 'three/src/math/Box3'; import { uniforms } from '../clip/uniforms'; +import { UpdatableBoxGeometry } from '../clip/UpdatableBoxGeometry'; +import { Scene } from 'three/src/scenes/Scene'; +import { CSG } from 'three-csg-ts'; const POINTURL = 'https://geusegdi01.geus.dk/geom3d/data/nodes/'; const EDGEURL = 'https://geusegdi01.geus.dk/geom3d/data/triangles/'; @@ -36,7 +40,9 @@ class TinLayer extends Layer { featuregeom_id: number; color: string; mainMesh; + borderMesh; geometry: BufferGeometry; + box: UpdatableBoxGeometry; uniforms; // uniforms = { // clipping: { @@ -72,6 +78,9 @@ class TinLayer extends Layer { texture: undefined } ]; + frontStencil: Scene; + backStencil: Scene; + capsScene: Scene; constructor(params) { super(); @@ -92,6 +101,70 @@ class TinLayer extends Layer { this.uniforms = uniforms; } + buildBorder(vertices) { + let box = this.box = new UpdatableBoxGeometry(vertices) + // this.boxMesh = new Mesh(box, material.capMaterial); + + // let color = parseInt(this.color, 16); + // let meshMaterial = new MeshBasicMaterial({ + // color: color, + // side: DoubleSide + // }); + // this.materialsArray.push(meshMaterial); + // let meshA = this.mainMesh; + // let meshB = this.borderMesh = new Mesh(box, meshMaterial); + // this._addObject(mesh, false); + + // Make sure the .matrix of each mesh is current + // meshA.updateMatrix(); + // meshB.updateMatrix(); + + + // // Subtract meshB from meshA + // this.borderMesh = CSG.subtract(meshA, meshB); + // this._addObject(this.borderMesh, false); + + // this.frontStencil = new Scene(); + // let frontMesh = new Mesh(this.geometry.clone(), material.frontStencilMaterial); + // frontMesh.userData.layerId = this.index; + // this.frontStencil.add(frontMesh); + + // this.backStencil = new Scene(); + // let backMesh = new Mesh(this.geometry.clone(), material.backStencilMaterial); + // backMesh.userData.layerId = this.index; + // this.backStencil.add(frontMesh); + + // this.capsScene = new Scene(); + // this.capsScene.add(this.borderMesh); + } + + // animate() { + // let gl = this._map.renderer.getContext(); + + // if (gl != undefined && this.capsScene != undefined) { + // gl.enable(gl.STENCIL_TEST); + // // this.renderer.state.setStencilFunc( true ); + // // gl.stencilFunc( gl.ALWAYS, 1, 0xff ); + // // gl.stencilOp( gl.REPLACE, gl.REPLACE, gl.REPLACE ); + + // gl.stencilFunc(gl.ALWAYS, 1, 0xff); + // gl.stencilOp(gl.KEEP, gl.KEEP, gl.INCR); + // this._map.renderer.render(this.backStencil, this._map.camera); + + // gl.stencilFunc(gl.ALWAYS, 1, 0xff); + // gl.stencilOp(gl.KEEP, gl.KEEP, gl.DECR); + // this._map.renderer.render(this.frontStencil, this._map.camera); + + // gl.stencilFunc(gl.EQUAL, 1, 0xff); + // gl.stencilOp(gl.KEEP, gl.KEEP, gl.KEEP); + // this._map.renderer.render(this.capsScene, this._map.camera); + + + // // disable stencil test + // gl.disable(gl.STENCIL_TEST); + // } + // } + setWireframeMode(wireframe) { this.materialsArray.forEach(function (mat) { //if (m.w) return; @@ -395,12 +468,12 @@ class TinLayer extends Layer { this.material = new ShaderMaterial({ transparent: true, // side: DoubleSide, - uniforms: this.uniforms.clipping, + uniforms: this.uniforms.clipping, vertexShader: shader.vertexClipping, fragmentShader: shader.fragmentClippingFront, }); - } else { + } else { // this.uniforms.clipping.clippingScale = { type: "f", value: 1.0 }; // this.uniforms.clipping.color = { type: "c", value: new Color(color) }; // this.uniforms.clipping.clippingLow = { type: "v3", value: new Vector3(0, 0, 0) }; diff --git a/src/js/main.js b/src/js/main.js index 1e2dfe5..d1343b4 100644 --- a/src/js/main.js +++ b/src/js/main.js @@ -31,6 +31,8 @@ import { TinLayer } from './layer/TinLayer'; class Application { + capsSceneArray; + constructor(container) { this.container = container; this.running = false; @@ -83,9 +85,9 @@ class Application { _paq.push(['setSiteId', MATOMO_SITE_ID]); let d = document; let g = d.createElement('script'); let s = d.getElementsByTagName('script')[0]; - g.type = 'text/javascript'; - g.async = true; - g.src = u + 'matomo.js'; + g.type = 'text/javascript'; + g.async = true; + g.src = u + 'matomo.js'; s.parentNode.insertBefore(g, s); })(); } @@ -109,7 +111,6 @@ class Application { this.queryMarker.visible = true; // this.queryMarker.position.set(4282010, 2302070, -13616.3); /* Renderer */ - // let bgcolor = 0xfdfdfd; this.renderer = new WebGLRenderer({ alpha: true, antialias: true, preserveDrawingBuffer: true }); this.renderer.setPixelRatio(window.devicePixelRatio); this.renderer.setSize(this.width, this.height); @@ -128,6 +129,7 @@ class Application { this.capsScene = new Scene(); this.backStencil = new Scene(); this.frontStencil = new Scene(); + this.capsSceneArray = new Array(); this._buildDefaultLights(this.scene); //app.scene.autoUpdate = false; //// show axes in the screen @@ -189,6 +191,20 @@ class Application { // this.scene.add(this.selection.touchMeshes); this.map.addLayer(this.selectionBox); + // for (const [key, layer] of Object.entries(this.map.layers)) { + // // let layer = map.layers[i]; + // if (layer instanceof TinLayer && layer.name != "Topography") { + // // let capsScene = new Scene(); + // // capsScene.add(layer.borderMesh); + // // this.capsSceneArray.push(capsScene); + // this.capsScene.add(layer.borderMesh); + // layer.on('visibility-change', (args) => { + // let visible = args[0]; + // layer.borderMesh.visible = visible; + // }); + // } + // } + let frontGroup = new Group(); for (var i in map.layers) { let layer = map.layers[i]; @@ -370,10 +386,15 @@ class Application { if (this.showCaps && gl != undefined) { // enable stencil test gl.enable(gl.STENCIL_TEST); - // this.renderer.state.setStencilFunc( true ); - // gl.stencilFunc( gl.ALWAYS, 1, 0xff ); - // gl.stencilOp( gl.REPLACE, gl.REPLACE, gl.REPLACE ); + // for (let i in this.map.layers) { + // let layer = this.map.layers[i]; + // if (layer instanceof TinLayer && layer.name != "Topography") { + // layer.animate(); + // break; + // } + // } + gl.stencilFunc(gl.ALWAYS, 1, 0xff); gl.stencilOp(gl.KEEP, gl.KEEP, gl.INCR); this.renderer.render(this.backStencil, this.map.camera);