From 64d69e605273e95243df1eb31de8b72f83051d8d Mon Sep 17 00:00:00 2001 From: KaranPradhan266 Date: Fri, 5 Dec 2025 01:38:42 -0800 Subject: [PATCH 1/2] Expand chart type supports: Pie Chart --- src/components/ChartTemplates.tsx | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/src/components/ChartTemplates.tsx b/src/components/ChartTemplates.tsx index 0f94d6a..e5e2420 100644 --- a/src/components/ChartTemplates.tsx +++ b/src/components/ChartTemplates.tsx @@ -3,6 +3,8 @@ import { ChartTemplate } from "./ComponentType"; import InsightsIcon from '@mui/icons-material/Insights'; +import PublicIcon from '@mui/icons-material/Public'; +import PieChartOutlineIcon from '@mui/icons-material/PieChartOutline'; import React from "react"; // Import all chart icons statically so they are included in the build @@ -322,6 +324,24 @@ const barCharts: ChartTemplate[] = [ } ] +const pieCharts: ChartTemplate[] = [ + { + "chart": "Pie Chart", + "icon": , + "template": { + "mark": "arc", + "encoding": { } + }, + "channels": ["theta", "color", "column", "row"], + "paths": { + "theta": ["encoding", "theta"], + "color": ["encoding", "color"], + "column": ["encoding", "column"], + "row": ["encoding", "row"] + } + } +] + let lineCharts = [ { "chart": "Line Chart", @@ -422,6 +442,7 @@ export const CHART_TEMPLATES : {[key: string] : ChartTemplate[]} = { "table": tablePlots, "scatter": scatterPlots, "bar": barCharts, + "pie": pieCharts, "line": lineCharts, "custom": customCharts, } \ No newline at end of file From bf477f45008c4bac95a39036d3e3ee261f2f5512 Mon Sep 17 00:00:00 2001 From: KaranPradhan266 Date: Fri, 5 Dec 2025 03:04:38 -0800 Subject: [PATCH 2/2] Expand chart type supports: US Map --- src/components/ChartTemplates.tsx | 50 +++++++++++++++++++++++++++++++ 1 file changed, 50 insertions(+) diff --git a/src/components/ChartTemplates.tsx b/src/components/ChartTemplates.tsx index e5e2420..1d00bbb 100644 --- a/src/components/ChartTemplates.tsx +++ b/src/components/ChartTemplates.tsx @@ -324,6 +324,55 @@ const barCharts: ChartTemplate[] = [ } ] +const mapCharts: ChartTemplate[] = [ + { + "chart": "US Map with Points", + "icon": , + "template": { + "width": 500, + "height": 300, + "layer": [ + { + "data": { + "url": "https://vega.github.io/vega-lite/data/us-10m.json", + "format": { + "type": "topojson", + "feature": "states" + } + }, + "projection": { + "type": "albersUsa" + }, + "mark": { + "type": "geoshape", + "fill": "lightgray", + "stroke": "white" + } + }, + { + "projection": { + "type": "albersUsa" + }, + "mark": "circle", + "encoding": { + "longitude": { }, + "latitude": { }, + "size": {}, + "color": {} + } + } + ] + }, + "channels": ["longitude", "latitude", "color", "size"], + "paths": { + "longitude": ["layer", 1, "encoding", "longitude"], + "latitude": ["layer", 1, "encoding", "latitude"], + "color": ["layer", 1, "encoding", "color"], + "size": ["layer", 1, "encoding", "size"] + } + } +] + const pieCharts: ChartTemplate[] = [ { "chart": "Pie Chart", @@ -442,6 +491,7 @@ export const CHART_TEMPLATES : {[key: string] : ChartTemplate[]} = { "table": tablePlots, "scatter": scatterPlots, "bar": barCharts, + "map": mapCharts, "pie": pieCharts, "line": lineCharts, "custom": customCharts,