update ApexCharts to 3.7.0

2019-05-29 13:04:35 +02:00 · 2019-05-29 13:04:35 +02:00 · 8e3742eff3
parent bdda107e19
commit 8e3742eff3
57 changed files with 430 additions and 612 deletions
--- a/2
+++ b/2
@ -1,5 +1,5 @@
 Package: apexcharter
-Version: 0.0.4.920
+Version: 0.0.4.930
 Title: Create Interactive Chart with the JavaScript 'ApexCharts' Library
 Description: Provides an 'htmlwidgets' interface to 'apexcharts.js'.
 Authors@R: c(
--- a/docs/LICENSE-text.html
+++ b/docs/LICENSE-text.html
@ -60,7 +60,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/articles/index.html
+++ b/docs/articles/index.html
@ -60,7 +60,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/articles/labs.html
+++ b/docs/articles/labs.html
@ -30,7 +30,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

@ -83,7 +83,7 @@
 <!--/.navbar -->

      
-      </header><script src="labs_files/htmlwidgets-1.3/htmlwidgets.js"></script><script src="labs_files/apexcharts-3.6.12/apexcharts.min.js"></script><script src="labs_files/apexcharter-binding-0.0.4.920/apexcharter.js"></script><div class="row">
+      </header><script src="labs_files/htmlwidgets-1.3/htmlwidgets.js"></script><script src="labs_files/apexcharts-3.7.0/apexcharts.min.js"></script><script src="labs_files/apexcharter-binding-0.0.4.930/apexcharter.js"></script><div class="row">
  <div class="col-md-9 contents">
    <div class="page-header toc-ignore">
      <h1>Labs: title, subtitle &amp; axis</h1>
@ -107,16 +107,16 @@
 <a href="#chart-title" class="anchor"></a>Chart title</h2>
 <div class="sourceCode" id="cb2"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb2-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> n_cut, <span class="dt">type =</span> <span class="st">"column"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> cut, <span class="dt">y =</span> n)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb2-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_title.html">ax_title</a></span>(<span class="dt">text =</span> <span class="st">"Cut distribution"</span>)</a></code></pre></div>
-<div id="htmlwidget-406027b5b794e657c739" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-406027b5b794e657c739">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"title":{"text":"Cut distribution"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>You can set some options, for example:</p>
+<div id="htmlwidget-ebddba44f0a3b3fe27ad" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-ebddba44f0a3b3fe27ad">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"title":{"text":"Cut distribution"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>You can set some options, for example:</p>
 <div class="sourceCode" id="cb3"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb3-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> n_cut, <span class="dt">type =</span> <span class="st">"column"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> cut, <span class="dt">y =</span> n)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb3-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_title.html">ax_title</a></span>(</a>
 <a class="sourceLine" id="cb3-3" title="3">    <span class="dt">text =</span> <span class="st">"Cut distribution"</span>, </a>
 <a class="sourceLine" id="cb3-4" title="4">    <span class="dt">align =</span> <span class="st">"center"</span>,</a>
 <a class="sourceLine" id="cb3-5" title="5">    <span class="dt">style =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/list">list</a></span>(<span class="dt">fontSize =</span> <span class="st">"22px"</span>)</a>
 <a class="sourceLine" id="cb3-6" title="6">  )</a></code></pre></div>
-<div id="htmlwidget-56cb96548a0f48c6de33" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-56cb96548a0f48c6de33">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"title":{"text":"Cut distribution","align":"center","style":{"fontSize":"22px"}}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Full list of parameters is available here : <a href="https://apexcharts.com/docs/options/title/" class="uri">https://apexcharts.com/docs/options/title/</a></p>
+<div id="htmlwidget-147d4c0bb1ebc46d9a73" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-147d4c0bb1ebc46d9a73">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"title":{"text":"Cut distribution","align":"center","style":{"fontSize":"22px"}}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Full list of parameters is available here : <a href="https://apexcharts.com/docs/options/title/" class="uri">https://apexcharts.com/docs/options/title/</a></p>
 </div>
 <div id="chart-subtitle" class="section level2">
 <h2 class="hasAnchor">
@ -124,8 +124,8 @@
 <div class="sourceCode" id="cb4"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb4-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> n_cut, <span class="dt">type =</span> <span class="st">"column"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> cut, <span class="dt">y =</span> n)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb4-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_title.html">ax_title</a></span>(<span class="dt">text =</span> <span class="st">"Cut distribution"</span>) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb4-3" title="3"><span class="st">  </span><span class="kw"><a href="../reference/ax_subtitle.html">ax_subtitle</a></span>(<span class="dt">text =</span> <span class="st">"Data from ggplot2"</span>)</a></code></pre></div>
-<div id="htmlwidget-2feb6897946f40575bf1" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-2feb6897946f40575bf1">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"title":{"text":"Cut distribution"},"subtitle":{"text":"Data from ggplot2"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>With same options than for title:</p>
+<div id="htmlwidget-cde4c6d27d445f773acc" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-cde4c6d27d445f773acc">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"title":{"text":"Cut distribution"},"subtitle":{"text":"Data from ggplot2"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>With same options than for title:</p>
 <div class="sourceCode" id="cb5"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb5-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> n_cut, <span class="dt">type =</span> <span class="st">"column"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> cut, <span class="dt">y =</span> n)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb5-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_title.html">ax_title</a></span>(</a>
 <a class="sourceLine" id="cb5-3" title="3">    <span class="dt">text =</span> <span class="st">"Cut distribution"</span>, </a>
@ -137,8 +137,8 @@
 <a class="sourceLine" id="cb5-9" title="9">    <span class="dt">align =</span> <span class="st">"center"</span>,</a>
 <a class="sourceLine" id="cb5-10" title="10">    <span class="dt">style =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/list">list</a></span>(<span class="dt">fontSize =</span> <span class="st">"16px"</span>, <span class="dt">color =</span> <span class="st">"#BDBDBD"</span>)</a>
 <a class="sourceLine" id="cb5-11" title="11">  )</a></code></pre></div>
-<div id="htmlwidget-bd93a33a158eba5fcf77" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-bd93a33a158eba5fcf77">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"title":{"text":"Cut distribution","align":"center","style":{"fontSize":"22px"}},"subtitle":{"text":"Data from ggplot2","align":"center","style":{"fontSize":"16px","color":"#BDBDBD"}}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Full list of parameters is available here : <a href="https://apexcharts.com/docs/options/subtitle/" class="uri">https://apexcharts.com/docs/options/subtitle/</a></p>
+<div id="htmlwidget-b01a5a8e23fe85a617ee" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-b01a5a8e23fe85a617ee">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"title":{"text":"Cut distribution","align":"center","style":{"fontSize":"22px"}},"subtitle":{"text":"Data from ggplot2","align":"center","style":{"fontSize":"16px","color":"#BDBDBD"}}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Full list of parameters is available here : <a href="https://apexcharts.com/docs/options/subtitle/" class="uri">https://apexcharts.com/docs/options/subtitle/</a></p>
 </div>
 <div id="axis-title" class="section level2">
 <h2 class="hasAnchor">
@ -146,8 +146,8 @@
 <div class="sourceCode" id="cb6"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb6-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> n_cut, <span class="dt">type =</span> <span class="st">"column"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> cut, <span class="dt">y =</span> n)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb6-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_yaxis.html">ax_yaxis</a></span>(<span class="dt">title =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/list">list</a></span>(<span class="dt">text =</span> <span class="st">"Count"</span>)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb6-3" title="3"><span class="st">  </span><span class="kw"><a href="../reference/ax_xaxis.html">ax_xaxis</a></span>(<span class="dt">title =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/list">list</a></span>(<span class="dt">text =</span> <span class="st">"Cut"</span>))</a></code></pre></div>
-<div id="htmlwidget-6a797aea1a1d38440e22" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-6a797aea1a1d38440e22">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"yaxis":{"title":{"text":"Count"}},"xaxis":{"title":{"text":"Cut"}}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>With some options:</p>
+<div id="htmlwidget-bec34f25ace10fe3994f" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-bec34f25ace10fe3994f">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"yaxis":{"title":{"text":"Count"}},"xaxis":{"title":{"text":"Cut"}}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>With some options:</p>
 <div class="sourceCode" id="cb7"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb7-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> n_cut, <span class="dt">type =</span> <span class="st">"column"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> cut, <span class="dt">y =</span> n)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb7-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_yaxis.html">ax_yaxis</a></span>(<span class="dt">title =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/list">list</a></span>(</a>
 <a class="sourceLine" id="cb7-3" title="3">    <span class="dt">text =</span> <span class="st">"Count"</span>,</a>
@ -157,8 +157,8 @@
 <a class="sourceLine" id="cb7-7" title="7">    <span class="dt">text =</span> <span class="st">"Cut"</span>, </a>
 <a class="sourceLine" id="cb7-8" title="8">    <span class="dt">style =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/list">list</a></span>(<span class="dt">fontSize =</span> <span class="st">"14px"</span>, <span class="dt">color =</span> <span class="st">"#BDBDBD"</span>)</a>
 <a class="sourceLine" id="cb7-9" title="9">  ))</a></code></pre></div>
-<div id="htmlwidget-b2293ee21bb650cd345c" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-b2293ee21bb650cd345c">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"yaxis":{"title":{"text":"Count","style":{"fontSize":"14px","color":"#BDBDBD"}}},"xaxis":{"title":{"text":"Cut","style":{"fontSize":"14px","color":"#BDBDBD"}}}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
+<div id="htmlwidget-91bae0b3a2d62cf7c3b2" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-91bae0b3a2d62cf7c3b2">{"x":{"ax_opts":{"chart":{"type":"bar"},"series":[{"name":"n","data":[{"x":"Fair","y":1610},{"x":"Good","y":4906},{"x":"Very Good","y":12082},{"x":"Premium","y":13791},{"x":"Ideal","y":21551}]}],"dataLabels":{"enabled":false},"plotOptions":{"bar":{"horizontal":false}},"yaxis":{"title":{"text":"Count","style":{"fontSize":"14px","color":"#BDBDBD"}}},"xaxis":{"title":{"text":"Cut","style":{"fontSize":"14px","color":"#BDBDBD"}}}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
 </div>
  </div>

--- a/docs/articles/labs_files/apexcharter-binding-0.0.4.930/apexcharter.js
+++ b/docs/articles/labs_files/apexcharter-binding-0.0.4.930/apexcharter.js
@ -0,0 +1,93 @@
+HTMLWidgets.widget({
+
+  name: 'apexcharter',
+
+  type: 'output',
+
+  factory: function(el, width, height) {
+
+    var ax_opts;
+    var apexchart = null;
+
+    return {
+
+      renderValue: function(x) {
+
+
+        // Global options
+        ax_opts = x.ax_opts;
+
+        // Sizing
+        if (typeof ax_opts.chart === 'undefined') {
+          ax_opts.chart = {};
+        }
+        ax_opts.chart.width = width;
+        ax_opts.chart.height = height;
+
+        // Generate or update chart
+        if (apexchart === null) {
+          apexchart = new ApexCharts(document.querySelector("#" + el.id), ax_opts);
+          apexchart.render();
+        } else {
+          if (x.auto_update) {
+            apexchart.updateSeries(ax_opts.series);
+          } else {
+            apexchart.destroy();
+            apexchart = new ApexCharts(document.querySelector("#" + el.id), ax_opts);
+            apexchart.render();
+          }
+        }
+        
+
+      },
+      
+      getChart: function(){
+        return apexchart;
+      },
+
+      resize: function(width, height) {
+        apexchart.updateOptions({
+          chart: {
+            width: width,
+            height: height
+          }
+        });
+      }
+
+    };
+  }
+});
+
+// From Friss tuto (https://github.com/FrissAnalytics/shinyJsTutorials/blob/master/tutorials/tutorial_03.Rmd)
+function get_widget(id){
+  
+  // Get the HTMLWidgets object
+  var htmlWidgetsObj = HTMLWidgets.find("#" + id);
+  
+  // Use the getChart method we created to get the underlying billboard chart
+  var widgetObj ;
+  
+  if (typeof htmlWidgetsObj != 'undefined') {
+    widgetObj = htmlWidgetsObj.getChart();
+  }
+
+  return(widgetObj);
+}
+
+
+
+if (HTMLWidgets.shinyMode) {
+  // data = load
+  Shiny.addCustomMessageHandler('update-apexchart-series',
+    function(obj) {
+      var chart = get_widget(obj.id);
+      if (typeof chart != 'undefined') {
+        chart.updateSeries(obj.data.newSeries, obj.data.animate);
+      }
+  });
+}
+
+
+
+
+
--- a/docs/articles/labs_files/apexcharts-3.7.0/apexcharts.min.js
+++ b/docs/articles/labs_files/apexcharts-3.7.0/apexcharts.min.js
--- a/docs/articles/lines.html
+++ b/docs/articles/lines.html
@ -30,7 +30,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

@ -83,7 +83,7 @@
 <!--/.navbar -->

      
-      </header><script src="lines_files/htmlwidgets-1.3/htmlwidgets.js"></script><script src="lines_files/apexcharts-3.6.12/apexcharts.min.js"></script><script src="lines_files/apexcharter-binding-0.0.4.920/apexcharter.js"></script><div class="row">
+      </header><script src="lines_files/htmlwidgets-1.3/htmlwidgets.js"></script><script src="lines_files/apexcharts-3.7.0/apexcharts.min.js"></script><script src="lines_files/apexcharter-binding-0.0.4.930/apexcharter.js"></script><div class="row">
  <div class="col-md-9 contents">
    <div class="page-header toc-ignore">
      <h1>Options &amp; styles for lines</h1>
@ -113,16 +113,16 @@
 <a href="#type-of-line" class="anchor"></a>Type of line</h2>
 <p>Classic line:</p>
 <div class="sourceCode" id="cb2"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb2-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> economics, <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> uempmed))</a></code></pre></div>
-<div id="htmlwidget-b1c11a7ecebd98bd1813" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-b1c11a7ecebd98bd1813">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Spline curve:</p>
+<div id="htmlwidget-0ac204500d6b3c1819b2" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-0ac204500d6b3c1819b2">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Spline curve:</p>
 <div class="sourceCode" id="cb3"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb3-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> economics, <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> uempmed)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb3-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_stroke.html">ax_stroke</a></span>(<span class="dt">curve =</span> <span class="st">"smooth"</span>)</a></code></pre></div>
-<div id="htmlwidget-70a77af466056a7f1b3b" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-70a77af466056a7f1b3b">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"smooth"},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Steps chart:</p>
+<div id="htmlwidget-d90b87b29305bfc0ce9b" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-d90b87b29305bfc0ce9b">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"smooth"},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Steps chart:</p>
 <div class="sourceCode" id="cb4"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb4-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> economics, <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> uempmed)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb4-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_stroke.html">ax_stroke</a></span>(<span class="dt">curve =</span> <span class="st">"stepline"</span>)</a></code></pre></div>
-<div id="htmlwidget-cdd673f64c4181ff64dc" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-cdd673f64c4181ff64dc">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"stepline"},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
+<div id="htmlwidget-8f8f1c06aad3b9cdeda4" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-8f8f1c06aad3b9cdeda4">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"stepline"},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
 </div>
 <div id="line-appearance" class="section level2">
 <h2 class="hasAnchor">
@ -141,20 +141,20 @@
 <a class="sourceLine" id="cb5-11" title="11">      <span class="dt">stops =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/c">c</a></span>(<span class="dv">0</span>, <span class="dv">100</span>, <span class="dv">100</span>, <span class="dv">100</span>)</a>
 <a class="sourceLine" id="cb5-12" title="12">    )</a>
 <a class="sourceLine" id="cb5-13" title="13">  )</a></code></pre></div>
-<div id="htmlwidget-55e9efb015aff5b46ac4" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-55e9efb015aff5b46ac4">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"},"fill":{"type":"gradient","gradient":{"shade":"dark","gradientToColors":["#FDD835"],"shadeIntensity":1,"type":"horizontal","opacityFrom":1,"opacityTo":1,"stops":[0,100,100,100]}}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Solid area color:</p>
+<div id="htmlwidget-05c419c174b5e40913e3" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-05c419c174b5e40913e3">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"},"fill":{"type":"gradient","gradient":{"shade":"dark","gradientToColors":["#FDD835"],"shadeIntensity":1,"type":"horizontal","opacityFrom":1,"opacityTo":1,"stops":[0,100,100,100]}}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Solid area color:</p>
 <div class="sourceCode" id="cb6"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb6-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> economics, <span class="dt">type =</span> <span class="st">"area"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> uempmed)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb6-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_fill.html">ax_fill</a></span>(<span class="dt">type =</span> <span class="st">"solid"</span>, <span class="dt">opacity =</span> <span class="dv">1</span>)</a></code></pre></div>
-<div id="htmlwidget-5c29a5f322ce97687bab" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-5c29a5f322ce97687bab">{"x":{"ax_opts":{"chart":{"type":"area"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"},"fill":{"type":"solid","opacity":1}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Line width:</p>
+<div id="htmlwidget-864359fcc148ed8c2dd9" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-864359fcc148ed8c2dd9">{"x":{"ax_opts":{"chart":{"type":"area"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"},"fill":{"type":"solid","opacity":1}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Line width:</p>
 <div class="sourceCode" id="cb7"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb7-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> economics, <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> uempmed)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb7-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_stroke.html">ax_stroke</a></span>(<span class="dt">width =</span> <span class="dv">1</span>)</a></code></pre></div>
-<div id="htmlwidget-c470f1034a9949550e45" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-c470f1034a9949550e45">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight","width":1},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Dotted line</p>
+<div id="htmlwidget-31fd4e84b3d93042263a" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-31fd4e84b3d93042263a">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight","width":1},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Dotted line</p>
 <div class="sourceCode" id="cb8"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb8-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> economics, <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> uempmed)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb8-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_stroke.html">ax_stroke</a></span>(<span class="dt">dashArray =</span> <span class="dv">6</span>)</a></code></pre></div>
-<div id="htmlwidget-b4e6edb2488858ab1d7b" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-b4e6edb2488858ab1d7b">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight","dashArray":6},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
+<div id="htmlwidget-aaea2b0849227542d783" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-aaea2b0849227542d783">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2011-03-01",21.5],["2011-04-01",20.9],["2011-05-01",21.6],["2011-06-01",22.3],["2011-07-01",22],["2011-08-01",22.4],["2011-09-01",22],["2011-10-01",20.5],["2011-11-01",20.9],["2011-12-01",20.5],["2012-01-01",21],["2012-02-01",19.8],["2012-03-01",19.2],["2012-04-01",19.1],["2012-05-01",19.9],["2012-06-01",20.1],["2012-07-01",17.5],["2012-08-01",18.5],["2012-09-01",18.8],["2012-10-01",19.7],["2012-11-01",18.5],["2012-12-01",17.6],["2013-01-01",16.2],["2013-02-01",17.5],["2013-03-01",17.7],["2013-04-01",17.1],["2013-05-01",17],["2013-06-01",16.6],["2013-07-01",16.3],["2013-08-01",16.8],["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight","dashArray":6},"xaxis":{"type":"datetime"}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
 </div>
 <div id="markers" class="section level2">
 <h2 class="hasAnchor">
@ -162,13 +162,13 @@
 <p>Add points to line :</p>
 <div class="sourceCode" id="cb9"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb9-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/utils/topics/head">tail</a></span>(economics, <span class="dv">20</span>), <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> uempmed)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb9-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_markers.html">ax_markers</a></span>(<span class="dt">size =</span> <span class="dv">6</span>)</a></code></pre></div>
-<div id="htmlwidget-3cb7a932f7ec91c7136e" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-3cb7a932f7ec91c7136e">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"},"markers":{"size":6}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Add labels over points</p>
+<div id="htmlwidget-b3ac323227521e8fcde6" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-b3ac323227521e8fcde6">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"},"markers":{"size":6}},"auto_update":true},"evals":[],"jsHooks":[]}</script><p>Add labels over points</p>
 <div class="sourceCode" id="cb10"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb10-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/utils/topics/head">tail</a></span>(economics, <span class="dv">20</span>), <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> uempmed)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb10-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_markers.html">ax_markers</a></span>(<span class="dt">size =</span> <span class="dv">6</span>) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb10-3" title="3"><span class="st">  </span><span class="kw"><a href="../reference/ax_dataLabels.html">ax_dataLabels</a></span>(<span class="dt">enabled =</span> <span class="ot">TRUE</span>)</a></code></pre></div>
-<div id="htmlwidget-bef61754c40d826b5538" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-bef61754c40d826b5538">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":true},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"},"markers":{"size":6}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
+<div id="htmlwidget-af38b6934974d4e75eed" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-af38b6934974d4e75eed">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"uempmed","data":[["2013-09-01",16.5],["2013-10-01",16.1],["2013-11-01",17],["2013-12-01",17],["2014-01-01",15.9],["2014-02-01",16.2],["2014-03-01",15.9],["2014-04-01",15.6],["2014-05-01",14.5],["2014-06-01",13.2],["2014-07-01",13.5],["2014-08-01",13.3],["2014-09-01",13.3],["2014-10-01",13.5],["2014-11-01",12.8],["2014-12-01",12.6],["2015-01-01",13.4],["2015-02-01",13.1],["2015-03-01",12.2],["2015-04-01",11.7]]}],"dataLabels":{"enabled":true},"stroke":{"curve":"straight"},"xaxis":{"type":"datetime"},"markers":{"size":6}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
 </div>
 <div id="multiple-lines" class="section level2">
 <h2 class="hasAnchor">
@ -178,12 +178,12 @@
 <a class="sourceLine" id="cb11-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_yaxis.html">ax_yaxis</a></span>(<span class="dt">decimalsInFloat =</span> <span class="dv">2</span>) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb11-3" title="3"><span class="st">  </span><span class="kw"><a href="../reference/ax_markers.html">ax_markers</a></span>(<span class="dt">size =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/c">c</a></span>(<span class="dv">3</span>, <span class="dv">6</span>)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb11-4" title="4"><span class="st">  </span><span class="kw"><a href="../reference/ax_stroke.html">ax_stroke</a></span>(<span class="dt">width =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/c">c</a></span>(<span class="dv">1</span>, <span class="dv">3</span>))</a></code></pre></div>
-<div id="htmlwidget-257ce17b3e52644a1f22" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-257ce17b3e52644a1f22">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"pce","data":[["2013-09-01",0.94835294016698],["2013-10-01",0.951999725418522],["2013-11-01",0.957954711217511],["2013-12-01",0.959224650552166],["2014-01-01",0.957302580207824],["2014-02-01",0.961635819153774],["2014-03-01",0.969590101337727],["2014-04-01",0.971143202821325],["2014-05-01",0.974498245252744],["2014-06-01",0.979500776550742],["2014-07-01",0.981371362868004],["2014-08-01",0.987600930144756],["2014-09-01",0.989969195390463],["2014-10-01",0.994413983061755],["2014-11-01",0.998343930462241],["2014-12-01",0.996610634883861],["2015-01-01",0.993075398357659],["2015-02-01",0.994371079705855],["2015-03-01",1],["2015-04-01",0.999776902549317]]},{"name":"pop","data":[["2013-09-01",0.970255780642521],["2013-10-01",0.972031921424187],["2013-11-01",0.973742582361367],["2013-12-01",0.975281358706773],["2014-01-01",0.976631880499284],["2014-02-01",0.978006957233477],["2014-03-01",0.979422958870473],["2014-04-01",0.980888070390833],["2014-05-01",0.982328626969511],["2014-06-01",0.983957438101084],["2014-07-01",0.985643544096583],["2014-08-01",0.987452424800491],["2014-09-01",0.989367710251688],["2014-10-01",0.991135666052793],["2014-11-01",0.992846326989973],["2014-12-01",0.99438510333538],["2015-01-01",0.995743810108451],["2015-02-01",0.997110701862083],["2015-03-01",0.998526703499079],["2015-04-01",1]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight","width":[1,3]},"xaxis":{"type":"datetime"},"yaxis":{"decimalsInFloat":2},"markers":{"size":[3,6]}},"auto_update":true},"evals":[],"jsHooks":[]}</script><div class="sourceCode" id="cb12"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb12-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> economics_long, <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> value01, <span class="dt">group =</span> variable)) <span class="op">%&gt;%</span><span class="st"> </span></a>
+<div id="htmlwidget-193adf1ab68635541ae5" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-193adf1ab68635541ae5">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"pce","data":[["2013-09-01",0.94835294016698],["2013-10-01",0.951999725418522],["2013-11-01",0.957954711217511],["2013-12-01",0.959224650552166],["2014-01-01",0.957302580207824],["2014-02-01",0.961635819153774],["2014-03-01",0.969590101337727],["2014-04-01",0.971143202821325],["2014-05-01",0.974498245252744],["2014-06-01",0.979500776550742],["2014-07-01",0.981371362868004],["2014-08-01",0.987600930144756],["2014-09-01",0.989969195390463],["2014-10-01",0.994413983061755],["2014-11-01",0.998343930462241],["2014-12-01",0.996610634883861],["2015-01-01",0.993075398357659],["2015-02-01",0.994371079705855],["2015-03-01",1],["2015-04-01",0.999776902549317]]},{"name":"pop","data":[["2013-09-01",0.970255780642521],["2013-10-01",0.972031921424187],["2013-11-01",0.973742582361367],["2013-12-01",0.975281358706773],["2014-01-01",0.976631880499284],["2014-02-01",0.978006957233477],["2014-03-01",0.979422958870473],["2014-04-01",0.980888070390833],["2014-05-01",0.982328626969511],["2014-06-01",0.983957438101084],["2014-07-01",0.985643544096583],["2014-08-01",0.987452424800491],["2014-09-01",0.989367710251688],["2014-10-01",0.991135666052793],["2014-11-01",0.992846326989973],["2014-12-01",0.99438510333538],["2015-01-01",0.995743810108451],["2015-02-01",0.997110701862083],["2015-03-01",0.998526703499079],["2015-04-01",1]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight","width":[1,3]},"xaxis":{"type":"datetime"},"yaxis":{"decimalsInFloat":2},"markers":{"size":[3,6]}},"auto_update":true},"evals":[],"jsHooks":[]}</script><div class="sourceCode" id="cb12"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb12-1" title="1"><span class="kw"><a href="../reference/apex.html">apex</a></span>(<span class="dt">data =</span> economics_long, <span class="dt">type =</span> <span class="st">"line"</span>, <span class="dt">mapping =</span> <span class="kw"><a href="../reference/apexcharter-exports.html">aes</a></span>(<span class="dt">x =</span> date, <span class="dt">y =</span> value01, <span class="dt">group =</span> variable)) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb12-2" title="2"><span class="st">  </span><span class="kw"><a href="../reference/ax_yaxis.html">ax_yaxis</a></span>(<span class="dt">decimalsInFloat =</span> <span class="dv">2</span>) <span class="op">%&gt;%</span><span class="st"> </span></a>
 <a class="sourceLine" id="cb12-3" title="3"><span class="st">  </span><span class="kw"><a href="../reference/ax_stroke.html">ax_stroke</a></span>(<span class="dt">dashArray =</span> <span class="kw"><a href="https://www.rdocumentation.org/packages/base/topics/c">c</a></span>(<span class="dv">8</span>, <span class="dv">5</span>))</a></code></pre></div>
-<div id="htmlwidget-f537b9590cec31e4d684" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
-<script type="application/json" data-for="htmlwidget-f537b9590cec31e4d684">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"pce","data":[["2013-09-01",0.94835294016698],["2013-10-01",0.951999725418522],["2013-11-01",0.957954711217511],["2013-12-01",0.959224650552166],["2014-01-01",0.957302580207824],["2014-02-01",0.961635819153774],["2014-03-01",0.969590101337727],["2014-04-01",0.971143202821325],["2014-05-01",0.974498245252744],["2014-06-01",0.979500776550742],["2014-07-01",0.981371362868004],["2014-08-01",0.987600930144756],["2014-09-01",0.989969195390463],["2014-10-01",0.994413983061755],["2014-11-01",0.998343930462241],["2014-12-01",0.996610634883861],["2015-01-01",0.993075398357659],["2015-02-01",0.994371079705855],["2015-03-01",1],["2015-04-01",0.999776902549317]]},{"name":"pop","data":[["2013-09-01",0.970255780642521],["2013-10-01",0.972031921424187],["2013-11-01",0.973742582361367],["2013-12-01",0.975281358706773],["2014-01-01",0.976631880499284],["2014-02-01",0.978006957233477],["2014-03-01",0.979422958870473],["2014-04-01",0.980888070390833],["2014-05-01",0.982328626969511],["2014-06-01",0.983957438101084],["2014-07-01",0.985643544096583],["2014-08-01",0.987452424800491],["2014-09-01",0.989367710251688],["2014-10-01",0.991135666052793],["2014-11-01",0.992846326989973],["2014-12-01",0.99438510333538],["2015-01-01",0.995743810108451],["2015-02-01",0.997110701862083],["2015-03-01",0.998526703499079],["2015-04-01",1]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight","dashArray":[8,5]},"xaxis":{"type":"datetime"},"yaxis":{"decimalsInFloat":2}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
+<div id="htmlwidget-17f2bc313420d7214526" style="width:100%;height:350px;" class="apexcharter html-widget"></div>
+<script type="application/json" data-for="htmlwidget-17f2bc313420d7214526">{"x":{"ax_opts":{"chart":{"type":"line"},"series":[{"name":"pce","data":[["2013-09-01",0.94835294016698],["2013-10-01",0.951999725418522],["2013-11-01",0.957954711217511],["2013-12-01",0.959224650552166],["2014-01-01",0.957302580207824],["2014-02-01",0.961635819153774],["2014-03-01",0.969590101337727],["2014-04-01",0.971143202821325],["2014-05-01",0.974498245252744],["2014-06-01",0.979500776550742],["2014-07-01",0.981371362868004],["2014-08-01",0.987600930144756],["2014-09-01",0.989969195390463],["2014-10-01",0.994413983061755],["2014-11-01",0.998343930462241],["2014-12-01",0.996610634883861],["2015-01-01",0.993075398357659],["2015-02-01",0.994371079705855],["2015-03-01",1],["2015-04-01",0.999776902549317]]},{"name":"pop","data":[["2013-09-01",0.970255780642521],["2013-10-01",0.972031921424187],["2013-11-01",0.973742582361367],["2013-12-01",0.975281358706773],["2014-01-01",0.976631880499284],["2014-02-01",0.978006957233477],["2014-03-01",0.979422958870473],["2014-04-01",0.980888070390833],["2014-05-01",0.982328626969511],["2014-06-01",0.983957438101084],["2014-07-01",0.985643544096583],["2014-08-01",0.987452424800491],["2014-09-01",0.989367710251688],["2014-10-01",0.991135666052793],["2014-11-01",0.992846326989973],["2014-12-01",0.99438510333538],["2015-01-01",0.995743810108451],["2015-02-01",0.997110701862083],["2015-03-01",0.998526703499079],["2015-04-01",1]]}],"dataLabels":{"enabled":false},"stroke":{"curve":"straight","dashArray":[8,5]},"xaxis":{"type":"datetime"},"yaxis":{"decimalsInFloat":2}},"auto_update":true},"evals":[],"jsHooks":[]}</script>
 </div>
  </div>

--- a/docs/articles/lines_files/apexcharter-binding-0.0.4.930/apexcharter.js
+++ b/docs/articles/lines_files/apexcharter-binding-0.0.4.930/apexcharter.js
@ -0,0 +1,93 @@
+HTMLWidgets.widget({
+
+  name: 'apexcharter',
+
+  type: 'output',
+
+  factory: function(el, width, height) {
+
+    var ax_opts;
+    var apexchart = null;
+
+    return {
+
+      renderValue: function(x) {
+
+
+        // Global options
+        ax_opts = x.ax_opts;
+
+        // Sizing
+        if (typeof ax_opts.chart === 'undefined') {
+          ax_opts.chart = {};
+        }
+        ax_opts.chart.width = width;
+        ax_opts.chart.height = height;
+
+        // Generate or update chart
+        if (apexchart === null) {
+          apexchart = new ApexCharts(document.querySelector("#" + el.id), ax_opts);
+          apexchart.render();
+        } else {
+          if (x.auto_update) {
+            apexchart.updateSeries(ax_opts.series);
+          } else {
+            apexchart.destroy();
+            apexchart = new ApexCharts(document.querySelector("#" + el.id), ax_opts);
+            apexchart.render();
+          }
+        }
+        
+
+      },
+      
+      getChart: function(){
+        return apexchart;
+      },
+
+      resize: function(width, height) {
+        apexchart.updateOptions({
+          chart: {
+            width: width,
+            height: height
+          }
+        });
+      }
+
+    };
+  }
+});
+
+// From Friss tuto (https://github.com/FrissAnalytics/shinyJsTutorials/blob/master/tutorials/tutorial_03.Rmd)
+function get_widget(id){
+  
+  // Get the HTMLWidgets object
+  var htmlWidgetsObj = HTMLWidgets.find("#" + id);
+  
+  // Use the getChart method we created to get the underlying billboard chart
+  var widgetObj ;
+  
+  if (typeof htmlWidgetsObj != 'undefined') {
+    widgetObj = htmlWidgetsObj.getChart();
+  }
+
+  return(widgetObj);
+}
+
+
+
+if (HTMLWidgets.shinyMode) {
+  // data = load
+  Shiny.addCustomMessageHandler('update-apexchart-series',
+    function(obj) {
+      var chart = get_widget(obj.id);
+      if (typeof chart != 'undefined') {
+        chart.updateSeries(obj.data.newSeries, obj.data.animate);
+      }
+  });
+}
+
+
+
+
+
--- a/docs/articles/lines_files/apexcharts-3.7.0/apexcharts.min.js
+++ b/docs/articles/lines_files/apexcharts-3.7.0/apexcharts.min.js
--- a/docs/articles/starting-with-apexcharts.html
+++ b/docs/articles/starting-with-apexcharts.html
--- a/docs/articles/starting-with-apexcharts_files/apexcharter-binding-0.0.4.930/apexcharter.js
+++ b/docs/articles/starting-with-apexcharts_files/apexcharter-binding-0.0.4.930/apexcharter.js
@ -0,0 +1,93 @@
+HTMLWidgets.widget({
+
+  name: 'apexcharter',
+
+  type: 'output',
+
+  factory: function(el, width, height) {
+
+    var ax_opts;
+    var apexchart = null;
+
+    return {
+
+      renderValue: function(x) {
+
+
+        // Global options
+        ax_opts = x.ax_opts;
+
+        // Sizing
+        if (typeof ax_opts.chart === 'undefined') {
+          ax_opts.chart = {};
+        }
+        ax_opts.chart.width = width;
+        ax_opts.chart.height = height;
+
+        // Generate or update chart
+        if (apexchart === null) {
+          apexchart = new ApexCharts(document.querySelector("#" + el.id), ax_opts);
+          apexchart.render();
+        } else {
+          if (x.auto_update) {
+            apexchart.updateSeries(ax_opts.series);
+          } else {
+            apexchart.destroy();
+            apexchart = new ApexCharts(document.querySelector("#" + el.id), ax_opts);
+            apexchart.render();
+          }
+        }
+        
+
+      },
+      
+      getChart: function(){
+        return apexchart;
+      },
+
+      resize: function(width, height) {
+        apexchart.updateOptions({
+          chart: {
+            width: width,
+            height: height
+          }
+        });
+      }
+
+    };
+  }
+});
+
+// From Friss tuto (https://github.com/FrissAnalytics/shinyJsTutorials/blob/master/tutorials/tutorial_03.Rmd)
+function get_widget(id){
+  
+  // Get the HTMLWidgets object
+  var htmlWidgetsObj = HTMLWidgets.find("#" + id);
+  
+  // Use the getChart method we created to get the underlying billboard chart
+  var widgetObj ;
+  
+  if (typeof htmlWidgetsObj != 'undefined') {
+    widgetObj = htmlWidgetsObj.getChart();
+  }
+
+  return(widgetObj);
+}
+
+
+
+if (HTMLWidgets.shinyMode) {
+  // data = load
+  Shiny.addCustomMessageHandler('update-apexchart-series',
+    function(obj) {
+      var chart = get_widget(obj.id);
+      if (typeof chart != 'undefined') {
+        chart.updateSeries(obj.data.newSeries, obj.data.animate);
+      }
+  });
+}
+
+
+
+
+
--- a/docs/articles/starting-with-apexcharts_files/apexcharts-3.7.0/apexcharts.min.js
+++ b/docs/articles/starting-with-apexcharts_files/apexcharts-3.7.0/apexcharts.min.js
--- a/docs/authors.html
+++ b/docs/authors.html
@ -60,7 +60,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/index.html
+++ b/docs/index.html
@ -30,7 +30,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/news/index.html
+++ b/docs/news/index.html
@ -60,7 +60,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/pkgdown.yml
+++ b/docs/pkgdown.yml
@ -1,4 +1,4 @@
-pandoc: '2.6'
+pandoc: 2.7.2
 pkgdown: 1.3.0
 pkgdown_sha: ~
 articles:
--- a/docs/reference/apex.html
+++ b/docs/reference/apex.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/apexchart.html
+++ b/docs/reference/apexchart.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/apexchartProxy.html
+++ b/docs/reference/apexchartProxy.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/apexcharter-exports.html
+++ b/docs/reference/apexcharter-exports.html
@ -65,7 +65,7 @@ as Depends of apexcharter" />
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/apexcharter-package.html
+++ b/docs/reference/apexcharter-package.html
@ -66,7 +66,7 @@ to create interactive and modern SVG charts." />
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/apexcharter-shiny.html
+++ b/docs/reference/apexcharter-shiny.html
@ -64,7 +64,7 @@ applications and interactive Rmd documents." />
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax-series.html
+++ b/docs/reference/ax-series.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_annotations.html
+++ b/docs/reference/ax_annotations.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_chart.html
+++ b/docs/reference/ax_chart.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_colors.html
+++ b/docs/reference/ax_colors.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_dataLabels.html
+++ b/docs/reference/ax_dataLabels.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_fill.html
+++ b/docs/reference/ax_fill.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_grid.html
+++ b/docs/reference/ax_grid.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_labels.html
+++ b/docs/reference/ax_labels.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_labs.html
+++ b/docs/reference/ax_labs.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_legend.html
+++ b/docs/reference/ax_legend.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_markers.html
+++ b/docs/reference/ax_markers.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_plotOptions.html
+++ b/docs/reference/ax_plotOptions.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_proxy_series.html
+++ b/docs/reference/ax_proxy_series.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_responsive.html
+++ b/docs/reference/ax_responsive.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_states.html
+++ b/docs/reference/ax_states.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_stroke.html
+++ b/docs/reference/ax_stroke.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_subtitle.html
+++ b/docs/reference/ax_subtitle.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_theme.html
+++ b/docs/reference/ax_theme.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_title.html
+++ b/docs/reference/ax_title.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_tooltip.html
+++ b/docs/reference/ax_tooltip.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_xaxis.html
+++ b/docs/reference/ax_xaxis.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/ax_yaxis.html
+++ b/docs/reference/ax_yaxis.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/bar_opts.html
+++ b/docs/reference/bar_opts.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/events_opts.html
+++ b/docs/reference/events_opts.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/heatmap_opts.html
+++ b/docs/reference/heatmap_opts.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/index.html
+++ b/docs/reference/index.html
@ -60,7 +60,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/parse_df.html
+++ b/docs/reference/parse_df.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/pie_opts.html
+++ b/docs/reference/pie_opts.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/radialBar_opts.html
+++ b/docs/reference/radialBar_opts.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/docs/reference/unhcr_popstats_2017.html
+++ b/docs/reference/unhcr_popstats_2017.html
@ -63,7 +63,7 @@
      </button>
      <span class="navbar-brand">
        <a class="navbar-link" href="../index.html">apexcharter</a>
-        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.920</span>
+        <span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="Released version">0.0.4.930</span>
      </span>
    </div>

--- a/inst/htmlwidgets/apexcharter.yaml
+++ b/inst/htmlwidgets/apexcharter.yaml
@ -1,5 +1,5 @@
 dependencies:
  - name: apexcharts
-    version: 3.6.12
-    src: htmlwidgets/lib/apexcharts-3.6
+    version: 3.7.0
+    src: htmlwidgets/lib/apexcharts-3.7
    script: apexcharts.min.js
--- a/inst/htmlwidgets/lib/apexcharts-3.5/apexcharts.css
+++ b/inst/htmlwidgets/lib/apexcharts-3.5/apexcharts.css
@ -1,483 +0,0 @@
-.apexcharts-canvas {
-  position: relative;
-  user-select: none;
-  /* cannot give overflow: hidden as it will crop tooltips which overflow outside chart area */
-}
-
-/* scrollbar is not visible by default for legend, hence forcing the visibility */
-.apexcharts-canvas ::-webkit-scrollbar {
-  -webkit-appearance: none;
-  width: 6px;
-}
-.apexcharts-canvas ::-webkit-scrollbar-thumb {
-  border-radius: 4px;
-  background-color: rgba(0,0,0,.5);
-  box-shadow: 0 0 1px rgba(255,255,255,.5);
-  -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
-}
-
-.apexcharts-inner {
-  position: relative;
-}
-
-.legend-mouseover-inactive {
-  transition: 0.15s ease all;
-  opacity: 0.20;
-}
-
-.apexcharts-series-collapsed {
-  opacity: 0;
-}
-
-.apexcharts-gridline, .apexcharts-text {
-  pointer-events: none;
-}
-
-.apexcharts-tooltip {
-  border-radius: 5px;
-  box-shadow: 2px 2px 6px -4px #999;
-  cursor: default;
-  font-size: 14px;
-  left: 62px;
-  opacity: 0;
-  pointer-events: none;
-  position: absolute;
-  top: 20px;
-  overflow: hidden;
-  white-space: nowrap;
-  z-index: 12;
-  transition: 0.15s ease all;
-}
-.apexcharts-tooltip.light {
-  border: 1px solid #e3e3e3;
-  background: rgba(255, 255, 255, 0.96);
-}
-.apexcharts-tooltip.dark {
-  color: #fff;
-  background: rgba(30,30,30, 0.8);
-}
-.apexcharts-tooltip * {
-  font-family: inherit;
-}
-
-.apexcharts-tooltip .apexcharts-marker,
-.apexcharts-area-series .apexcharts-area,
-.apexcharts-line {
-  pointer-events: none;
-}
-
-.apexcharts-tooltip.active {
-  opacity: 1;
-  transition: 0.15s ease all;
-}
-
-.apexcharts-tooltip-title {
-  padding: 6px;
-  font-size: 15px;
-  margin-bottom: 4px;
-}
-.apexcharts-tooltip.light .apexcharts-tooltip-title {
-  background: #ECEFF1;
-  border-bottom: 1px solid #ddd;
-}
-.apexcharts-tooltip.dark .apexcharts-tooltip-title {
-  background: rgba(0, 0, 0, 0.7);
-  border-bottom: 1px solid #222;
-}
-
-.apexcharts-tooltip-text-value,
-.apexcharts-tooltip-text-z-value {
-  display: inline-block;
-  font-weight: 600;
-  margin-left: 5px;
-}
-
-.apexcharts-tooltip-text-z-label:empty,
-.apexcharts-tooltip-text-z-value:empty {
-  display: none;
-}
-
-.apexcharts-tooltip-text-value, 
-.apexcharts-tooltip-text-z-value {
-  font-weight: 600;
-}
-
-.apexcharts-tooltip-marker {
-  width: 12px;
-  height: 12px;
-  position: relative;
-  top: 0px;
-  margin-right: 10px;
-  border-radius: 50%;
-}
-
-.apexcharts-tooltip-series-group {
-  padding: 0 10px;
-  display: none;
-  text-align: left;
-  justify-content: left;
-  align-items: center;
-}
-
-.apexcharts-tooltip-series-group.active .apexcharts-tooltip-marker {
-  opacity: 1;
-}
-.apexcharts-tooltip-series-group.active, .apexcharts-tooltip-series-group:last-child {
-  padding-bottom: 4px;
-}
-.apexcharts-tooltip-y-group {
-  padding: 6px 0 5px;
-}
-.apexcharts-tooltip-candlestick {
-  padding: 4px 8px;
-}
-.apexcharts-tooltip-candlestick > div {
-  margin: 4px 0;
-}
-.apexcharts-tooltip-candlestick span.value {
-  font-weight: bold;
-}
-
-.apexcharts-xaxistooltip {
-  opacity: 0;
-  padding: 9px 10px;
-  pointer-events: none;
-  color: #373d3f;
-  font-size: 13px;
-  text-align: center;
-  border-radius: 2px;
-  position: absolute;
-  z-index: 10;
-	background: #ECEFF1;
-  border: 1px solid #90A4AE;
-  transition: 0.15s ease all;
-}
-
-.apexcharts-xaxistooltip:after, .apexcharts-xaxistooltip:before {
-	left: 50%;
-	border: solid transparent;
-	content: " ";
-	height: 0;
-	width: 0;
-	position: absolute;
-	pointer-events: none;
-}
-
-.apexcharts-xaxistooltip:after {
-	border-color: rgba(236, 239, 241, 0);
-	border-width: 6px;
-	margin-left: -6px;
-}
-.apexcharts-xaxistooltip:before {
-	border-color: rgba(144, 164, 174, 0);
-	border-width: 7px;
-	margin-left: -7px;
-}
-
-.apexcharts-xaxistooltip-bottom:after, .apexcharts-xaxistooltip-bottom:before {
-  bottom: 100%;
-}
-
-.apexcharts-xaxistooltip-bottom:after {
-  border-bottom-color: #ECEFF1;
-}
-.apexcharts-xaxistooltip-bottom:before {
-  border-bottom-color: #90A4AE;
-}
-
-.apexcharts-xaxistooltip-top:after, .apexcharts-xaxistooltip-top:before {
-  top: 100%;
-}
-.apexcharts-xaxistooltip-top:after {
-  border-top-color: #ECEFF1;
-}
-.apexcharts-xaxistooltip-top:before {
-  border-top-color: #90A4AE;
-}
-
-.apexcharts-xaxistooltip.active {
-  opacity: 1;
-  transition: 0.15s ease all;
-}
-
-.apexcharts-yaxistooltip {
-  opacity: 0;
-  padding: 4px 10px;
-  pointer-events: none;
-  color: #373d3f;
-  font-size: 13px;
-  text-align: center;
-  border-radius: 2px;
-  position: absolute;
-  z-index: 10;
-	background: #ECEFF1;
-  border: 1px solid #90A4AE;
-}
-
-.apexcharts-yaxistooltip:after, .apexcharts-yaxistooltip:before {
-	top: 50%;
-	border: solid transparent;
-	content: " ";
-	height: 0;
-	width: 0;
-	position: absolute;
-	pointer-events: none;
-}
-.apexcharts-yaxistooltip:after {
-	border-color: rgba(236, 239, 241, 0);
-	border-width: 6px;
-	margin-top: -6px;
-}
-.apexcharts-yaxistooltip:before {
-	border-color: rgba(144, 164, 174, 0);
-	border-width: 7px;
-	margin-top: -7px;
-}
-
-.apexcharts-yaxistooltip-left:after, .apexcharts-yaxistooltip-left:before {
-  left: 100%;
-}
-.apexcharts-yaxistooltip-left:after {
-  border-left-color: #ECEFF1;
-}
-.apexcharts-yaxistooltip-left:before {
-  border-left-color: #90A4AE;
-}
-
-.apexcharts-yaxistooltip-right:after, .apexcharts-yaxistooltip-right:before {
-  right: 100%;
-}
-.apexcharts-yaxistooltip-right:after {
-  border-right-color: #ECEFF1;
-}
-.apexcharts-yaxistooltip-right:before {
-  border-right-color: #90A4AE;
-}
-
-.apexcharts-yaxistooltip.active {
-  opacity: 1;
-}
-
-.apexcharts-xcrosshairs, .apexcharts-ycrosshairs {
-  pointer-events: none;
-  opacity: 0;
-  transition: 0.15s ease all;
-}
-
-.apexcharts-xcrosshairs.active, .apexcharts-ycrosshairs.active {
-  opacity: 1;
-  transition: 0.15s ease all;
-}
-
-.apexcharts-ycrosshairs-hidden {
-  opacity: 0;
-}
-
-.apexcharts-zoom-rect {
-  pointer-events: none;
-}
-.apexcharts-selection-rect {
-  cursor: move;
-}
-
-.svg_select_points, .svg_select_points_rot {
-  opacity: 0;
-  visibility: hidden;
-}
-.svg_select_points_l, .svg_select_points_r {
-  cursor: ew-resize;
-  opacity: 1;
-  visibility: visible;
-  fill: #888;
-}
-.apexcharts-canvas.zoomable .hovering-zoom {
-  cursor: crosshair
-}
-.apexcharts-canvas.zoomable .hovering-pan {
-  cursor: move
-}
-
-.apexcharts-xaxis,
-.apexcharts-yaxis {
-  pointer-events: none;
-}
-
-.apexcharts-zoom-icon, 
-.apexcharts-zoom-in-icon,
-.apexcharts-zoom-out-icon,
-.apexcharts-reset-zoom-icon, 
-.apexcharts-pan-icon, 
-.apexcharts-selection-icon,
-.apexcharts-menu-icon, 
-.apexcharts-toolbar-custom-icon {
-  cursor: pointer;
-  width: 20px;
-  height: 20px;
-  line-height: 24px;
-  color: #6E8192;
-  text-align: center;
-}
-
-.apexcharts-zoom-icon svg, 
-.apexcharts-zoom-in-icon svg,
-.apexcharts-zoom-out-icon svg,
-.apexcharts-reset-zoom-icon svg,
-.apexcharts-menu-icon svg {
-  fill: #6E8192;
-}
-.apexcharts-selection-icon svg {
-  fill: #444;
-  transform: scale(0.76)
-}
-.apexcharts-zoom-icon.selected svg, 
-.apexcharts-selection-icon.selected svg, 
-.apexcharts-reset-zoom-icon.selected svg {
-  fill: #008FFB;
-}
-.apexcharts-selection-icon:not(.selected):hover svg,
-.apexcharts-zoom-icon:not(.selected):hover svg, 
-.apexcharts-zoom-in-icon:hover svg, 
-.apexcharts-zoom-out-icon:hover svg, 
-.apexcharts-reset-zoom-icon:hover svg, 
-.apexcharts-menu-icon:hover svg {
-  fill: #333;
-}
-
-.apexcharts-selection-icon, .apexcharts-menu-icon {
-  position: relative;
-}
-.apexcharts-reset-zoom-icon {
-  margin-left: 5px;
-}
-.apexcharts-zoom-icon, .apexcharts-reset-zoom-icon, .apexcharts-menu-icon {
-  transform: scale(0.85);
-}
-
-.apexcharts-zoom-in-icon, .apexcharts-zoom-out-icon {
-  transform: scale(0.7)
-}
-
-.apexcharts-zoom-out-icon {
-  margin-right: 3px;
-}
-
-.apexcharts-pan-icon {
-  transform: scale(0.62);
-  position: relative;
-  left: 1px;
-  top: 0px;
-}
-.apexcharts-pan-icon svg {
-  fill: #fff;
-  stroke: #6E8192;
-  stroke-width: 2;
-}
-.apexcharts-pan-icon.selected svg {
-  stroke: #008FFB;
-}
-.apexcharts-pan-icon:not(.selected):hover svg {
-  stroke: #333;
-}
-
-.apexcharts-toolbar {
-  position: absolute;
-  z-index: 11;
-  top: 0px;
-  right: 3px;
-  max-width: 176px;
-  text-align: right;
-  border-radius: 3px;
-  padding: 0px 6px 2px 6px;
-  display: flex;
-  justify-content: space-between;
-  align-items: center; 
-}
-
-.apexcharts-toolbar svg {
-  pointer-events: none;
-}
-
-.apexcharts-menu {
-  background: #fff;
-  position: absolute;
-  top: 100%;
-  border: 1px solid #ddd;
-  border-radius: 3px;
-  padding: 3px;
-  right: 10px;
-  opacity: 0;
-  min-width: 110px;
-  transition: 0.15s ease all;
-  pointer-events: none;
-}
-
-.apexcharts-menu.open {
-  opacity: 1;
-  pointer-events: all;
-  transition: 0.15s ease all;
-}
-
-.apexcharts-menu-item {
-  padding: 6px 7px;
-  font-size: 12px;
-  cursor: pointer;
-}
-.apexcharts-menu-item:hover {
-  background: #eee;
-}
-
-@media screen and (min-width: 768px) {
-  .apexcharts-toolbar {
-    /*opacity: 0;*/
-  }
-
-  .apexcharts-canvas:hover .apexcharts-toolbar {
-    opacity: 1;
-  } 
-}
-
-.apexcharts-datalabel.hidden {
-  opacity: 0;
-}
-
-.apexcharts-pie-label,
-.apexcharts-datalabel, .apexcharts-datalabel-label, .apexcharts-datalabel-value {
-  cursor: default;
-  pointer-events: none;
-}
-
-.apexcharts-pie-label-delay {
-  opacity: 0;
-  animation-name: opaque;
-  animation-duration: 0.3s;
-  animation-fill-mode: forwards;
-  animation-timing-function: ease;
-}
-
-.apexcharts-canvas .hidden {
-  opacity: 0;
-}
-
-.apexcharts-hide .apexcharts-series-points {
-  opacity: 0;
-}
-
-.apexcharts-area-series .apexcharts-series-markers .apexcharts-marker.no-pointer-events,
-.apexcharts-line-series .apexcharts-series-markers .apexcharts-marker.no-pointer-events, .apexcharts-radar-series path, .apexcharts-radar-series polygon {
-  pointer-events: none;
-}
-
-/* markers */
-
-.apexcharts-marker {
-  transition: 0.15s ease all;
-}
-
-@keyframes opaque {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
--- a/inst/htmlwidgets/lib/apexcharts-3.5/apexcharts.min.js
+++ b/inst/htmlwidgets/lib/apexcharts-3.5/apexcharts.min.js
--- a/inst/htmlwidgets/lib/apexcharts-3.7/apexcharts.min.js
+++ b/inst/htmlwidgets/lib/apexcharts-3.7/apexcharts.min.js
--- a/vignettes/starting-with-apexcharts.Rmd
+++ b/vignettes/starting-with-apexcharts.Rmd
@ -93,7 +93,8 @@ Create area charts with `type = "area"`:
 ```{r area}
 apex(data = economics_long, type = "area", mapping = aes(x = date, y = value01, fill = variable)) %>% 
  ax_yaxis(decimalsInFloat = 2) %>% # number of decimals to keep
-  ax_chart(stacked = TRUE)
+  ax_chart(stacked = TRUE) %>%
+  ax_yaxis(max = 4)
 ```