1213 0050 update

andy89923 · Jan 12, 2023 · 3ebcb44 · 3ebcb44
1 parent 2dc7094
commit 3ebcb44
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 4 deletions.
diff --git a/movis/src/pages/f315/geo-map.tsx b/movis/src/pages/f315/geo-map.tsx
@@ -10,6 +10,7 @@ import {
 } from "chart.js";
 import { getCountDict } from "../../utils/relationUtils";
 import { iso_3166_1_2_digit_to_number_map } from "../../utils/isoMapping";
+import { start } from "repl";
 
 ChartJS.register(
   Title,
@@ -92,6 +93,14 @@ export default function Map(data: any) {
           legend: {
             display: false,
           },
+          title: {
+            text: "Number are normalized by Log scale",
+            align: "start",
+            display: false,
+            font: {
+              size: 14,
+            },
+          },
         },
         scales: {
           projection: {

diff --git a/movis/src/pages/f315/index.tsx b/movis/src/pages/f315/index.tsx
@@ -108,6 +108,9 @@ const CountLinePlot: React.FC<{
         type: "linear" as const,
         display: true,
         position: "left" as const,
+        ticks: {
+          color: "rgba(255, 110, 140, 1)",
+        },
       },
       y1: {
         type: "linear" as const,
@@ -118,6 +121,22 @@ const CountLinePlot: React.FC<{
         },
       },
     },
+    plugins: {
+      title: {
+        display: false,
+      },
+      legend: {
+        display: true,
+        position: "bottom",
+        align: "center",
+        labels: {
+          boxWidth: 30,
+          font: {
+            size: 16,
+          },
+        },
+      },
+    },
     responsive: true,
     maintainAspectRatio: false,
   };
@@ -142,7 +161,7 @@ const CountLinePlot: React.FC<{
     labels: all_labels,
     datasets: [
       {
-        label: "count",
+        label: "# of Movies",
         data: all_labels.map((dat) => {
           return props.movies.filter((mov) => {
             return Object.is(dateToStr(mov.release_date), dat);
@@ -157,7 +176,7 @@ const CountLinePlot: React.FC<{
       {
         label: "revenue",
         data: all_labels.map((dat) => {
-          var sum = 0;
+          let sum = 0;
           props.movies.map((mov) => {
             if (Object.is(dateToStr(mov.release_date), dat)) sum += mov.revenue;
           });
@@ -172,7 +191,7 @@ const CountLinePlot: React.FC<{
       {
         label: "budget",
         data: all_labels.map((dat) => {
-          var sum = 0;
+          let sum = 0;
           props.movies.map((mov) => {
             if (Object.is(dateToStr(mov.release_date), dat)) sum += mov.budget;
           });
@@ -324,10 +343,16 @@ const Home: NextPage = () => {
               >
                 <div className="flex h-full flex-col items-center justify-center gap-4 rounded-xl bg-white/90 p-4 text-lg text-black hover:bg-white/100">
                   <Map data={movies} />
+                  <div className="text-[0.5rem] text-gray-500">
+                    Number are normalized by Log scale
+                  </div>
                 </div>
               </ZoomCard>
 
-              <ZoomCard title="Genres Count" className="col-span-2 row-span-2">
+              <ZoomCard
+                title="Genres Distribution"
+                className="col-span-2 row-span-2"
+              >
                 <div className="flex h-full flex-col gap-4 rounded-xl bg-white/90 p-4 text-lg text-black hover:bg-white/100">
                   <GenreBarPlot data={movies} />
                 </div>