@realsee/dnalogel 2.0.0-alpha.15 → 2.0.0-alpha.16

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # CHANGELOG
 
+## 2.0.0-alpha.16
+- 1.fix: 修复 z-index 问题；
+- 2.fix: 修复 ModelItemLabelPlugin 事件监听问题。
+
 ## 2.0.0-alpha.15
 - 1.refactor: 优化 ModelItemLabelPlugin 在调用 five.setState() 时的动画显示。
 

package/dist/ModelItemLabelPlugin/index.js

@@ -36,6 +36,7 @@ var DISPLAY_STRATEGY_TYPE;
     DISPLAY_STRATEGY_TYPE["SMALL"] = "small";
     DISPLAY_STRATEGY_TYPE["MIDLLE"] = "middle";
     DISPLAY_STRATEGY_TYPE["LARGE"] = "large";
+    DISPLAY_STRATEGY_TYPE["EXTRA_LARGE"] = "x-large";
 })(DISPLAY_STRATEGY_TYPE || (DISPLAY_STRATEGY_TYPE = {}));
 
 /* src/ModelItemLabelPlugin/ItemLabelItem.svelte generated by Svelte v3.47.0 */
@@ -172,11 +173,11 @@ function add_css(target) {
 
 function get_each_context(ctx, list, i) {
 	const child_ctx = ctx.slice();
-	child_ctx[27] = list[i];
+	child_ctx[28] = list[i];
 	return child_ctx;
 }
 
-// (159:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
+// (162:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
 function create_each_block(key_1, ctx) {
 	let first;
 	let itemlabelitem;
@@ -184,7 +185,7 @@ function create_each_block(key_1, ctx) {
 
 	itemlabelitem = new ItemLabelItem({
 			props: {
-				itemLabel: /*itemLabelItem*/ ctx[27],
+				itemLabel: /*itemLabelItem*/ ctx[28],
 				hooks: /*hooks*/ ctx[0]
 			}
 		});
@@ -205,7 +206,7 @@ function create_each_block(key_1, ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 			const itemlabelitem_changes = {};
-			if (dirty & /*renderItemLabels*/ 2) itemlabelitem_changes.itemLabel = /*itemLabelItem*/ ctx[27];
+			if (dirty & /*renderItemLabels*/ 2) itemlabelitem_changes.itemLabel = /*itemLabelItem*/ ctx[28];
 			if (dirty & /*hooks*/ 1) itemlabelitem_changes.hooks = /*hooks*/ ctx[0];
 			itemlabelitem.$set(itemlabelitem_changes);
 		},
@@ -232,7 +233,7 @@ function create_fragment(ctx) {
 	let div_resize_listener;
 	let current;
 	let each_value = /*renderItemLabels*/ ctx[1];
-	const get_key = ctx => /*itemLabelItem*/ ctx[27].id;
+	const get_key = ctx => /*itemLabelItem*/ ctx[28].id;
 
 	for (let i = 0; i < each_value.length; i += 1) {
 		let child_ctx = get_each_context(ctx, each_value, i);
@@ -383,6 +384,8 @@ function instance($$self, $$props, $$invalidate) {
 				return Math.ceil(-38.9 * itemSpaceHeight + 130);
 			case DISPLAY_STRATEGY_TYPE.LARGE:
 				return Math.ceil(-44.44 * itemSpaceHeight + 140);
+			case DISPLAY_STRATEGY_TYPE.EXTRA_LARGE:
+				return Math.ceil(-92.59 * itemSpaceHeight + 300);
 		}
 	}
 
@@ -429,16 +432,17 @@ function instance($$self, $$props, $$invalidate) {
 		addDataUpdateListener();
 	});
 
+	const handleCameraUpdateCallback = () => {
+		$$invalidate(4, itemsVisible = false);
+		handleCameraUpdate();
+	};
+
 	svelte.onMount(() => {
 		$$invalidate(1, renderItemLabels = itemLabels);
 		curItemLabels = itemLabels;
 		onItemLabelUpdate();
 		addResizeListener();
-
-		five.on('cameraUpdate', () => {
-			$$invalidate(4, itemsVisible = false);
-			handleCameraUpdate();
-		});
+		five.on('cameraUpdate', handleCameraUpdateCallback);
 	});
 
 	const handleCameraUpdate = debounce(
@@ -479,12 +483,11 @@ function instance($$self, $$props, $$invalidate) {
 		});
 
 	svelte.onDestroy(() => {
-		five.off('cameraUpdate');
+		five.off('cameraUpdate', handleCameraUpdateCallback);
 		resizeObserver.unobserve(wrapper);
-		curItemLabels = null;
-		$$invalidate(1, renderItemLabels = null);
-		wrapperSize = { width: 0, height: 0 };
-	});
+	}); // curItemLabels = null
+	// renderItemLabels = null
+	// wrapperSize = { width: 0, height: 0 }
 
 	function div_elementresize_handler() {
 		containerWidth = this.clientWidth;
@@ -566,6 +569,7 @@ const ModelItemLabelPlugin = (five$1, params) => {
         top: 0;
         width: 100%;
         height: 100%;
+        z-index: 5;
     `;
     pluginState.container.style.pointerEvents = 'none'; // 写到 cssText 里不生效
     const appendTo = (wrapper) => {

package/dist/ModelItemLabelPlugin/typings.d.ts

@@ -4,7 +4,8 @@ import { PluginEvent } from "./events.type";
 export declare enum DISPLAY_STRATEGY_TYPE {
     SMALL = "small",
     MIDLLE = "middle",
-    LARGE = "large"
+    LARGE = "large",
+    EXTRA_LARGE = "x-large"
 }
 export interface ModelItemLabelPluginParametersType {
     modelOcclusionEnable?: boolean;

package/dist/ModelRoomLabelPlugin/index.js

@@ -425,6 +425,7 @@ class ModelRoomLabelController {
         this.container.style.pointerEvents = 'none';
         this.container.style.left = '0';
         this.container.style.top = '0';
+        this.container.style.zIndex = '5';
         // five listener
         this.five.once('dispose', () => this.dispose());
         this.five.on('modeChange', this.onFiveModeChange);

package/dist/index.es.js

@@ -892,6 +892,7 @@ class ModelRoomLabelController {
         this.container.style.pointerEvents = 'none';
         this.container.style.left = '0';
         this.container.style.top = '0';
+        this.container.style.zIndex = '5';
         // five listener
         this.five.once('dispose', () => this.dispose());
         this.five.on('modeChange', this.onFiveModeChange);
@@ -14252,6 +14253,7 @@ var DISPLAY_STRATEGY_TYPE;
     DISPLAY_STRATEGY_TYPE["SMALL"] = "small";
     DISPLAY_STRATEGY_TYPE["MIDLLE"] = "middle";
     DISPLAY_STRATEGY_TYPE["LARGE"] = "large";
+    DISPLAY_STRATEGY_TYPE["EXTRA_LARGE"] = "x-large";
 })(DISPLAY_STRATEGY_TYPE || (DISPLAY_STRATEGY_TYPE = {}));
 
 /* src/ModelItemLabelPlugin/ItemLabelItem.svelte generated by Svelte v3.47.0 */
@@ -14388,11 +14390,11 @@ function add_css(target) {
 
 function get_each_context(ctx, list, i) {
 	const child_ctx = ctx.slice();
-	child_ctx[27] = list[i];
+	child_ctx[28] = list[i];
 	return child_ctx;
 }
 
-// (159:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
+// (162:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
 function create_each_block(key_1, ctx) {
 	let first;
 	let itemlabelitem;
@@ -14400,7 +14402,7 @@ function create_each_block(key_1, ctx) {
 
 	itemlabelitem = new ItemLabelItem({
 			props: {
-				itemLabel: /*itemLabelItem*/ ctx[27],
+				itemLabel: /*itemLabelItem*/ ctx[28],
 				hooks: /*hooks*/ ctx[0]
 			}
 		});
@@ -14421,7 +14423,7 @@ function create_each_block(key_1, ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 			const itemlabelitem_changes = {};
-			if (dirty & /*renderItemLabels*/ 2) itemlabelitem_changes.itemLabel = /*itemLabelItem*/ ctx[27];
+			if (dirty & /*renderItemLabels*/ 2) itemlabelitem_changes.itemLabel = /*itemLabelItem*/ ctx[28];
 			if (dirty & /*hooks*/ 1) itemlabelitem_changes.hooks = /*hooks*/ ctx[0];
 			itemlabelitem.$set(itemlabelitem_changes);
 		},
@@ -14448,7 +14450,7 @@ function create_fragment(ctx) {
 	let div_resize_listener;
 	let current;
 	let each_value = /*renderItemLabels*/ ctx[1];
-	const get_key = ctx => /*itemLabelItem*/ ctx[27].id;
+	const get_key = ctx => /*itemLabelItem*/ ctx[28].id;
 
 	for (let i = 0; i < each_value.length; i += 1) {
 		let child_ctx = get_each_context(ctx, each_value, i);
@@ -14599,6 +14601,8 @@ function instance($$self, $$props, $$invalidate) {
 				return Math.ceil(-38.9 * itemSpaceHeight + 130);
 			case DISPLAY_STRATEGY_TYPE.LARGE:
 				return Math.ceil(-44.44 * itemSpaceHeight + 140);
+			case DISPLAY_STRATEGY_TYPE.EXTRA_LARGE:
+				return Math.ceil(-92.59 * itemSpaceHeight + 300);
 		}
 	}
 
@@ -14645,16 +14649,17 @@ function instance($$self, $$props, $$invalidate) {
 		addDataUpdateListener();
 	});
 
+	const handleCameraUpdateCallback = () => {
+		$$invalidate(4, itemsVisible = false);
+		handleCameraUpdate();
+	};
+
 	onMount(() => {
 		$$invalidate(1, renderItemLabels = itemLabels);
 		curItemLabels = itemLabels;
 		onItemLabelUpdate();
 		addResizeListener();
-
-		five.on('cameraUpdate', () => {
-			$$invalidate(4, itemsVisible = false);
-			handleCameraUpdate();
-		});
+		five.on('cameraUpdate', handleCameraUpdateCallback);
 	});
 
 	const handleCameraUpdate = debounce(
@@ -14695,12 +14700,11 @@ function instance($$self, $$props, $$invalidate) {
 		});
 
 	onDestroy(() => {
-		five.off('cameraUpdate');
+		five.off('cameraUpdate', handleCameraUpdateCallback);
 		resizeObserver.unobserve(wrapper);
-		curItemLabels = null;
-		$$invalidate(1, renderItemLabels = null);
-		wrapperSize = { width: 0, height: 0 };
-	});
+	}); // curItemLabels = null
+	// renderItemLabels = null
+	// wrapperSize = { width: 0, height: 0 }
 
 	function div_elementresize_handler() {
 		containerWidth = this.clientWidth;
@@ -14782,6 +14786,7 @@ const ModelItemLabelPlugin = (five, params) => {
         top: 0;
         width: 100%;
         height: 100%;
+        z-index: 5;
     `;
     pluginState.container.style.pointerEvents = 'none'; // 写到 cssText 里不生效
     const appendTo = (wrapper) => {

package/dist/index.js

@@ -919,6 +919,7 @@ class ModelRoomLabelController {
         this.container.style.pointerEvents = 'none';
         this.container.style.left = '0';
         this.container.style.top = '0';
+        this.container.style.zIndex = '5';
         // five listener
         this.five.once('dispose', () => this.dispose());
         this.five.on('modeChange', this.onFiveModeChange);
@@ -14279,6 +14280,7 @@ var DISPLAY_STRATEGY_TYPE;
     DISPLAY_STRATEGY_TYPE["SMALL"] = "small";
     DISPLAY_STRATEGY_TYPE["MIDLLE"] = "middle";
     DISPLAY_STRATEGY_TYPE["LARGE"] = "large";
+    DISPLAY_STRATEGY_TYPE["EXTRA_LARGE"] = "x-large";
 })(DISPLAY_STRATEGY_TYPE || (DISPLAY_STRATEGY_TYPE = {}));
 
 /* src/ModelItemLabelPlugin/ItemLabelItem.svelte generated by Svelte v3.47.0 */
@@ -14415,11 +14417,11 @@ function add_css(target) {
 
 function get_each_context(ctx, list, i) {
 	const child_ctx = ctx.slice();
-	child_ctx[27] = list[i];
+	child_ctx[28] = list[i];
 	return child_ctx;
 }
 
-// (159:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
+// (162:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
 function create_each_block(key_1, ctx) {
 	let first;
 	let itemlabelitem;
@@ -14427,7 +14429,7 @@ function create_each_block(key_1, ctx) {
 
 	itemlabelitem = new ItemLabelItem({
 			props: {
-				itemLabel: /*itemLabelItem*/ ctx[27],
+				itemLabel: /*itemLabelItem*/ ctx[28],
 				hooks: /*hooks*/ ctx[0]
 			}
 		});
@@ -14448,7 +14450,7 @@ function create_each_block(key_1, ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 			const itemlabelitem_changes = {};
-			if (dirty & /*renderItemLabels*/ 2) itemlabelitem_changes.itemLabel = /*itemLabelItem*/ ctx[27];
+			if (dirty & /*renderItemLabels*/ 2) itemlabelitem_changes.itemLabel = /*itemLabelItem*/ ctx[28];
 			if (dirty & /*hooks*/ 1) itemlabelitem_changes.hooks = /*hooks*/ ctx[0];
 			itemlabelitem.$set(itemlabelitem_changes);
 		},
@@ -14475,7 +14477,7 @@ function create_fragment(ctx) {
 	let div_resize_listener;
 	let current;
 	let each_value = /*renderItemLabels*/ ctx[1];
-	const get_key = ctx => /*itemLabelItem*/ ctx[27].id;
+	const get_key = ctx => /*itemLabelItem*/ ctx[28].id;
 
 	for (let i = 0; i < each_value.length; i += 1) {
 		let child_ctx = get_each_context(ctx, each_value, i);
@@ -14626,6 +14628,8 @@ function instance($$self, $$props, $$invalidate) {
 				return Math.ceil(-38.9 * itemSpaceHeight + 130);
 			case DISPLAY_STRATEGY_TYPE.LARGE:
 				return Math.ceil(-44.44 * itemSpaceHeight + 140);
+			case DISPLAY_STRATEGY_TYPE.EXTRA_LARGE:
+				return Math.ceil(-92.59 * itemSpaceHeight + 300);
 		}
 	}
 
@@ -14672,16 +14676,17 @@ function instance($$self, $$props, $$invalidate) {
 		addDataUpdateListener();
 	});
 
+	const handleCameraUpdateCallback = () => {
+		$$invalidate(4, itemsVisible = false);
+		handleCameraUpdate();
+	};
+
 	svelte.onMount(() => {
 		$$invalidate(1, renderItemLabels = itemLabels);
 		curItemLabels = itemLabels;
 		onItemLabelUpdate();
 		addResizeListener();
-
-		five.on('cameraUpdate', () => {
-			$$invalidate(4, itemsVisible = false);
-			handleCameraUpdate();
-		});
+		five.on('cameraUpdate', handleCameraUpdateCallback);
 	});
 
 	const handleCameraUpdate = debounce(
@@ -14722,12 +14727,11 @@ function instance($$self, $$props, $$invalidate) {
 		});
 
 	svelte.onDestroy(() => {
-		five.off('cameraUpdate');
+		five.off('cameraUpdate', handleCameraUpdateCallback);
 		resizeObserver.unobserve(wrapper);
-		curItemLabels = null;
-		$$invalidate(1, renderItemLabels = null);
-		wrapperSize = { width: 0, height: 0 };
-	});
+	}); // curItemLabels = null
+	// renderItemLabels = null
+	// wrapperSize = { width: 0, height: 0 }
 
 	function div_elementresize_handler() {
 		containerWidth = this.clientWidth;
@@ -14809,6 +14813,7 @@ const ModelItemLabelPlugin = (five$1, params) => {
         top: 0;
         width: 100%;
         height: 100%;
+        z-index: 5;
     `;
     pluginState.container.style.pointerEvents = 'none'; // 写到 cssText 里不生效
     const appendTo = (wrapper) => {

package/dist/index.umd.js

@@ -908,6 +908,7 @@
             this.container.style.pointerEvents = 'none';
             this.container.style.left = '0';
             this.container.style.top = '0';
+            this.container.style.zIndex = '5';
             // five listener
             this.five.once('dispose', () => this.dispose());
             this.five.on('modeChange', this.onFiveModeChange);
@@ -14268,6 +14269,7 @@
         DISPLAY_STRATEGY_TYPE["SMALL"] = "small";
         DISPLAY_STRATEGY_TYPE["MIDLLE"] = "middle";
         DISPLAY_STRATEGY_TYPE["LARGE"] = "large";
+        DISPLAY_STRATEGY_TYPE["EXTRA_LARGE"] = "x-large";
     })(DISPLAY_STRATEGY_TYPE || (DISPLAY_STRATEGY_TYPE = {}));
 
     /* src/ModelItemLabelPlugin/ItemLabelItem.svelte generated by Svelte v3.47.0 */
@@ -14404,11 +14406,11 @@
 
     function get_each_context(ctx, list, i) {
     	const child_ctx = ctx.slice();
-    	child_ctx[27] = list[i];
+    	child_ctx[28] = list[i];
     	return child_ctx;
     }
 
-    // (159:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
+    // (162:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
     function create_each_block(key_1, ctx) {
     	let first;
     	let itemlabelitem;
@@ -14416,7 +14418,7 @@
 
     	itemlabelitem = new ItemLabelItem({
     			props: {
-    				itemLabel: /*itemLabelItem*/ ctx[27],
+    				itemLabel: /*itemLabelItem*/ ctx[28],
     				hooks: /*hooks*/ ctx[0]
     			}
     		});
@@ -14437,7 +14439,7 @@
     		p(new_ctx, dirty) {
     			ctx = new_ctx;
     			const itemlabelitem_changes = {};
-    			if (dirty & /*renderItemLabels*/ 2) itemlabelitem_changes.itemLabel = /*itemLabelItem*/ ctx[27];
+    			if (dirty & /*renderItemLabels*/ 2) itemlabelitem_changes.itemLabel = /*itemLabelItem*/ ctx[28];
     			if (dirty & /*hooks*/ 1) itemlabelitem_changes.hooks = /*hooks*/ ctx[0];
     			itemlabelitem.$set(itemlabelitem_changes);
     		},
@@ -14464,7 +14466,7 @@
     	let div_resize_listener;
     	let current;
     	let each_value = /*renderItemLabels*/ ctx[1];
-    	const get_key = ctx => /*itemLabelItem*/ ctx[27].id;
+    	const get_key = ctx => /*itemLabelItem*/ ctx[28].id;
 
     	for (let i = 0; i < each_value.length; i += 1) {
     		let child_ctx = get_each_context(ctx, each_value, i);
@@ -14615,6 +14617,8 @@
     				return Math.ceil(-38.9 * itemSpaceHeight + 130);
     			case DISPLAY_STRATEGY_TYPE.LARGE:
     				return Math.ceil(-44.44 * itemSpaceHeight + 140);
+    			case DISPLAY_STRATEGY_TYPE.EXTRA_LARGE:
+    				return Math.ceil(-92.59 * itemSpaceHeight + 300);
     		}
     	}
 
@@ -14661,16 +14665,17 @@
     		addDataUpdateListener();
     	});
 
+    	const handleCameraUpdateCallback = () => {
+    		$$invalidate(4, itemsVisible = false);
+    		handleCameraUpdate();
+    	};
+
     	svelte.onMount(() => {
     		$$invalidate(1, renderItemLabels = itemLabels);
     		curItemLabels = itemLabels;
     		onItemLabelUpdate();
     		addResizeListener();
-
-    		five.on('cameraUpdate', () => {
-    			$$invalidate(4, itemsVisible = false);
-    			handleCameraUpdate();
-    		});
+    		five.on('cameraUpdate', handleCameraUpdateCallback);
     	});
 
     	const handleCameraUpdate = debounce(
@@ -14711,12 +14716,11 @@
     		});
 
     	svelte.onDestroy(() => {
-    		five.off('cameraUpdate');
+    		five.off('cameraUpdate', handleCameraUpdateCallback);
     		resizeObserver.unobserve(wrapper);
-    		curItemLabels = null;
-    		$$invalidate(1, renderItemLabels = null);
-    		wrapperSize = { width: 0, height: 0 };
-    	});
+    	}); // curItemLabels = null
+    	// renderItemLabels = null
+    	// wrapperSize = { width: 0, height: 0 }
 
     	function div_elementresize_handler() {
     		containerWidth = this.clientWidth;
@@ -14798,6 +14802,7 @@
         top: 0;
         width: 100%;
         height: 100%;
+        z-index: 5;
     `;
         pluginState.container.style.pointerEvents = 'none'; // 写到 cssText 里不生效
         const appendTo = (wrapper) => {