From eac2e337f64c2366894b4b3566e816c8dfa4b845 Mon Sep 17 00:00:00 2001
From: Sebastian Schmidt <mrschmidt@google.com>
Date: Mon, 13 Mar 2023 13:51:30 -0700
Subject: [PATCH] Sort vision tasks in README.md

PiperOrigin-RevId: 516312229
---
 mediapipe/tasks/web/vision/README.md | 66 ++++++++++++++--------------
 1 file changed, 33 insertions(+), 33 deletions(-)

diff --git a/mediapipe/tasks/web/vision/README.md b/mediapipe/tasks/web/vision/README.md
index 9e86eafd3..c1f15ec26 100644
--- a/mediapipe/tasks/web/vision/README.md
+++ b/mediapipe/tasks/web/vision/README.md
@@ -2,23 +2,42 @@
 
 This package contains the vision tasks for MediaPipe.
 
-## Object Detection
+## Gesture Recognition
 
-The MediaPipe Object Detector task lets you detect the presence and location of
-multiple classes of objects within images or videos.
+The MediaPipe Gesture Recognizer task lets you recognize hand gestures in real
+time, and provides the recognized hand gesture results along with the landmarks
+of the detected hands. You can use this task to recognize specific hand gestures
+from a user, and invoke application features that correspond to those gestures.
 
 ```
 const vision = await FilesetResolver.forVisionTasks(
     "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
 );
-const objectDetector = await ObjectDetector.createFromModelPath(vision,
-    "https://storage.googleapis.com/mediapipe-tasks/object_detector/efficientdet_lite0_uint8.tflite"
+const gestureRecognizer = await GestureRecognizer.createFromModelPath(vision,
+    "https://storage.googleapis.com/mediapipe-tasks/gesture_recognizer/gesture_recognizer.task"
 );
 const image = document.getElementById("image") as HTMLImageElement;
-const detections = objectDetector.detect(image);
+const recognitions = gestureRecognizer.recognize(image);
 ```
 
-For more information, refer to the [Object Detector](https://developers.google.com/mediapipe/solutions/vision/object_detector/web_js) documentation.
+## Hand Landmark Detection
+
+The MediaPipe Hand Landmarker task lets you detect the landmarks of the hands in
+an image. You can use this Task to localize key points of the hands and render
+visual effects over the hands.
+
+```
+const vision = await FilesetResolver.forVisionTasks(
+    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
+);
+const handLandmarker = await HandLandmarker.createFromModelPath(vision,
+    "https://storage.googleapis.com/mediapipe-tasks/hand_landmarker/hand_landmarker.task"
+);
+const image = document.getElementById("image") as HTMLImageElement;
+const landmarks = handLandmarker.detect(image);
+```
+
+For more information, refer to the [Handlandmark Detection](https://developers.google.com/mediapipe/solutions/vision/hand_landmarker/web_js) documentation.
 
 ## Image Classification
 
@@ -56,40 +75,21 @@ imageSegmenter.segment(image, (masks, width, height) => {
 });
 ```
 
-## Gesture Recognition
+## Object Detection
 
-The MediaPipe Gesture Recognizer task lets you recognize hand gestures in real
-time, and provides the recognized hand gesture results along with the landmarks
-of the detected hands. You can use this task to recognize specific hand gestures
-from a user, and invoke application features that correspond to those gestures.
+The MediaPipe Object Detector task lets you detect the presence and location of
+multiple classes of objects within images or videos.
 
 ```
 const vision = await FilesetResolver.forVisionTasks(
     "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
 );
-const gestureRecognizer = await GestureRecognizer.createFromModelPath(vision,
-    "https://storage.googleapis.com/mediapipe-tasks/gesture_recognizer/gesture_recognizer.task"
+const objectDetector = await ObjectDetector.createFromModelPath(vision,
+    "https://storage.googleapis.com/mediapipe-tasks/object_detector/efficientdet_lite0_uint8.tflite"
 );
 const image = document.getElementById("image") as HTMLImageElement;
-const recognitions = gestureRecognizer.recognize(image);
+const detections = objectDetector.detect(image);
 ```
 
-## Handlandmark Detection
-
-The MediaPipe Hand Landmarker task lets you detect the landmarks of the hands in
-an image. You can use this Task to localize key points of the hands and render
-visual effects over the hands.
-
-```
-const vision = await FilesetResolver.forVisionTasks(
-    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
-);
-const handLandmarker = await HandLandmarker.createFromModelPath(vision,
-    "https://storage.googleapis.com/mediapipe-tasks/hand_landmarker/hand_landmarker.task"
-);
-const image = document.getElementById("image") as HTMLImageElement;
-const landmarks = handLandmarker.detect(image);
-```
-
-For more information, refer to the [Handlandmark Detection](https://developers.google.com/mediapipe/solutions/vision/hand_landmarker/web_js) documentation.
+For more information, refer to the [Object Detector](https://developers.google.com/mediapipe/solutions/vision/object_detector/web_js) documentation.