feat: Implementation guide improvements for custom references

docs/using-capture-growth-charts.md

@@ -195,10 +195,66 @@ The structure of the config has to be the same as the one in the example below;
 }
 ```    
 
-#### Custom references (Future functionality)
+#### Custom references
 ##### Create custom references
-1. Create a new key in the `capture-growth-chart` namespace with the key `customReferences`
-2. Add the custom references you want to use. The structure of the custom references has to be the same as the one in the example below. But the **percentileDatasetValues** and **zScoreDatasetValues** should be changed to your custom references. However, you don't need to add references for both percentiles and z-scores, you can choose to only add one of them if you want. 
+1. Create a new key in the `capture-growth-chart` namespace with the key `customReferences`.
+2. Here is the format for the custom references:
+```json
+{
+  "<Indicator key>": {
+    "categoryMetadata": {
+      "gender": "<Girl || Boy>",
+      "label": "<Indicator label>"
+    },
+    "datasets": {
+      "<time interval>": {
+        "metadata": {
+          "range": {
+            "end": <X-axis dataset end>,
+            "start": <X-axis dataset start>
+          },
+          "xAxisLabel": "<Weeks || Months || Weight>",
+          "yAxisLabel": "<Anthropometric measurements, Height || Length || Weight || Head circumference>"
+        },
+        "percentileDatasetValues": [
+          {
+            "P3": <P3 value>,
+            "P15": <P15 value>,
+            "P50": <P50 value>,
+            "P85": <P85 value>,
+            "P97": <P97 value>
+          }
+        ],
+        "zScoreDatasetValues": [
+            {
+            "SD0": <SD0 value>,
+            "SD1": <SD1 value>,
+            "SD2": <SD2 value>,
+            "SD3": <SD3 value>,
+            "SD1neg": <SD1neg value>,
+            "SD2neg": <SD2neg value>,
+            "SD3neg": <SD3neg value>
+            }
+        ]
+      },
+    }
+  }
+}
+```
+
+3. Add the custom references you want to use. The structure of the custom references has to be the same as the one in the example below. But the contents of **percentileDatasetValues** and **zScoreDatasetValues** should be changed to your custom references. However, you don't need to add references for both percentiles and z-scores, you can choose to only add one of them if desired.
+4. Add other indicators if you want, but make sure that the key maps to the right category and gender. The indicator key should be one of the following:
+- `"hcfa_g"` -> Head circumference for age
+- `"lhfa_g"` -> Length/height for age
+- `"wfa_g"` -> Weight for age
+- `"wlfh_g"` -> Weight for length/height
+<br>
+    `"_g"` indicates that the gender is girl. If you want to add references for boys, you can add the same key but with `"_b"` instead of `"_g"`. 
+    For example; 
+    `"hcfa_b"` -> Head circumference for age
+
+
+Here is an example of how the custom references could look like:
 ```json
 {
   "lhfa_g": {
@@ -310,7 +366,5 @@ The structure of the config has to be the same as the one in the example below;
 }
 ```
 
-
 ##### Use custom references
-
 Now you can set `customReferences` to `true` in the config. This will make the plugin use the custom references you have created. If you want to use the default references, you can set `customReferences` to `false` in the config. This will make the plugin use the WHO references. Make sure to also alter the `usePercentiles` in the chart config to match the references you are using, z-scores or percentiles.