@gemx-dev/heatmap-react 3.5.60 → 3.5.61
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/configs/index.d.ts +1 -0
- package/dist/esm/configs/index.d.ts.map +1 -1
- package/dist/esm/configs/zoom.d.ts +6 -0
- package/dist/esm/configs/zoom.d.ts.map +1 -0
- package/dist/esm/hooks/view-context/useHeatmapViz.d.ts +2 -0
- package/dist/esm/hooks/view-context/useHeatmapViz.d.ts.map +1 -1
- package/dist/esm/hooks/viz-scale/useScaleCalculation.d.ts.map +1 -1
- package/dist/esm/index.js +23 -10
- package/dist/esm/index.mjs +23 -10
- package/dist/esm/stores/viz.d.ts +2 -0
- package/dist/esm/stores/viz.d.ts.map +1 -1
- package/dist/umd/configs/index.d.ts +1 -0
- package/dist/umd/configs/index.d.ts.map +1 -1
- package/dist/umd/configs/zoom.d.ts +6 -0
- package/dist/umd/configs/zoom.d.ts.map +1 -0
- package/dist/umd/hooks/view-context/useHeatmapViz.d.ts +2 -0
- package/dist/umd/hooks/view-context/useHeatmapViz.d.ts.map +1 -1
- package/dist/umd/hooks/viz-scale/useScaleCalculation.d.ts.map +1 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/stores/viz.d.ts +2 -0
- package/dist/umd/stores/viz.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/configs/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/configs/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"zoom.d.ts","sourceRoot":"","sources":["../../src/configs/zoom.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,kBAAkB;;;;CAI9B,CAAC"}
|
|
@@ -2,6 +2,7 @@ interface IHeatmapVizState {
|
|
|
2
2
|
isRenderViz: boolean;
|
|
3
3
|
zoomRatio: number;
|
|
4
4
|
minZoomRatio: number;
|
|
5
|
+
maxZoomRatio: number;
|
|
5
6
|
widthScale: number;
|
|
6
7
|
isScaledToFit: boolean;
|
|
7
8
|
}
|
|
@@ -9,6 +10,7 @@ interface IHeatmapVizActions {
|
|
|
9
10
|
setIsRenderViz: (value: boolean) => void;
|
|
10
11
|
setZoomRatio: (value: number) => void;
|
|
11
12
|
setMinZoomRatio: (value: number) => void;
|
|
13
|
+
setMaxZoomRatio: (value: number) => void;
|
|
12
14
|
setScale: (value: number) => void;
|
|
13
15
|
setIsScaledToFit: (value: boolean) => void;
|
|
14
16
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHeatmapViz.d.ts","sourceRoot":"","sources":["../../../src/hooks/view-context/useHeatmapViz.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useHeatmapViz.d.ts","sourceRoot":"","sources":["../../../src/hooks/view-context/useHeatmapViz.ts"],"names":[],"mappings":"AAUA,UAAU,gBAAgB;IACxB,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,UAAU,kBAAkB;IAC1B,cAAc,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,gBAAgB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C;AAED,MAAM,MAAM,iBAAiB,GAAG,gBAAgB,GAAG,kBAAkB,CAAC;AAMtE;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,aAAa;;;;;;;CAoBxB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useScaleCalculation.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-scale/useScaleCalculation.ts"],"names":[],"mappings":"AAIA,UAAU,yBAAyB;IACjC,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,UAAU,0BAA0B;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB;
|
|
1
|
+
{"version":3,"file":"useScaleCalculation.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-scale/useScaleCalculation.ts"],"names":[],"mappings":"AAIA,UAAU,yBAAyB;IACjC,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,UAAU,0BAA0B;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,mBAAmB,GAAI,OAAO,yBAAyB,KAAG,0BA2DtE,CAAC"}
|
package/dist/esm/index.js
CHANGED
|
@@ -113,6 +113,12 @@ const Z_INDEX = {
|
|
|
113
113
|
SIDEBAR_POPOVER: 4001,
|
|
114
114
|
};
|
|
115
115
|
|
|
116
|
+
const DEFAULT_ZOOM_RATIO = {
|
|
117
|
+
DEFAULT: 100,
|
|
118
|
+
MIN: 10,
|
|
119
|
+
MAX: 100,
|
|
120
|
+
};
|
|
121
|
+
|
|
116
122
|
/**
|
|
117
123
|
* Creates a debounced version of a callback that delays invoking until after
|
|
118
124
|
* wait milliseconds have elapsed since the last time it was invoked.
|
|
@@ -304,8 +310,9 @@ const useHeatmapDataStore = create()(subscribeWithSelector((set) => {
|
|
|
304
310
|
const useHeatmapVizStore = create()(subscribeWithSelector((set) => {
|
|
305
311
|
return {
|
|
306
312
|
isRenderViz: new Map([[DEFAULT_VIEW_ID, false]]),
|
|
307
|
-
zoomRatio: new Map([[DEFAULT_VIEW_ID,
|
|
308
|
-
minZoomRatio: new Map([[DEFAULT_VIEW_ID,
|
|
313
|
+
zoomRatio: new Map([[DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO.DEFAULT]]),
|
|
314
|
+
minZoomRatio: new Map([[DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO.MIN]]),
|
|
315
|
+
maxZoomRatio: new Map([[DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO.MAX]]),
|
|
309
316
|
scale: new Map([[DEFAULT_VIEW_ID, 1]]),
|
|
310
317
|
isScaledToFit: new Map([[DEFAULT_VIEW_ID, false]]),
|
|
311
318
|
setIsRenderViz: (isRenderViz, viewId = DEFAULT_VIEW_ID) => set((prev) => {
|
|
@@ -323,6 +330,11 @@ const useHeatmapVizStore = create()(subscribeWithSelector((set) => {
|
|
|
323
330
|
newMinZoomRatio.set(viewId, minZoomRatio);
|
|
324
331
|
return { minZoomRatio: newMinZoomRatio };
|
|
325
332
|
}),
|
|
333
|
+
setMaxZoomRatio: (maxZoomRatio, viewId = DEFAULT_VIEW_ID) => set((prev) => {
|
|
334
|
+
const newMaxZoomRatio = new Map(prev.maxZoomRatio);
|
|
335
|
+
newMaxZoomRatio.set(viewId, maxZoomRatio);
|
|
336
|
+
return { maxZoomRatio: newMaxZoomRatio };
|
|
337
|
+
}),
|
|
326
338
|
setScale: (scale, viewId = DEFAULT_VIEW_ID) => set((prev) => {
|
|
327
339
|
const newScale = new Map(prev.scale);
|
|
328
340
|
newScale.set(viewId, scale);
|
|
@@ -1150,8 +1162,9 @@ const useHeatmapViz = createViewContextHook({
|
|
|
1150
1162
|
useStore: useHeatmapVizStore,
|
|
1151
1163
|
getState: (store, viewId) => ({
|
|
1152
1164
|
isRenderViz: store.isRenderViz.get(viewId) ?? false,
|
|
1153
|
-
zoomRatio: store.zoomRatio.get(viewId) ??
|
|
1154
|
-
minZoomRatio: store.minZoomRatio.get(viewId) ??
|
|
1165
|
+
zoomRatio: store.zoomRatio.get(viewId) ?? DEFAULT_ZOOM_RATIO.DEFAULT,
|
|
1166
|
+
minZoomRatio: store.minZoomRatio.get(viewId) ?? DEFAULT_ZOOM_RATIO.MIN,
|
|
1167
|
+
maxZoomRatio: store.maxZoomRatio.get(viewId) ?? DEFAULT_ZOOM_RATIO.MAX,
|
|
1155
1168
|
widthScale: store.scale.get(viewId) ?? 1,
|
|
1156
1169
|
isScaledToFit: store.isScaledToFit.get(viewId) ?? false,
|
|
1157
1170
|
}),
|
|
@@ -1159,6 +1172,7 @@ const useHeatmapViz = createViewContextHook({
|
|
|
1159
1172
|
setIsRenderViz: (value) => store.setIsRenderViz(value, viewId),
|
|
1160
1173
|
setZoomRatio: (value) => store.setZoomRatio(value, viewId),
|
|
1161
1174
|
setMinZoomRatio: (value) => store.setMinZoomRatio(value, viewId),
|
|
1175
|
+
setMaxZoomRatio: (value) => store.setMaxZoomRatio(value, viewId),
|
|
1162
1176
|
setScale: (value) => store.setScale(value, viewId),
|
|
1163
1177
|
setIsScaledToFit: (value) => store.setIsScaledToFit(value, viewId),
|
|
1164
1178
|
}),
|
|
@@ -6644,13 +6658,12 @@ const useObserveIframeHeight = (props) => {
|
|
|
6644
6658
|
return {};
|
|
6645
6659
|
};
|
|
6646
6660
|
|
|
6647
|
-
// Max zoom ratio constant: 100% = fit to width
|
|
6648
|
-
const MAX_ZOOM_RATIO = 200;
|
|
6649
6661
|
const useScaleCalculation = (props) => {
|
|
6650
6662
|
const widthScale = useHeatmapViz((s) => s.widthScale);
|
|
6651
6663
|
const zoomRatio = useHeatmapViz((s) => s.zoomRatio);
|
|
6652
6664
|
const isScaledToFit = useHeatmapViz((s) => s.isScaledToFit);
|
|
6653
6665
|
const minZoomRatio = useHeatmapViz((s) => s.minZoomRatio);
|
|
6666
|
+
const maxZoomRatio = useHeatmapViz((s) => s.maxZoomRatio);
|
|
6654
6667
|
const setScale = useHeatmapViz((s) => s.setScale);
|
|
6655
6668
|
const setIsScaledToFit = useHeatmapViz((s) => s.setIsScaledToFit);
|
|
6656
6669
|
const setMinZoomRatio = useHeatmapViz((s) => s.setMinZoomRatio);
|
|
@@ -6672,9 +6685,9 @@ const useScaleCalculation = (props) => {
|
|
|
6672
6685
|
const calculatedMinZoomRatio = (availableHeight / (contentHeight * widthScale)) * 100;
|
|
6673
6686
|
// Limit minZoomRatio: cannot exceed MAX_ZOOM_RATIO (100%)
|
|
6674
6687
|
// and should have a reasonable minimum (e.g., 1%)
|
|
6675
|
-
const finalMinZoomRatio = Math.max(1, Math.min(calculatedMinZoomRatio,
|
|
6688
|
+
const finalMinZoomRatio = Math.max(1, Math.min(calculatedMinZoomRatio, maxZoomRatio));
|
|
6676
6689
|
// 4. Apply zoom ratio (clamp between min and max)
|
|
6677
|
-
const clampedZoomRatio = Math.max(finalMinZoomRatio, Math.min(zoomRatio,
|
|
6690
|
+
const clampedZoomRatio = Math.max(finalMinZoomRatio, Math.min(zoomRatio, maxZoomRatio));
|
|
6678
6691
|
const zoomMultiplier = clampedZoomRatio / 100;
|
|
6679
6692
|
// 5. Calculate finalScale
|
|
6680
6693
|
// finalScale = widthScale * zoomMultiplier
|
|
@@ -6688,7 +6701,7 @@ const useScaleCalculation = (props) => {
|
|
|
6688
6701
|
setIsScaledToFit(isCurrentlyFitted);
|
|
6689
6702
|
setMinZoomRatio(finalMinZoomRatio);
|
|
6690
6703
|
}
|
|
6691
|
-
}, [containerWidth, containerHeight, contentWidth, contentHeight, zoomRatio]);
|
|
6704
|
+
}, [containerWidth, containerHeight, contentWidth, contentHeight, zoomRatio, maxZoomRatio]);
|
|
6692
6705
|
useEffect(() => {
|
|
6693
6706
|
calculateScaleResult();
|
|
6694
6707
|
}, [calculateScaleResult]);
|
|
@@ -8633,4 +8646,4 @@ const HeatmapLayout = ({ data, clickmap, clickAreas, scrollmap, controls, dataIn
|
|
|
8633
8646
|
}
|
|
8634
8647
|
};
|
|
8635
8648
|
|
|
8636
|
-
export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, ELM_CALLOUT_CONFIG, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, IClickMode, IClickType, IHeatmapType, IScrollType, ViewIdContext, Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, downloadPerformanceReport, getCompareViewId, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClick, useHeatmapCanvas, useHeatmapClick, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapData, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHover, useHeatmapLiveStore, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapViz, useHeatmapVizRect, useHoveredElement, useIframeHeight, useIframeHeightProcessor, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
|
|
8649
|
+
export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, ELM_CALLOUT_CONFIG, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, IClickMode, IClickType, IHeatmapType, IScrollType, ViewIdContext, Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, downloadPerformanceReport, getCompareViewId, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClick, useHeatmapCanvas, useHeatmapClick, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapData, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHover, useHeatmapLiveStore, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapViz, useHeatmapVizRect, useHoveredElement, useIframeHeight, useIframeHeightProcessor, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
|
package/dist/esm/index.mjs
CHANGED
|
@@ -113,6 +113,12 @@ const Z_INDEX = {
|
|
|
113
113
|
SIDEBAR_POPOVER: 4001,
|
|
114
114
|
};
|
|
115
115
|
|
|
116
|
+
const DEFAULT_ZOOM_RATIO = {
|
|
117
|
+
DEFAULT: 100,
|
|
118
|
+
MIN: 10,
|
|
119
|
+
MAX: 100,
|
|
120
|
+
};
|
|
121
|
+
|
|
116
122
|
/**
|
|
117
123
|
* Creates a debounced version of a callback that delays invoking until after
|
|
118
124
|
* wait milliseconds have elapsed since the last time it was invoked.
|
|
@@ -304,8 +310,9 @@ const useHeatmapDataStore = create()(subscribeWithSelector((set) => {
|
|
|
304
310
|
const useHeatmapVizStore = create()(subscribeWithSelector((set) => {
|
|
305
311
|
return {
|
|
306
312
|
isRenderViz: new Map([[DEFAULT_VIEW_ID, false]]),
|
|
307
|
-
zoomRatio: new Map([[DEFAULT_VIEW_ID,
|
|
308
|
-
minZoomRatio: new Map([[DEFAULT_VIEW_ID,
|
|
313
|
+
zoomRatio: new Map([[DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO.DEFAULT]]),
|
|
314
|
+
minZoomRatio: new Map([[DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO.MIN]]),
|
|
315
|
+
maxZoomRatio: new Map([[DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO.MAX]]),
|
|
309
316
|
scale: new Map([[DEFAULT_VIEW_ID, 1]]),
|
|
310
317
|
isScaledToFit: new Map([[DEFAULT_VIEW_ID, false]]),
|
|
311
318
|
setIsRenderViz: (isRenderViz, viewId = DEFAULT_VIEW_ID) => set((prev) => {
|
|
@@ -323,6 +330,11 @@ const useHeatmapVizStore = create()(subscribeWithSelector((set) => {
|
|
|
323
330
|
newMinZoomRatio.set(viewId, minZoomRatio);
|
|
324
331
|
return { minZoomRatio: newMinZoomRatio };
|
|
325
332
|
}),
|
|
333
|
+
setMaxZoomRatio: (maxZoomRatio, viewId = DEFAULT_VIEW_ID) => set((prev) => {
|
|
334
|
+
const newMaxZoomRatio = new Map(prev.maxZoomRatio);
|
|
335
|
+
newMaxZoomRatio.set(viewId, maxZoomRatio);
|
|
336
|
+
return { maxZoomRatio: newMaxZoomRatio };
|
|
337
|
+
}),
|
|
326
338
|
setScale: (scale, viewId = DEFAULT_VIEW_ID) => set((prev) => {
|
|
327
339
|
const newScale = new Map(prev.scale);
|
|
328
340
|
newScale.set(viewId, scale);
|
|
@@ -1150,8 +1162,9 @@ const useHeatmapViz = createViewContextHook({
|
|
|
1150
1162
|
useStore: useHeatmapVizStore,
|
|
1151
1163
|
getState: (store, viewId) => ({
|
|
1152
1164
|
isRenderViz: store.isRenderViz.get(viewId) ?? false,
|
|
1153
|
-
zoomRatio: store.zoomRatio.get(viewId) ??
|
|
1154
|
-
minZoomRatio: store.minZoomRatio.get(viewId) ??
|
|
1165
|
+
zoomRatio: store.zoomRatio.get(viewId) ?? DEFAULT_ZOOM_RATIO.DEFAULT,
|
|
1166
|
+
minZoomRatio: store.minZoomRatio.get(viewId) ?? DEFAULT_ZOOM_RATIO.MIN,
|
|
1167
|
+
maxZoomRatio: store.maxZoomRatio.get(viewId) ?? DEFAULT_ZOOM_RATIO.MAX,
|
|
1155
1168
|
widthScale: store.scale.get(viewId) ?? 1,
|
|
1156
1169
|
isScaledToFit: store.isScaledToFit.get(viewId) ?? false,
|
|
1157
1170
|
}),
|
|
@@ -1159,6 +1172,7 @@ const useHeatmapViz = createViewContextHook({
|
|
|
1159
1172
|
setIsRenderViz: (value) => store.setIsRenderViz(value, viewId),
|
|
1160
1173
|
setZoomRatio: (value) => store.setZoomRatio(value, viewId),
|
|
1161
1174
|
setMinZoomRatio: (value) => store.setMinZoomRatio(value, viewId),
|
|
1175
|
+
setMaxZoomRatio: (value) => store.setMaxZoomRatio(value, viewId),
|
|
1162
1176
|
setScale: (value) => store.setScale(value, viewId),
|
|
1163
1177
|
setIsScaledToFit: (value) => store.setIsScaledToFit(value, viewId),
|
|
1164
1178
|
}),
|
|
@@ -6644,13 +6658,12 @@ const useObserveIframeHeight = (props) => {
|
|
|
6644
6658
|
return {};
|
|
6645
6659
|
};
|
|
6646
6660
|
|
|
6647
|
-
// Max zoom ratio constant: 100% = fit to width
|
|
6648
|
-
const MAX_ZOOM_RATIO = 200;
|
|
6649
6661
|
const useScaleCalculation = (props) => {
|
|
6650
6662
|
const widthScale = useHeatmapViz((s) => s.widthScale);
|
|
6651
6663
|
const zoomRatio = useHeatmapViz((s) => s.zoomRatio);
|
|
6652
6664
|
const isScaledToFit = useHeatmapViz((s) => s.isScaledToFit);
|
|
6653
6665
|
const minZoomRatio = useHeatmapViz((s) => s.minZoomRatio);
|
|
6666
|
+
const maxZoomRatio = useHeatmapViz((s) => s.maxZoomRatio);
|
|
6654
6667
|
const setScale = useHeatmapViz((s) => s.setScale);
|
|
6655
6668
|
const setIsScaledToFit = useHeatmapViz((s) => s.setIsScaledToFit);
|
|
6656
6669
|
const setMinZoomRatio = useHeatmapViz((s) => s.setMinZoomRatio);
|
|
@@ -6672,9 +6685,9 @@ const useScaleCalculation = (props) => {
|
|
|
6672
6685
|
const calculatedMinZoomRatio = (availableHeight / (contentHeight * widthScale)) * 100;
|
|
6673
6686
|
// Limit minZoomRatio: cannot exceed MAX_ZOOM_RATIO (100%)
|
|
6674
6687
|
// and should have a reasonable minimum (e.g., 1%)
|
|
6675
|
-
const finalMinZoomRatio = Math.max(1, Math.min(calculatedMinZoomRatio,
|
|
6688
|
+
const finalMinZoomRatio = Math.max(1, Math.min(calculatedMinZoomRatio, maxZoomRatio));
|
|
6676
6689
|
// 4. Apply zoom ratio (clamp between min and max)
|
|
6677
|
-
const clampedZoomRatio = Math.max(finalMinZoomRatio, Math.min(zoomRatio,
|
|
6690
|
+
const clampedZoomRatio = Math.max(finalMinZoomRatio, Math.min(zoomRatio, maxZoomRatio));
|
|
6678
6691
|
const zoomMultiplier = clampedZoomRatio / 100;
|
|
6679
6692
|
// 5. Calculate finalScale
|
|
6680
6693
|
// finalScale = widthScale * zoomMultiplier
|
|
@@ -6688,7 +6701,7 @@ const useScaleCalculation = (props) => {
|
|
|
6688
6701
|
setIsScaledToFit(isCurrentlyFitted);
|
|
6689
6702
|
setMinZoomRatio(finalMinZoomRatio);
|
|
6690
6703
|
}
|
|
6691
|
-
}, [containerWidth, containerHeight, contentWidth, contentHeight, zoomRatio]);
|
|
6704
|
+
}, [containerWidth, containerHeight, contentWidth, contentHeight, zoomRatio, maxZoomRatio]);
|
|
6692
6705
|
useEffect(() => {
|
|
6693
6706
|
calculateScaleResult();
|
|
6694
6707
|
}, [calculateScaleResult]);
|
|
@@ -8633,4 +8646,4 @@ const HeatmapLayout = ({ data, clickmap, clickAreas, scrollmap, controls, dataIn
|
|
|
8633
8646
|
}
|
|
8634
8647
|
};
|
|
8635
8648
|
|
|
8636
|
-
export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, ELM_CALLOUT_CONFIG, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, IClickMode, IClickType, IHeatmapType, IScrollType, ViewIdContext, Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, downloadPerformanceReport, getCompareViewId, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClick, useHeatmapCanvas, useHeatmapClick, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapData, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHover, useHeatmapLiveStore, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapViz, useHeatmapVizRect, useHoveredElement, useIframeHeight, useIframeHeightProcessor, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
|
|
8649
|
+
export { BACKDROP_CONFIG, DEFAULT_SIDEBAR_WIDTH, DEFAULT_VIEW_ID, DEFAULT_ZOOM_RATIO, ELM_CALLOUT_CONFIG, GraphView, HEATMAP_CONFIG, HEATMAP_IFRAME, HEATMAP_STYLE, HeatmapLayout, IClickMode, IClickType, IHeatmapType, IScrollType, ViewIdContext, Z_INDEX, compareViewPerformance, convertViewportToIframeCoords, createStorePerformanceTracker, downloadPerformanceReport, getCompareViewId, getMetricsByViewId, getPerformanceReportJSON, getScrollGradientColor, performanceLogger, printPerformanceSummary, scrollToElementIfNeeded, sendPerformanceReport, serializeAreas, trackStoreAction, useAreaCreation, useAreaEditMode, useAreaFilterVisible, useAreaHydration, useAreaInteraction, useAreaPositionsUpdater, useAreaRectSync, useAreaRendererContainer, useAreaTopAutoDetect, useClickedElement, useDebounceCallback, useElementCalloutVisible, useHeatmapAreaClick, useHeatmapCanvas, useHeatmapClick, useHeatmapCompareStore, useHeatmapConfigStore, useHeatmapCopyView, useHeatmapData, useHeatmapEffects, useHeatmapElementPosition, useHeatmapHover, useHeatmapLiveStore, useHeatmapRenderByMode, useHeatmapScale, useHeatmapScroll, useHeatmapViz, useHeatmapVizRect, useHoveredElement, useIframeHeight, useIframeHeightProcessor, useMeasureFunction, useRegisterConfig, useRegisterControl, useRegisterData, useRegisterHeatmap, useRenderCount, useScrollmapZones, useTrackHookCall, useViewIdContext, useVizLiveRender, useWhyDidYouUpdate, useWrapperRefHeight, useZonePositions, withPerformanceTracking };
|
package/dist/esm/stores/viz.d.ts
CHANGED
|
@@ -2,11 +2,13 @@ export interface IHeatmapVizStore {
|
|
|
2
2
|
isRenderViz: Map<string, boolean>;
|
|
3
3
|
zoomRatio: Map<string, number>;
|
|
4
4
|
minZoomRatio: Map<string, number>;
|
|
5
|
+
maxZoomRatio: Map<string, number>;
|
|
5
6
|
scale: Map<string, number>;
|
|
6
7
|
isScaledToFit: Map<string, boolean>;
|
|
7
8
|
setIsRenderViz: (isRenderViz: boolean, viewId?: string) => void;
|
|
8
9
|
setZoomRatio: (zoomRatio: number, viewId?: string) => void;
|
|
9
10
|
setMinZoomRatio: (minZoomRatio: number, viewId?: string) => void;
|
|
11
|
+
setMaxZoomRatio: (maxZoomRatio: number, viewId?: string) => void;
|
|
10
12
|
setScale: (scale: number, viewId?: string) => void;
|
|
11
13
|
setIsScaledToFit: (isScaledToFit: boolean, viewId?: string) => void;
|
|
12
14
|
copyView: (fromViewId: string, toViewId: string) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"viz.d.ts","sourceRoot":"","sources":["../../src/stores/viz.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,gBAAgB;IAE/B,WAAW,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAClC,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC3B,aAAa,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAGpC,cAAc,EAAE,CAAC,WAAW,EAAE,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,YAAY,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,eAAe,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACjE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,gBAAgB,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAGpE,QAAQ,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAGzD,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAGpC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,kBAAkB;;;;;;;;
|
|
1
|
+
{"version":3,"file":"viz.d.ts","sourceRoot":"","sources":["../../src/stores/viz.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,gBAAgB;IAE/B,WAAW,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAClC,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAClC,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC3B,aAAa,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAGpC,cAAc,EAAE,CAAC,WAAW,EAAE,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,YAAY,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,eAAe,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACjE,eAAe,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACjE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,gBAAgB,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAGpE,QAAQ,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAGzD,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAGpC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,kBAAkB;;;;;;;;EA4G9B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/configs/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/configs/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"zoom.d.ts","sourceRoot":"","sources":["../../src/configs/zoom.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,kBAAkB;;;;CAI9B,CAAC"}
|
|
@@ -2,6 +2,7 @@ interface IHeatmapVizState {
|
|
|
2
2
|
isRenderViz: boolean;
|
|
3
3
|
zoomRatio: number;
|
|
4
4
|
minZoomRatio: number;
|
|
5
|
+
maxZoomRatio: number;
|
|
5
6
|
widthScale: number;
|
|
6
7
|
isScaledToFit: boolean;
|
|
7
8
|
}
|
|
@@ -9,6 +10,7 @@ interface IHeatmapVizActions {
|
|
|
9
10
|
setIsRenderViz: (value: boolean) => void;
|
|
10
11
|
setZoomRatio: (value: number) => void;
|
|
11
12
|
setMinZoomRatio: (value: number) => void;
|
|
13
|
+
setMaxZoomRatio: (value: number) => void;
|
|
12
14
|
setScale: (value: number) => void;
|
|
13
15
|
setIsScaledToFit: (value: boolean) => void;
|
|
14
16
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHeatmapViz.d.ts","sourceRoot":"","sources":["../../../src/hooks/view-context/useHeatmapViz.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useHeatmapViz.d.ts","sourceRoot":"","sources":["../../../src/hooks/view-context/useHeatmapViz.ts"],"names":[],"mappings":"AAUA,UAAU,gBAAgB;IACxB,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,UAAU,kBAAkB;IAC1B,cAAc,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,gBAAgB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C;AAED,MAAM,MAAM,iBAAiB,GAAG,gBAAgB,GAAG,kBAAkB,CAAC;AAMtE;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,aAAa;;;;;;;CAoBxB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useScaleCalculation.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-scale/useScaleCalculation.ts"],"names":[],"mappings":"AAIA,UAAU,yBAAyB;IACjC,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,UAAU,0BAA0B;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB;
|
|
1
|
+
{"version":3,"file":"useScaleCalculation.d.ts","sourceRoot":"","sources":["../../../src/hooks/viz-scale/useScaleCalculation.ts"],"names":[],"mappings":"AAIA,UAAU,yBAAyB;IACjC,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,UAAU,0BAA0B;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,mBAAmB,GAAI,OAAO,yBAAyB,KAAG,0BA2DtE,CAAC"}
|