refactor

Author: Kanahiro

dev/main.ts

@@ -72,10 +72,9 @@ const state = {
 	stats: '',
 };
 
-const classificationColors: Record<string, string> = {};
+const classificationHexColors: Record<string, string> = {};
 for (const [code, rgb] of Object.entries(DEFAULT_CLASSIFICATION_COLORS)) {
-	const label = CLASSIFICATION_LABELS[Number(code)] ?? `Class ${code}`;
-	classificationColors[`${code}: ${label}`] = rgbToHex(...rgb);
+	classificationHexColors[code] = rgbToHex(...rgb);
 }
 
 // --- Map ---
@@ -109,9 +108,8 @@ function getClassificationColorsMap(): Record<
 	[number, number, number]
 > {
 	const result: Record<number, [number, number, number]> = {};
-	for (const [key, hex] of Object.entries(classificationColors)) {
-		const code = Number(key.split(':')[0]);
-		result[code] = hexToRgb(hex);
+	for (const [code, hex] of Object.entries(classificationHexColors)) {
+		result[Number(code)] = hexToRgb(hex);
 	}
 	return result;
 }
@@ -216,8 +214,13 @@ edl
 	});
 
 const classificationFolder = gui.addFolder('Classification Colors');
-for (const key of Object.keys(classificationColors)) {
-	classificationFolder.addColor(classificationColors, key).onChange(loadCopc);
+for (const code of Object.keys(classificationHexColors)) {
+	const num = Number(code);
+	const label = CLASSIFICATION_LABELS[num] ?? `Class ${code}`;
+	classificationFolder
+		.addColor(classificationHexColors, code)
+		.name(`${code}: ${label}`)
+		.onChange(loadCopc);
 }
 classificationFolder.show(state.colorMode === 'classification');
 

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "maplibre-copc-layer",
 	"type": "module",
-	"version": "0.1.2",
+	"version": "0.1.3",
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/Kanahiro/maplibre-copc-layer.git"

src/constants.ts

@@ -0,0 +1,17 @@
+export const DEFAULT_CLASSIFICATION_COLORS: Record<number, [number, number, number]> = {
+	0: [0.5, 0.5, 0.5],     // Never Classified
+	1: [0.7, 0.7, 0.7],     // Unclassified
+	2: [0.6, 0.4, 0.2],     // Ground
+	3: [0.5, 0.8, 0.5],     // Low Vegetation
+	4: [0.2, 0.7, 0.2],     // Medium Vegetation
+	5: [0.0, 0.4, 0.0],     // High Vegetation
+	6: [1.0, 0.2, 0.2],     // Building
+	7: [0.3, 0.3, 0.3],     // Low Point (noise)
+	8: [0.6, 0.3, 0.8],     // Model Key-point
+	9: [0.2, 0.4, 1.0],     // Water
+	10: [1.0, 0.6, 0.0],    // Rail
+	11: [0.9, 0.9, 0.3],    // Road Surface
+	12: [0.0, 0.8, 0.8],    // Overlap
+	17: [0.9, 0.5, 0.4],    // Bridge Deck
+	18: [0.5, 0.0, 0.0],    // High Noise
+};

src/copclayer.ts

@@ -6,7 +6,7 @@ import pointsFragmentShader from './shaders/points.frag.glsl';
 import edlVertexShader from './shaders/edl.vert.glsl';
 import edlFragmentShader from './shaders/edl.frag.glsl';
 import CopcWorker from './worker/index.ts?worker&inline';
-import lazPerfWasmUrl from '../vendor/laz-perf/js/src/laz-perf.wasm?url';
+import { DEFAULT_CLASSIFICATION_COLORS } from './constants';
 
 const EARTH_CIRCUMFERENCE = 2 * Math.PI * 6378137.0;
 const DEG2RAD = Math.PI / 180;
@@ -36,7 +36,7 @@ type ResolvedOptions = Required<CopcLayerOptions>;
 const DEFAULT_OPTIONS: ResolvedOptions = {
 	pointSize: 6,
 	colorMode: 'rgb',
-	classificationColors: {},
+	classificationColors: { ...DEFAULT_CLASSIFICATION_COLORS },
 	maxCacheSize: 100,
 	sseThreshold: 8,
 	depthTest: true,
@@ -314,8 +314,6 @@ export class CopcLayer implements maplibregl.CustomLayerInterface {
 			options: {
 				colorMode: this.options.colorMode,
 				classificationColors: this.options.classificationColors,
-				maxCacheSize: this.options.maxCacheSize,
-				wasmPath: lazPerfWasmUrl,
 			},
 		});