From 5388d4b67b6806754155a7ff1acf30ace421912b Mon Sep 17 00:00:00 2001
From: Holtz Yan
Date: Wed, 23 Oct 2024 15:17:37 +0200
Subject: [PATCH] remove nivo
---
package.json | 1 -
.../introduction/js-dataviz-libraries.tsx | 39 +++---------------
pages/course/svg/d3-shape.tsx | 24 +++++++----
public/img/nivo-barchart.png | Bin 0 -> 22554 bytes
viz/exercise/d3AreaFunctionPractice/Graph.tsx | 10 ++---
5 files changed, 26 insertions(+), 48 deletions(-)
create mode 100644 public/img/nivo-barchart.png
diff --git a/package.json b/package.json
index 71e614e8..efe2dba8 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,6 @@
},
"dependencies": {
"@headlessui/react": "^1.4.2",
- "@nivo/bar": "^0.87.0",
"@radix-ui/react-accordion": "^1.2.0",
"@radix-ui/react-dropdown-menu": "^2.1.1",
"@radix-ui/react-menubar": "^1.1.1",
diff --git a/pages/course/introduction/js-dataviz-libraries.tsx b/pages/course/introduction/js-dataviz-libraries.tsx
index 574a5c62..c6c49c1d 100644
--- a/pages/course/introduction/js-dataviz-libraries.tsx
+++ b/pages/course/introduction/js-dataviz-libraries.tsx
@@ -3,11 +3,9 @@ import TitleAndDescription from '@/component/TitleAndDescription';
import { LayoutCourse } from '@/component/LayoutCourse';
import { lessonList } from '@/util/lessonList';
-// import { ResponsiveBar } from '@nivo/bar';
import { CodeBlock } from '@/component/UI/CodeBlock';
import { Caption } from '@/component/UI/Caption';
import { Sidenote } from '@/component/SideNote';
-import { ResponsiveBar } from '@nivo/bar';
import {
Table,
TableBody,
@@ -18,14 +16,6 @@ import {
TableRow,
} from '@/component/UI/table';
-const data = [
- { country: 'USA', value: 100 },
- { country: 'UK', value: 80 },
- { country: 'Canada', value: 60 },
- { country: 'Germany', value: 50 },
- { country: 'Japan', value: 70 },
-];
-
const previousURL = '/course/introduction/introduction-to-react';
const currentURL = '/course/introduction/js-dataviz-libraries';
const nextURL = '/course/introduction/introduction-to-d3';
@@ -132,30 +122,11 @@ import { ResponsiveBar } from '@nivo/bar';
Time to celebrate 🎉.
-
-
+
diff --git a/pages/course/svg/d3-shape.tsx b/pages/course/svg/d3-shape.tsx
index ebc8bb61..5f03ce34 100644
--- a/pages/course/svg/d3-shape.tsx
+++ b/pages/course/svg/d3-shape.tsx
@@ -401,21 +401,31 @@ const exercices: Exercise[] = [
{
whyItMatters: (
<>
- Accessor functions are a fundamental concept in d3.js.
- They’re incredibly useful because they allow d3 to work with any
- structure of input data, giving you the flexibility to handle
- different data formats.
+ Using the area()
function is almost the same as the{' '}
+ line()
function.
+
+
+ That's the magic of the d3-shape
module, you switch from
+ one shape to the other easily!
>
),
toDo: (
- This time, the data format is slightly different, with the x position
- stored in a xAxisPosition
property.
+ Let's switch to an area chart, thanks to the d3.area()
{' '}
+ function. Three methods must be chained to area()
:
+
+
+ x()
is the same as for the line chart.
+
+
+ y0()
: Y coordinate of the bottom of the area
+
+
+ y1()
Y coordinate of the top.
- Update the accessor function to create the line chart again.
),
practiceSandbox: 'exercise/d3AreaFunctionPractice',
diff --git a/public/img/nivo-barchart.png b/public/img/nivo-barchart.png
new file mode 100644
index 0000000000000000000000000000000000000000..1df84eeddd6e8b25e327154b81ad1135ef11d177
GIT binary patch
literal 22554
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
HoD!M {
- // Use the line() function of d3 to create a path generator that expects data as input
- const lineGenerator = '';
+ // use the d3.area() function here
+ const areaGenerator = '';
- // Use the lineGenerator function above to build the path string
const path = '';
return (
- {/* The path built above is used here for the d argument */}
-
+
);
};