Merge pull request #18033 from rgaricano/dev-FEAT_Vega_Visualizer
Deploy to HuggingFace Spaces / check-secret (push) Waiting to run
Details
Deploy to HuggingFace Spaces / deploy (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / build-main-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-main-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-cuda-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-cuda-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-cuda126-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-cuda126-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-ollama-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-ollama-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-slim-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-slim-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / merge-main-images (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / merge-cuda-images (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / merge-cuda126-images (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / merge-ollama-images (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / merge-slim-images (push) Blocked by required conditions
Details
Python CI / Format Backend (3.11.x) (push) Waiting to run
Details
Python CI / Format Backend (3.12.x) (push) Waiting to run
Details
Frontend Build / Format & Build Frontend (push) Waiting to run
Details
Frontend Build / Frontend Unit Tests (push) Waiting to run
Details
Deploy to HuggingFace Spaces / check-secret (push) Waiting to run
Details
Deploy to HuggingFace Spaces / deploy (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / build-main-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-main-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-cuda-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-cuda-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-cuda126-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-cuda126-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-ollama-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-ollama-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-slim-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Details
Create and publish Docker images with specific build args / build-slim-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Details
Create and publish Docker images with specific build args / merge-main-images (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / merge-cuda-images (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / merge-cuda126-images (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / merge-ollama-images (push) Blocked by required conditions
Details
Create and publish Docker images with specific build args / merge-slim-images (push) Blocked by required conditions
Details
Python CI / Format Backend (3.11.x) (push) Waiting to run
Details
Python CI / Format Backend (3.12.x) (push) Waiting to run
Details
Frontend Build / Format & Build Frontend (push) Waiting to run
Details
Frontend Build / Frontend Unit Tests (push) Waiting to run
Details
FEAT: Add Vega Char Visualizer Renderer
This commit is contained in:
commit
0a4922b40f
|
@ -137,6 +137,7 @@
|
|||
"turndown-plugin-gfm": "^1.0.2",
|
||||
"undici": "^7.3.0",
|
||||
"uuid": "^9.0.1",
|
||||
"vega": "^6.2.0",
|
||||
"vite-plugin-static-copy": "^2.2.0",
|
||||
"y-prosemirror": "^1.3.7",
|
||||
"yaml": "^2.7.1",
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
import PyodideWorker from '$lib/workers/pyodide.worker?worker';
|
||||
import { executeCode } from '$lib/apis/utils';
|
||||
import { copyToClipboard, renderMermaidDiagram } from '$lib/utils';
|
||||
import { copyToClipboard, renderMermaidDiagram, renderVegaVisualization } from '$lib/utils';
|
||||
|
||||
import 'highlight.js/styles/github-dark.min.css';
|
||||
|
||||
|
@ -55,6 +55,7 @@
|
|||
let _token = null;
|
||||
|
||||
let mermaidHtml = null;
|
||||
let vegaHtml = null;
|
||||
|
||||
let highlightedCode = null;
|
||||
let executing = false;
|
||||
|
@ -326,6 +327,11 @@
|
|||
onUpdate(token);
|
||||
if (lang === 'mermaid' && (token?.raw ?? '').slice(-4).includes('```')) {
|
||||
mermaidHtml = await renderMermaidDiagram(code);
|
||||
} else if (
|
||||
(lang === 'vega' || lang === 'vega-lite') &&
|
||||
(token?.raw ?? '').slice(-4).includes('```')
|
||||
) {
|
||||
vegaHtml = await renderVegaVisualization(code);
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -397,6 +403,16 @@
|
|||
{:else}
|
||||
<pre class="mermaid">{code}</pre>
|
||||
{/if}
|
||||
{:else if lang === 'vega' || lang === 'vega-lite'}
|
||||
{#if vegaHtml}
|
||||
<SvgPanZoom
|
||||
className="rounded-3xl max-h-fit overflow-hidden"
|
||||
svg={vegaHtml}
|
||||
content={_token.text}
|
||||
/>
|
||||
{:else}
|
||||
<pre class="vega">{code}</pre>
|
||||
{/if}
|
||||
{:else}
|
||||
<div
|
||||
class="absolute left-0 right-0 py-2.5 pr-3 text-text-300 pl-4.5 text-xs font-medium dark:text-white"
|
||||
|
|
|
@ -1596,3 +1596,16 @@ export const renderMermaidDiagram = async (code: string) => {
|
|||
return '';
|
||||
}
|
||||
};
|
||||
|
||||
export const renderVegaVisualization = async (spec: string) => {
|
||||
try {
|
||||
const vega = await import('vega');
|
||||
const parsedSpec = JSON.parse(spec);
|
||||
const view = new vega.View(vega.parse(parsedSpec), { renderer: 'none' });
|
||||
const svg = await view.toSVG();
|
||||
return svg;
|
||||
} catch (error) {
|
||||
console.log('Failed to render Vega visualization:', error);
|
||||
return '';
|
||||
}
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue