From af671adfcb03cbf0eef7fa35e3b46ee425bb05dd Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Tue, 9 Sep 2025 08:59:45 +0530 Subject: [PATCH] chore: update package dependencies and improve heatmap output handling --- app/package-lock.json | 2 + app/package.json | 1 + .../realTime/realTimeHeatMap.tsx | 2 +- .../simulator/SimulationHandler.tsx | 17 ++- .../functions/generateHeatmapOutput.ts | 129 +++++++++--------- .../simulation/products/heatMapImageApi.ts | 7 +- 6 files changed, 86 insertions(+), 72 deletions(-) diff --git a/app/package-lock.json b/app/package-lock.json index a1bf231..43f5220 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -27,6 +27,7 @@ "@types/react": "^18.3.5", "@types/react-dom": "^18.3.0", "@use-gesture/react": "^10.3.1", + "buffer": "^6.0.3", "chart.js": "^4.4.8", "chartjs-plugin-annotation": "^3.1.0", "dxf-parser": "^1.1.2", @@ -8405,6 +8406,7 @@ "url": "https://feross.org/support" } ], + "license": "MIT", "dependencies": { "base64-js": "^1.3.1", "ieee754": "^1.2.1" diff --git a/app/package.json b/app/package.json index aec1d38..a0842a4 100644 --- a/app/package.json +++ b/app/package.json @@ -22,6 +22,7 @@ "@types/react": "^18.3.5", "@types/react-dom": "^18.3.0", "@use-gesture/react": "^10.3.1", + "buffer": "^6.0.3", "chart.js": "^4.4.8", "chartjs-plugin-annotation": "^3.1.0", "dxf-parser": "^1.1.2", diff --git a/app/src/components/heatMapGenerator/realTime/realTimeHeatMap.tsx b/app/src/components/heatMapGenerator/realTime/realTimeHeatMap.tsx index 1bb118d..e35577b 100644 --- a/app/src/components/heatMapGenerator/realTime/realTimeHeatMap.tsx +++ b/app/src/components/heatMapGenerator/realTime/realTimeHeatMap.tsx @@ -11,7 +11,7 @@ const DECAY_RATE = 0.01; const GROWTH_TIME_MULTIPLIER = 20; const RADIUS = 0.005; const OPACITY = 0.8; -const UPDATE_INTERVAL = 1; +const UPDATE_INTERVAL = 0.1; interface HeatPoint { x: number; diff --git a/app/src/modules/simulation/simulator/SimulationHandler.tsx b/app/src/modules/simulation/simulator/SimulationHandler.tsx index f109707..e7c649e 100644 --- a/app/src/modules/simulation/simulator/SimulationHandler.tsx +++ b/app/src/modules/simulation/simulator/SimulationHandler.tsx @@ -115,7 +115,8 @@ const SimulationHandler = () => { } if (materials.length === 0 && materialHistory.length >= 0 && !hasActiveEntity) { - let bakedResult = generateHeatmapOutput({ bakedPoints, gl, width, height, outputType: "url" }); + // let bakedResult = generateHeatmapOutput({ bakedPoints, gl, width, height, outputType: "url" }); + // console.log('bakedResult: ', bakedResult); if (executionSequences?.length > 0) { executionSequences.forEach((sequence) => { @@ -142,8 +143,20 @@ const SimulationHandler = () => { idleTime: obj.idleTime ?? 0, type: entity.type as "roboticArm" | "vehicle" | "machine" | "human" | "crane" | "storageUnit" | "transfer", }); + generateHeatmapOutput({ + bakedPoints, + gl, + width, + height, + outputType: "file", + download: false, + }).then((bakedResult) => { + console.log("Baked Result:", bakedResult); - heatMapImageApi(projectId || "", selectedVersion?.versionId || "", selectedProduct?.productUuid, bakedResult); + heatMapImageApi(projectId || "", selectedVersion?.versionId || "", selectedProduct?.productUuid, bakedResult); + }); + + // heatMapImageApi(projectId || "", selectedVersion?.versionId || "", selectedProduct?.productUuid, bakedResult); }); }); } diff --git a/app/src/modules/simulation/simulator/functions/generateHeatmapOutput.ts b/app/src/modules/simulation/simulator/functions/generateHeatmapOutput.ts index 4f07dd5..315abfa 100644 --- a/app/src/modules/simulation/simulator/functions/generateHeatmapOutput.ts +++ b/app/src/modules/simulation/simulator/functions/generateHeatmapOutput.ts @@ -1,90 +1,87 @@ import { WebGLRenderer } from "three"; +import { Buffer } from "buffer"; import { exportHeatmapAsPNG } from "../../../../components/heatMapGenerator/functions/exportHeatmapAsPNG"; -// Type for a single baked point +// Types interface BakedPoint { - type: string; - points: { x: number; y: number }; + type: string; + points: { x: number; y: number }; } -// Heatmap item returned by exportHeatmapAsPNG interface ExportedHeatmap { - type: string; - image: Blob | null; -} - -// Output types -interface HeatmapUrlResult { - type: string; - url: string; + type: string; + image: Blob | null; } interface HeatmapFileResult { - type: string; - file: File; + type: string; + file: HeatmapBackendFile; } -type OutputType = "url" | "file" | "blob"; +interface HeatmapBackendFile { + fieldname: string; + originalname: string; + encoding: string; + mimetype: string; + buffer: Buffer; + size: number; +} interface GenerateHeatmapOutputParams { - bakedPoints: BakedPoint[]; - gl: WebGLRenderer; - width: number; - height: number; - outputType?: OutputType; - download?: boolean; // <-- NEW PARAM + bakedPoints: BakedPoint[]; + gl: WebGLRenderer; + width: number; + height: number; + outputType?: "url" | "file" | "blob"; + download?: boolean; } -/** - * Generates heatmap output as either a File or a URL. - * If `download` is true, automatically triggers file download. - */ -export function generateHeatmapOutput({ bakedPoints, gl, width, height, outputType = "file", download = false }: GenerateHeatmapOutputParams): (HeatmapUrlResult | HeatmapFileResult)[] { - const bakedResult: ExportedHeatmap[] = exportHeatmapAsPNG({ bakedPoints, gl, width, height }); +export async function generateHeatmapOutput({ + bakedPoints, + gl, + width, + height, + outputType = "file", + download = false, +}: GenerateHeatmapOutputParams): Promise { + const bakedResult: ExportedHeatmap[] = exportHeatmapAsPNG({ bakedPoints, gl, width, height }); - return bakedResult - .map((item) => { - if (!item.image) return null; + const fileResults = await Promise.all( + bakedResult + .map(async (item) => { + if (!item.image) return null; - const fileName = `${item.type}-heatmap.png`; + const fileName = `${item.type}-heatmap.png`; - if (outputType === "file") { - const file = new File([item.image], fileName, { type: "image/png" }); + // Convert Blob -> ArrayBuffer -> Buffer + const arrayBuffer = await item.image.arrayBuffer(); + const nodeBuffer = Buffer.from(arrayBuffer); - // If download flag is true, trigger download - if (download) { - const url = URL.createObjectURL(file); - const link = document.createElement("a"); - link.href = url; - link.download = fileName; - document.body.appendChild(link); - link.click(); - document.body.removeChild(link); - URL.revokeObjectURL(url); - } + const backendFile: HeatmapBackendFile = { + fieldname: "file", + originalname: fileName, + encoding: "7bit", + mimetype: "image/png", + buffer: nodeBuffer, + size: nodeBuffer.length, + }; - return { type: item.type, file } as HeatmapFileResult; - } else if (outputType === "url") { - const url = URL.createObjectURL(item.image); + + if (download) { + const url = URL.createObjectURL(item.image); + const link = document.createElement("a"); + link.href = url; + link.download = fileName; + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + setTimeout(() => URL.revokeObjectURL(url), 1000); + } - // If download flag is true, trigger download - if (download) { - const link = document.createElement("a"); - link.href = url; - link.download = fileName; - document.body.appendChild(link); - link.click(); - document.body.removeChild(link); - // We don't revoke here immediately, or the download may fail - setTimeout(() => URL.revokeObjectURL(url), 1000); - } + return { type: item.type, file: backendFile }; + }) + .filter((result): result is Promise => result !== null) + ); - return { type: item.type, url } as HeatmapUrlResult; - } else if (outputType === "blob") { - return bakedResult; - } - - throw new Error("Invalid outputType. Use 'url' or 'file'."); - }) - .filter((result): result is HeatmapUrlResult | HeatmapFileResult => result !== null); + return fileResults; } diff --git a/app/src/services/simulation/products/heatMapImageApi.ts b/app/src/services/simulation/products/heatMapImageApi.ts index ac69da5..b098dbf 100644 --- a/app/src/services/simulation/products/heatMapImageApi.ts +++ b/app/src/services/simulation/products/heatMapImageApi.ts @@ -2,9 +2,6 @@ let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_UR export const heatMapImageApi = async (projectId: string, versionId: string, productUuid: string,heatmaps:any) => { console.log('heatmaps: ', heatmaps); - console.log('productUuid: ', productUuid); - console.log('versionId: ', versionId); - console.log('projectId: ', projectId); try { const response = await fetch(`${url_Backend_dwinzo}/api/V1/SimulatedImage`, { method: "PATCH", @@ -34,3 +31,7 @@ export const heatMapImageApi = async (projectId: string, versionId: string, prod echo.error("Failed to delete event data"); } }; + + + +