From f1328e22a8c837d4909807d0ce349d9974611747 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Franti=C5=A1ek=20=C5=A0pa=C4=8Dek?= Date: Wed, 4 Dec 2024 15:30:34 +0100 Subject: [PATCH] Added time comparison to GUI --- index.js | 38 +++++++++++++++++++++++++++----------- m-tree/mtree.js | 1 - public/script/main.js | 40 +++++++++------------------------------- public/style/index.css | 2 +- 4 files changed, 37 insertions(+), 44 deletions(-) diff --git a/index.js b/index.js index 61fcc15..a21445f 100644 --- a/index.js +++ b/index.js @@ -72,7 +72,7 @@ app.get('/rangeQuery', (req, res) => { if (parsedQueryPoint.length !== mtree.dimension) return res.status(400).send('Query point has the wrong dimension'); - console.time('mtreeRangeQuery'); + /*console.time('mtreeRangeQuery'); const result = mtree.rangeQuery(parsedQueryPoint, parsedRadius); console.timeEnd('mtreeRangeQuery'); //console.log(result.length); @@ -82,7 +82,21 @@ app.get('/rangeQuery', (req, res) => { console.timeEnd('sequentialSearch'); //console.log(sequentialResult.length); - res.send(result); + res.send(result);*/ + const start = performance.now(); + const result = mtree.rangeQuery(parsedQueryPoint, parsedRadius); + const RangeQueryTime = performance.now() - start; + + const start2 = performance.now(); + const sequentialResult = points.filter(point => mtree.distanceFunction(point, parsedQueryPoint) <= parsedRadius); + const sequentialSearchTime = performance.now() - start2; + + const timingResult = { + mtreeRangeQuery: RangeQueryTime, + sequentialSearch: sequentialSearchTime + }; + + res.send({ values: result, timingResult }); }); // Perform a k-NN query on the MTree @@ -101,19 +115,21 @@ app.get('/kNNQuery', (req, res) => { return res.status(400).send('Invalid query point'); } const kInt = parseInt(k, 10); - - console.time('mtreeKNNQuery'); + + const start = performance.now(); const result = mtree.kNNQuery(parsedQueryPoint, kInt); - console.timeEnd('mtreeKNNQuery'); - //console.log(result); + const mtreeKNNQueryTime = performance.now() - start; - console.time('sequentialSearch'); + const start2 = performance.now(); const sequentialResult = points.sort((a, b) => mtree.distanceFunction(a, parsedQueryPoint) - mtree.distanceFunction(b, parsedQueryPoint)).slice(0, kInt); - console.timeEnd('sequentialSearch'); - //const sequentialResultWithDistance = sequentialResult.map(point => ({point, distance: mtree.distanceFunction(point, parsedQueryPoint)})); - //console.log(sequentialResult); + const sequentialSearchTime = performance.now() - start2; - res.send(result); + const timingResult = { + mtreeKNNQuery: mtreeKNNQueryTime, + sequentialSearch: sequentialSearchTime + }; + + res.send({ values: result, timingResult }); }); // Recreate the MTree with the given dimensions diff --git a/m-tree/mtree.js b/m-tree/mtree.js index 32af549..a6516b2 100644 --- a/m-tree/mtree.js +++ b/m-tree/mtree.js @@ -326,4 +326,3 @@ class MTree { } module.exports = MTree; - diff --git a/public/script/main.js b/public/script/main.js index f9d6cd5..1e33225 100644 --- a/public/script/main.js +++ b/public/script/main.js @@ -39,12 +39,14 @@ async function performRangeQuery() { setStatus(response.ok); if (response.ok) { const result = await response.json(); - result.sort((a, b) => a.distance - b.distance); + result.values.sort((a, b) => a.distance - b.distance); - const table = createTable(result); + const table = createTable(result.values); document.getElementById('result').innerHTML = ''; document.getElementById('result').appendChild(table); - document.getElementById('status').innerText = 'Range query successful'; + + const { mtreeRangeQuery, sequentialSearch } = result.timingResult; + document.getElementById('status').innerText = `Range query successful: MTree (${mtreeRangeQuery.toFixed(3)} ms), Sequential (${sequentialSearch.toFixed(3)} ms)`; } else { document.getElementById('status').innerText = `Error: ${await response.text()}`; } @@ -66,10 +68,12 @@ async function performKNNQuery() { setStatus(response.ok); if (response.ok) { const result = await response.json(); - const table = createTable(result); + const table = createTable(result.values); document.getElementById('result').innerHTML = ''; document.getElementById('result').appendChild(table); - document.getElementById('status').innerText = 'KNN query successful'; + + const { mtreeKNNQuery, sequentialSearch } = result.timingResult; + document.getElementById('status').innerText = `KNN query successful: MTree (${mtreeKNNQuery.toFixed(3)} ms), Sequential (${sequentialSearch.toFixed(3)} ms)`; } else { document.getElementById('status').innerText = `Error: ${await response.text()}`; } @@ -171,32 +175,6 @@ async function saveTree() { } } -/** - * Loads the MTree from the text area. - */ -/*async function loadTree() { - const input = document.getElementById('treeFileInput'); - const file = input.files[0]; - const reader = new FileReader(); - reader.onload = async (event) => { - const treeData = event.target.result; - const response = await fetch('/loadTree', { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: treeData - }); - - setStatus(response.ok); - if (response.ok) { - document.getElementById('status').innerText = 'Tree loaded'; - toggleButtons(true); - } else { - document.getElementById('status').innerText = `Error: ${await response.text()}`; - } - }; - reader.readAsText(file); -}*/ - /** * Loads the MTree from the selected file and posts it to the loadTree API endpoint. */ diff --git a/public/style/index.css b/public/style/index.css index a144aa0..13567ce 100644 --- a/public/style/index.css +++ b/public/style/index.css @@ -59,6 +59,7 @@ input[type="file"] { box-sizing: border-box; border: 1px solid var(--text-color); border-radius: 0.25rem; + margin-bottom: 0.5rem; } select { @@ -68,7 +69,6 @@ select { border: 1px solid var(--text-color); border-radius: 0.25rem; background-color: white; - color: var(--text-color); appearance: none; cursor: pointer; }