docs: Move point to top of docs #88

h2oai · Nov 10, 2022 · 72a1461 · 72a1461
1 parent 6379f92
commit 72a1461
Show file tree

Hide file tree

Showing 4 changed files with 82 additions and 83 deletions.
diff --git a/help/docs/guide/graphics.md b/help/docs/guide/graphics.md
@@ -97,6 +97,50 @@ view(
 ![Screenshot](assets/screenshots/graphics_intro.png)
 
 
+## Point
+
+Set `mode='g-point'` to draw shapes at multiple points.
+
+Set `data=` to a sequence of normalized `[x, y, size, shape]` values, where:
+
+- `(x, y)` is the anchor point of the shape.
+- `size` determines the size of the shape, in pixels (note that this is a fixed size, not normalized).
+- `shape` is one of `c` (circle, default), `s` (square), `d` (diamond),
+`tu` (triangle-up), `tr` (triangle-right), `td` (triangle-down), `tl` (triangle-left),
+`h` (horizontal bar), `v` (vertical bar), `p` (plus),`x` (cross),
+`au` (arrow-up), `ar` (arrow-right), `al` (arrow-left), `ad` (arrow-down).
+
+
+```py
+view(
+    box(
+        mode='g-point',
+        style='w-64 h-8 fill-none stroke-indigo-700',
+        data=[
+            [1 / 16, .5, 10, 'c'],  # circle
+            [2 / 16, .5, 10, 's'],  # square
+            [3 / 16, .5, 10, 'd'],  # diamond
+            [4 / 16, .5, 10, 'tu'],  # triangle-up
+            [5 / 16, .5, 10, 'tr'],  # triangle-right
+            [6 / 16, .5, 10, 'td'],  # triangle-down
+            [7 / 16, .5, 10, 'tl'],  # triangle-left
+            [8 / 16, .5, 10, 'h'],  # horizontal bar
+            [9 / 16, .5, 10, 'v'],  # vertical bar
+            [10 / 16, .5, 10, 'p'],  # plus
+            [11 / 16, .5, 10, 'x'],  # cross
+            [12 / 16, .5, 10, 'au'],  # arrow-up
+            [13 / 16, .5, 10, 'ar'],  # arrow-right
+            [14 / 16, .5, 10, 'ad'],  # arrow-down
+            [15 / 16, .5, 10, 'al'],  # arrow-left
+        ],
+    )
+)
+```
+
+
+![Screenshot](assets/screenshots/graphics_point.png)
+
+
 ## Line
 
 Set `mode='g-line-x'` or `mode='g-line-y'` to draw line and area charts.
@@ -571,50 +615,6 @@ view(
 ![Screenshot](assets/screenshots/graphics_label.png)
 
 
-## Point
-
-Set `mode='g-point'` to draw shapes at multiple points.
-
-Set `data=` to a sequence of normalized `[x, y, size, shape]` values, where:
-
-- `(x, y)` is the anchor point of the shape.
-- `size` determines the size of the shape, in pixels (note that this is a fixed size, not normalized).
-- `shape` is one of `c` (circle, default), `s` (square), `d` (diamond),
-`tu` (triangle-up), `tr` (triangle-right), `td` (triangle-down), `tl` (triangle-left),
-`h` (horizontal bar), `v` (vertical bar), `p` (plus),`x` (cross),
-`au` (arrow-up), `ar` (arrow-right), `al` (arrow-left), `ad` (arrow-down).
-
-
-```py
-view(
-    box(
-        mode='g-point',
-        style='w-64 h-8 fill-none stroke-indigo-700',
-        data=[
-            [1 / 16, .5, 10, 'c'],  # circle
-            [2 / 16, .5, 10, 's'],  # square
-            [3 / 16, .5, 10, 'd'],  # diamond
-            [4 / 16, .5, 10, 'tu'],  # triangle-up
-            [5 / 16, .5, 10, 'tr'],  # triangle-right
-            [6 / 16, .5, 10, 'td'],  # triangle-down
-            [7 / 16, .5, 10, 'tl'],  # triangle-left
-            [8 / 16, .5, 10, 'h'],  # horizontal bar
-            [9 / 16, .5, 10, 'v'],  # vertical bar
-            [10 / 16, .5, 10, 'p'],  # plus
-            [11 / 16, .5, 10, 'x'],  # cross
-            [12 / 16, .5, 10, 'au'],  # arrow-up
-            [13 / 16, .5, 10, 'ar'],  # arrow-right
-            [14 / 16, .5, 10, 'ad'],  # arrow-down
-            [15 / 16, .5, 10, 'al'],  # arrow-left
-        ],
-    )
-)
-```
-
-
-![Screenshot](assets/screenshots/graphics_point.png)
-
-
 ## Rectangle
 
 Set `mode='g-rect'` to draw multiple rectangles.

diff --git a/help/docs/guide/index.md b/help/docs/guide/index.md
@@ -455,6 +455,7 @@ and it's unsure how long it will take to complete.
 Draw visualizations, microcharts, sparklines, and other data graphics.
 
 - [Introduction](graphics.md#introduction)
+- [Point](graphics.md#point)
 - [Line](graphics.md#line)
 - [Curve](graphics.md#curve)
 - [Step](graphics.md#step)
@@ -465,7 +466,6 @@ Draw visualizations, microcharts, sparklines, and other data graphics.
 - [Gauge](graphics.md#gauge)
 - [Circular Gauge](graphics.md#circular-gauge)
 - [Label](graphics.md#label)
-- [Point](graphics.md#point)
 - [Rectangle](graphics.md#rectangle)
 - [Arc](graphics.md#arc)
 - [Polyline](graphics.md#polyline)

diff --git a/py/pkg/docs/graphics.py b/py/pkg/docs/graphics.py
@@ -106,6 +106,43 @@ def graphics_intro(view: View):  # height 4
     )
 
 
+# ## Point
+# Set `mode='g-point'` to draw shapes at multiple points.
+#
+# Set `data=` to a sequence of normalized `[x, y, size, shape]` values, where:
+#
+# - `(x, y)` is the anchor point of the shape.
+# - `size` determines the size of the shape, in pixels (note that this is a fixed size, not normalized).
+# - `shape` is one of `c` (circle, default), `s` (square), `d` (diamond),
+#   `tu` (triangle-up), `tr` (triangle-right), `td` (triangle-down), `tl` (triangle-left),
+#   `h` (horizontal bar), `v` (vertical bar), `p` (plus),`x` (cross),
+#   `au` (arrow-up), `ar` (arrow-right), `al` (arrow-left), `ad` (arrow-down).
+def graphics_point(view: View):  # height 2
+    view(
+        box(
+            mode='g-point',
+            style='w-64 h-8 fill-none stroke-indigo-700',
+            data=[
+                [1 / 16, .5, 10, 'c'],  # circle
+                [2 / 16, .5, 10, 's'],  # square
+                [3 / 16, .5, 10, 'd'],  # diamond
+                [4 / 16, .5, 10, 'tu'],  # triangle-up
+                [5 / 16, .5, 10, 'tr'],  # triangle-right
+                [6 / 16, .5, 10, 'td'],  # triangle-down
+                [7 / 16, .5, 10, 'tl'],  # triangle-left
+                [8 / 16, .5, 10, 'h'],  # horizontal bar
+                [9 / 16, .5, 10, 'v'],  # vertical bar
+                [10 / 16, .5, 10, 'p'],  # plus
+                [11 / 16, .5, 10, 'x'],  # cross
+                [12 / 16, .5, 10, 'au'],  # arrow-up
+                [13 / 16, .5, 10, 'ar'],  # arrow-right
+                [14 / 16, .5, 10, 'ad'],  # arrow-down
+                [15 / 16, .5, 10, 'al'],  # arrow-left
+            ],
+        )
+    )
+
+
 # ## Line
 # Set `mode='g-line-x'` or `mode='g-line-y'` to draw line and area charts.
 #
@@ -510,43 +547,6 @@ def graphics_label(view: View):  # height 4
     )
 
 
-# ## Point
-# Set `mode='g-point'` to draw shapes at multiple points.
-#
-# Set `data=` to a sequence of normalized `[x, y, size, shape]` values, where:
-#
-# - `(x, y)` is the anchor point of the shape.
-# - `size` determines the size of the shape, in pixels (note that this is a fixed size, not normalized).
-# - `shape` is one of `c` (circle, default), `s` (square), `d` (diamond),
-#   `tu` (triangle-up), `tr` (triangle-right), `td` (triangle-down), `tl` (triangle-left),
-#   `h` (horizontal bar), `v` (vertical bar), `p` (plus),`x` (cross),
-#   `au` (arrow-up), `ar` (arrow-right), `al` (arrow-left), `ad` (arrow-down).
-def graphics_point(view: View):  # height 2
-    view(
-        box(
-            mode='g-point',
-            style='w-64 h-8 fill-none stroke-indigo-700',
-            data=[
-                [1 / 16, .5, 10, 'c'],  # circle
-                [2 / 16, .5, 10, 's'],  # square
-                [3 / 16, .5, 10, 'd'],  # diamond
-                [4 / 16, .5, 10, 'tu'],  # triangle-up
-                [5 / 16, .5, 10, 'tr'],  # triangle-right
-                [6 / 16, .5, 10, 'td'],  # triangle-down
-                [7 / 16, .5, 10, 'tl'],  # triangle-left
-                [8 / 16, .5, 10, 'h'],  # horizontal bar
-                [9 / 16, .5, 10, 'v'],  # vertical bar
-                [10 / 16, .5, 10, 'p'],  # plus
-                [11 / 16, .5, 10, 'x'],  # cross
-                [12 / 16, .5, 10, 'au'],  # arrow-up
-                [13 / 16, .5, 10, 'ar'],  # arrow-right
-                [14 / 16, .5, 10, 'ad'],  # arrow-down
-                [15 / 16, .5, 10, 'al'],  # arrow-left
-            ],
-        )
-    )
-
-
 # ## Rectangle
 # Set `mode='g-rect'` to draw multiple rectangles.
 #

diff --git a/web/src/graphics.tsx b/web/src/graphics.tsx
@@ -1208,7 +1208,6 @@ const redraw = (box: Box, div: HTMLDivElement | null) => {
       }
     }
   }
-  console.log('render')
   while (div.firstChild) div.removeChild(div.firstChild)
   div.appendChild(svg)
 }
-Original file line number
+Diff line change
@@ Expand Up @@
           }
         }
       }
-      console.log('render')
       while (div.firstChild) div.removeChild(div.firstChild)
       div.appendChild(svg)
     }
@@ Expand Down @@