From: Sanjay Rohila <sanjay.rohila@srijan.net>
Date: Sun, 2 Oct 2016 15:28:50 +0000 (+0530)
Subject: [Feature Request] Provide option to set color and width for annotation line (#703)
X-Git-Tag: v2.0.0~12
X-Git-Url: https://adrianiainlam.tk/git/?a=commitdiff_plain;h=0bc4cb546af5d1ce157ad701a45169cc07c9c839;hp=36b7208a4cb1495492009ff1be0364c119816cec;p=dygraphs.git

[Feature Request] Provide option to set color and width for annotation line (#703)

* Provide option to set color and width for annotation line

* documentation for new annotation options
---

diff --git a/docs/annotations.html b/docs/annotations.html
index 9ed49b1..7a0c1e3 100644
--- a/docs/annotations.html
+++ b/docs/annotations.html
@@ -194,6 +194,8 @@ g.ready(function() {
 <tr><td><code>height</code></td><td>Height (in pixels) of the annotation flag or icon.</td></tr>
 <tr><td><code>cssClass</code></td><td>CSS class to use for styling the annotation.</td></tr>
 <tr><td><code>tickHeight</code></td><td>Height of the tick mark (in pixels) connecting the point to its flag or icon.</td></tr>
+<tr><td><code>tickWidth</code></td><td>Width of the tick mark connecting the point to its flag or icon.</td></tr>
+<tr><td><code>tickColor</code></td><td>Color of the tick mark connecting the point to its flag or icon.</td></tr>
 <tr><td><code>attachAtBottom</code></td><td>If true, attach annotations to the x-axis, rather than to actual points.</td></tr>
 <tr><td><code>clickHandler</code></td>    <td>See Handlers, below</td></tr>
 <tr><td><code>mouseOverHandler</code></td><td>See Handlers, below</td></tr>
diff --git a/src/plugins/annotations.js b/src/plugins/annotations.js
index 87153c8..f6dd68e 100644
--- a/src/plugins/annotations.js
+++ b/src/plugins/annotations.js
@@ -148,7 +148,8 @@ annotations.prototype.didDrawChart = function(e) {
 
     var ctx = e.drawingContext;
     ctx.save();
-    ctx.strokeStyle = g.colorsMap_[p.name];
+    ctx.strokeStyle = a.hasOwnProperty('tickColor') ? a.tickColor : g.colorsMap_[p.name];
+    ctx.lineWidth = a.hasOwnProperty('tickWidth') ? a.tickWidth : g.getOption('strokeWidth');
     ctx.beginPath();
     if (!a.attachAtBottom) {
       ctx.moveTo(p.canvasx, p.canvasy);
diff --git a/tests/annotation.html b/tests/annotation.html
index 4cdcb10..002d4dd 100644
--- a/tests/annotation.html
+++ b/tests/annotation.html
@@ -93,6 +93,8 @@
         width: 18,
         height: 23,
         tickHeight: 4,
+        tickColor: 'indianred',
+        tickWidth: 2,
         text: 'Another one',
         cssClass: 'annotation',
         clickHandler: function() {