From b5f199367a85f27266933dc9aa346cfa86a38c53 Mon Sep 17 00:00:00 2001 From: kartik-gupta-ij Date: Mon, 21 Oct 2024 14:49:57 +0530 Subject: [PATCH 1/7] Fix inconsistency: Use `using` parameter in Visualize tab to match other tabs --- src/components/VisualizeChart/requestData.js | 6 +++--- src/components/VisualizeChart/worker.js | 4 ++-- src/pages/Visualize.jsx | 6 +++--- 3 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/VisualizeChart/requestData.js b/src/components/VisualizeChart/requestData.js index 7deba485..83f51e97 100644 --- a/src/components/VisualizeChart/requestData.js +++ b/src/components/VisualizeChart/requestData.js @@ -2,7 +2,7 @@ export function requestData( qdrantClient, collectionName, - { limit, filter = null, vector_name = null, color_by = null } + { limit, filter = null, using = null, color_by = null } ) { // Based on the input parameters, we need to decide what kind of request we need to send // By default we should do scroll request @@ -13,7 +13,7 @@ export function requestData( query: color_by.query, limit: limit, filter: filter, - with_vector: vector_name ? [vector_name] : true, + with_vector: using ? [using] : true, with_payload: true, }; @@ -25,7 +25,7 @@ export function requestData( const scrollQuery = { limit: limit, filter: filter, - with_vector: vector_name ? [vector_name] : true, + with_vector: using ? [using] : true, with_payload: true, }; diff --git a/src/components/VisualizeChart/worker.js b/src/components/VisualizeChart/worker.js index d4ace40d..9295bbce 100644 --- a/src/components/VisualizeChart/worker.js +++ b/src/components/VisualizeChart/worker.js @@ -30,7 +30,7 @@ self.onmessage = function (e) { const data = []; const points = e.data?.result?.points; - const vectorName = params.vector_name; + const vectorName = params.using; if (!points || points.length === 0) { self.postMessage({ @@ -71,7 +71,7 @@ self.onmessage = function (e) { if (vectorType === 'named') { self.postMessage({ data: [], - error: 'Please select a valid vector name, default vector is not defined', + error: 'Please select a valid vector name (by `using`), default vector is not defined', }); return; } diff --git a/src/pages/Visualize.jsx b/src/pages/Visualize.jsx index b7b244d1..b0fde638 100644 --- a/src/pages/Visualize.jsx +++ b/src/pages/Visualize.jsx @@ -37,7 +37,7 @@ const query = ` // "payload": "field_name" // } // -// - 'vector_name': specify which vector to use for visualization +// - 'using': specify which vector to use for visualization // if there are multiple. // // - 'algorithm': specify algorithm to use for visualization. Available options: 'TSNE', 'UMAP'. @@ -100,8 +100,8 @@ function Visualize() { }, ], }, - vector_name: { - description: 'Vector field name', + using: { + description: 'Specify which vector to use for visualization', type: 'string', enum: vectorNames, }, From fb82ae6a69e262ded93d5582dc6d5d36d935665d Mon Sep 17 00:00:00 2001 From: kartik-gupta-ij Date: Mon, 21 Oct 2024 17:38:17 +0530 Subject: [PATCH 2/7] docs [visualize-tab]: add explanation for color_by.query the Visualize tab --- src/components/VisualizeChart/renderBy.js | 2 +- src/pages/Visualize.jsx | 6 ++++++ 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/src/components/VisualizeChart/renderBy.js b/src/components/VisualizeChart/renderBy.js index 7ab611ae..f979a01a 100644 --- a/src/components/VisualizeChart/renderBy.js +++ b/src/components/VisualizeChart/renderBy.js @@ -78,7 +78,7 @@ export function generateColorBy(points, colorBy = null) { }); } - if (colorBy.discover_score || colorBy.query) { + if (colorBy.query) { const scores = points.map((point) => point.score); const minScore = Math.min(...scores); const maxScore = Math.max(...scores); diff --git a/src/pages/Visualize.jsx b/src/pages/Visualize.jsx index b0fde638..83e8b3ee 100644 --- a/src/pages/Visualize.jsx +++ b/src/pages/Visualize.jsx @@ -37,6 +37,12 @@ const query = ` // "payload": "field_name" // } // +// or +// "color_by": { +// "query": 17 +// } +// see https://qdrant.tech/documentation/concepts/search/#query-api +// // - 'using': specify which vector to use for visualization // if there are multiple. // From 4007cd718c99be2530d66854c5a7c4e8e9945f2a Mon Sep 17 00:00:00 2001 From: kartik-gupta-ij Date: Mon, 21 Oct 2024 17:54:20 +0530 Subject: [PATCH 3/7] fmt --- src/components/VisualizeChart/requestData.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/src/components/VisualizeChart/requestData.js b/src/components/VisualizeChart/requestData.js index 83f51e97..24f7025f 100644 --- a/src/components/VisualizeChart/requestData.js +++ b/src/components/VisualizeChart/requestData.js @@ -1,9 +1,5 @@ /* eslint-disable camelcase */ -export function requestData( - qdrantClient, - collectionName, - { limit, filter = null, using = null, color_by = null } -) { +export function requestData(qdrantClient, collectionName, { limit, filter = null, using = null, color_by = null }) { // Based on the input parameters, we need to decide what kind of request we need to send // By default we should do scroll request // But if we have color_by field which uses query, it should be used instead From 8d977ed90cecc82e2e794e6d95a12287b8fa8eaa Mon Sep 17 00:00:00 2001 From: kartik-gupta-ij Date: Mon, 21 Oct 2024 18:26:35 +0530 Subject: [PATCH 4/7] fix[visualize-tab]: add using parameter in query object for visualization tab - fix color_by parameter in query object if dataset had multiple named vectors for visualization tab --- src/components/VisualizeChart/requestData.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/VisualizeChart/requestData.js b/src/components/VisualizeChart/requestData.js index 24f7025f..af5ab63d 100644 --- a/src/components/VisualizeChart/requestData.js +++ b/src/components/VisualizeChart/requestData.js @@ -11,6 +11,7 @@ export function requestData(qdrantClient, collectionName, { limit, filter = null filter: filter, with_vector: using ? [using] : true, with_payload: true, + using: using ?? null, }; return qdrantClient.query(collectionName, query); From 8e150c4e55a340b0cdacd3c11c278ac5b5497068 Mon Sep 17 00:00:00 2001 From: kartik-gupta-ij Date: Sun, 27 Oct 2024 04:26:48 +0530 Subject: [PATCH 5/7] fix[visualize-tab]: add support nested object path in `color_by` parameter for visualiztion tab fixes : #251 --- src/components/VisualizeChart/renderBy.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/components/VisualizeChart/renderBy.js b/src/components/VisualizeChart/renderBy.js index f979a01a..ec7fe316 100644 --- a/src/components/VisualizeChart/renderBy.js +++ b/src/components/VisualizeChart/renderBy.js @@ -66,12 +66,16 @@ export function generateColorBy(points, colorBy = null) { colorBy = { payload: colorBy }; } + function getNestedValue(obj, path) { + return path.split('.').reduce((acc, part) => acc && acc[part], obj); + } + if (colorBy.payload) { const valuesToColor = {}; return points.map((point) => { - const payloadValue = point.payload[colorBy.payload]; - if (!payloadValue) { + const payloadValue = getNestedValue(point.payload, colorBy.payload); + if (payloadValue === undefined || payloadValue === null) { return BACKGROUND_COLOR; } return colorByPayload(payloadValue, valuesToColor); From f9fc5adf6686ba47057adf35c8853b999607b2b7 Mon Sep 17 00:00:00 2001 From: kartik-gupta-ij Date: Mon, 4 Nov 2024 13:55:04 +0530 Subject: [PATCH 6/7] fix[visualize-tab]: refactor example query for visualiztion tab --- src/pages/Visualize.jsx | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/pages/Visualize.jsx b/src/pages/Visualize.jsx index 83e8b3ee..b0fde638 100644 --- a/src/pages/Visualize.jsx +++ b/src/pages/Visualize.jsx @@ -37,12 +37,6 @@ const query = ` // "payload": "field_name" // } // -// or -// "color_by": { -// "query": 17 -// } -// see https://qdrant.tech/documentation/concepts/search/#query-api -// // - 'using': specify which vector to use for visualization // if there are multiple. // From 7ff893ae85cfa73ebb2e18c1c3ac6ac21f7534fd Mon Sep 17 00:00:00 2001 From: Kartik Gupta <84975264+kartik-gupta-ij@users.noreply.github.com> Date: Tue, 3 Dec 2024 21:51:03 +0530 Subject: [PATCH 7/7] fix[VisualizeChart]: define color for null and undefined in VisualizeChart (#260) --- src/components/VisualizeChart/renderBy.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/components/VisualizeChart/renderBy.js b/src/components/VisualizeChart/renderBy.js index ec7fe316..6323cc30 100644 --- a/src/components/VisualizeChart/renderBy.js +++ b/src/components/VisualizeChart/renderBy.js @@ -75,9 +75,6 @@ export function generateColorBy(points, colorBy = null) { return points.map((point) => { const payloadValue = getNestedValue(point.payload, colorBy.payload); - if (payloadValue === undefined || payloadValue === null) { - return BACKGROUND_COLOR; - } return colorByPayload(payloadValue, valuesToColor); }); }