From 1eb81d2ebf52a3fab19aa34ef76ab79d492d5da0 Mon Sep 17 00:00:00 2001
From: Kyle Doherty <5248953+kdoh@users.noreply.github.com>
Date: Fri, 23 Jul 2021 14:19:36 -0400
Subject: [PATCH] add ordinal legend to donuts (#17177)
---
.../metabase/static-viz/categorical/donut.js | 7 ++++++
package.json | 1 +
yarn.lock | 22 ++++++++++++++++++-
3 files changed, 29 insertions(+), 1 deletion(-)
diff --git a/frontend/src/metabase/static-viz/categorical/donut.js b/frontend/src/metabase/static-viz/categorical/donut.js
index c6901ff4beb..d64ad622bf9 100644
--- a/frontend/src/metabase/static-viz/categorical/donut.js
+++ b/frontend/src/metabase/static-viz/categorical/donut.js
@@ -3,6 +3,7 @@ import React from "react";
import { Pie } from "@visx/shape";
import { scaleOrdinal } from "@visx/scale";
import { Group } from "@visx/group";
+import { LegendOrdinal } from "@visx/legend";
export default function Donut({ data, accessors }, layout) {
const scale = scaleOrdinal({
@@ -59,6 +60,12 @@ export default function Donut({ data, accessors }, layout) {
}}
</Pie>
</Group>
+ <LegendOrdinal
+ scale={scale}
+ direction={"row"}
+ itemMargin={8}
+ shape={"circle"}
+ />
</svg>
);
}
diff --git a/package.json b/package.json
index 03f7a2d4979..6db3365169b 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
"@visx/axis": "1.8.0",
"@visx/grid": "1.16.0",
"@visx/group": "1.7.0",
+ "@visx/legend": "^1.17.1",
"@visx/scale": "1.7.0",
"@visx/shape": "1.8.0",
"ace-builds": "^1.4.7",
diff --git a/yarn.lock b/yarn.lock
index 67352f6610b..d002ccf40e2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1439,6 +1439,15 @@
classnames "^2.2.5"
prop-types "^15.6.2"
+"@visx/group@1.17.1":
+ version "1.17.1"
+ resolved "https://registry.yarnpkg.com/@visx/group/-/group-1.17.1.tgz#23818d3233511dc2360de4febc2a3ecd43c3c9d0"
+ integrity sha512-g8pSqy8TXAisiOzypnVycDynEGlBhfxtVlwDmsbYB+XSFGEjnOheQSDohDI+ia7ek54Mw9uYe05tx5kP1hRMYw==
+ dependencies:
+ "@types/react" "*"
+ classnames "^2.3.1"
+ prop-types "^15.6.2"
+
"@visx/group@1.7.0":
version "1.7.0"
resolved "https://registry.yarnpkg.com/@visx/group/-/group-1.7.0.tgz#e0ef2efbe00ef05326215d65b3d8a2b114df4f35"
@@ -1449,6 +1458,17 @@
classnames "^2.2.5"
prop-types "^15.6.2"
+"@visx/legend@^1.17.1":
+ version "1.17.1"
+ resolved "https://registry.yarnpkg.com/@visx/legend/-/legend-1.17.1.tgz#3908321da90f3a30d3608cc572a6c13b34a3298b"
+ integrity sha512-vdB3EPHXYwTyS4g2MB/sVAvq6ddeyzjlTjsM6YNc6Nagwb4uTOuMeKT+t0jgLJejNMOcY7Q8eBjDDWAdiPNV1A==
+ dependencies:
+ "@types/react" "*"
+ "@visx/group" "1.17.1"
+ "@visx/scale" "1.14.0"
+ classnames "^2.3.1"
+ prop-types "^15.5.10"
+
"@visx/point@1.7.0":
version "1.7.0"
resolved "https://registry.yarnpkg.com/@visx/point/-/point-1.7.0.tgz#1df3c3425eae464f498473bcdda2fcae05c8ecbe"
@@ -3802,7 +3822,7 @@ classlist-polyfill@^1.2.0:
resolved "https://registry.yarnpkg.com/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz#935bc2dfd9458a876b279617514638bcaa964a2e"
integrity sha1-k1vC39lFiodrJ5YXUUY4vKqWSi4=
-classnames@*, classnames@2.3.1:
+classnames@*, classnames@2.3.1, classnames@^2.3.1:
version "2.3.1"
resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==
--
GitLab