Merge pull request #281 from plotly/add-annotations-example

Add JS example of Annotations with Log Axes

Author: LiamConnors

_posts/plotly_js/fundamentals/annotations/2024-02-01-annotation-log-axis.html

@@ -0,0 +1,46 @@
+---
+name: Annotations with Log Axes
+language: plotly_js
+suite: annotations
+order: 3.5
+sitemap: false
+arrangement: horizontal
+markdown_content: |
+  If the `x` or `y` positions of an annotation reference a log axis, you need to provide that position as a `log10` value when adding the annotation. In this example, the `yaxis` is a log axis so we pass the `log10` value of `1000` to the annotation's `y` position.
+---
+var dates = [
+    "2024-01-01",
+    "2024-01-02",
+    "2024-01-03",
+    "2024-01-04",
+    "2024-01-05",
+    "2024-01-06",
+];
+
+var y_values = [1, 30, 70, 100, 1000, 10000000];
+
+var trace1 = {
+    x: dates,
+    y: y_values,
+    mode: 'lines+markers',
+    type: 'scatter'
+};
+
+var layout = {
+    yaxis: {
+        type: 'log',
+    },
+    annotations: [
+        {
+            x: '2024-01-05',
+            y: Math.log10(1000),
+            text: 'Log axis annotation',
+            showarrow: true,
+            xanchor: 'right',
+        }
+    ]
+};
+
+var data = [trace1];
+
+Plotly.newPlot('myDiv', data, layout);