chore: update package dependencies and improve heatmap output handling

This commit is contained in:
2025-09-09 08:59:45 +05:30
parent cbaad3d546
commit af671adfcb
6 changed files with 86 additions and 72 deletions

2
app/package-lock.json generated
View File

@@ -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"

View File

@@ -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",

View File

@@ -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;

View File

@@ -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);
});
});
}

View File

@@ -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<HeatmapFileResult[]> {
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<HeatmapFileResult> => 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;
}

View File

@@ -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");
}
};