add astronaut scatterplot

Author: holtzy

src/pages/bubble-plot.js

@@ -165,16 +165,21 @@ export default function BubblePlot() {
           even better, submit a <a href="https://github.com/holtzy/The-Python-Graph-Gallery">Pull Request</a>!
         </p>
         <Row>
-          <Col xs={12} md={6}>
+          <Col xs={12} md={4}>
             <Link to={"/web-text-repel-with-matplotlib"}>
               <ChartImage imgName={"web-text-repel-with-matplotlib-square"} caption={"Learn how to use the adjustText library to add many labels with no overlaps."} />
             </Link>
           </Col>
-          <Col xs={12} md={6}>
+          <Col xs={12} md={4}>
             <Link to={"/web-scatterplot-text-annotation-and-regression-matplotlib"}>
               <ChartImage imgName={"web-scatterplot-text-annotation-and-regression-matplotlib-square"} caption={"Scatterplot with regression fit, group colors and non-overlapping labels."} />
             </Link>
           </Col>
+          <Col xs={12} md={4}>
+            <Link to={"/web-scatterplot-astronaut"}>
+              <ChartImage imgName={"web-scatterplot-astronaut-square"} caption={"Dark mode scatterplot with custom annotations, title and explanations. All of that with a very good appearance!"} />
+            </Link>
+          </Col>
         </Row>
       </Container>
 

src/pages/scatter-plot.js

@@ -277,16 +277,21 @@ export default function ViolinPlot() {
           even better, submit a <a href="https://github.com/holtzy/The-Python-Graph-Gallery">Pull Request</a>!
         </p>
         <Row>
-          <Col xs={12} md={6}>
+          <Col xs={12} md={4}>
             <Link to={"/web-text-repel-with-matplotlib"}>
               <ChartImage imgName={"web-text-repel-with-matplotlib-square"} caption={"Learn how to use the adjustText library to add many labels with no overlaps."} />
             </Link>
           </Col>
-          <Col xs={12} md={6}>
+          <Col xs={12} md={4}>
             <Link to={"/web-scatterplot-text-annotation-and-regression-matplotlib"}>
               <ChartImage imgName={"web-scatterplot-text-annotation-and-regression-matplotlib-square"} caption={"Scatterplot with regression fit, group colors and non-overlapping labels."} />
             </Link>
           </Col>
+          <Col xs={12} md={4}>
+            <Link to={"/web-scatterplot-astronaut"}>
+              <ChartImage imgName={"web-scatterplot-astronaut-square"} caption={"Dark mode scatterplot with custom annotations, title and explanations. All of that with a very good appearance!"} />
+            </Link>
+          </Col>
         </Row>
       </Container>