[demo] correct example

dist/frappe-charts.esm.js

@@ -282,6 +282,10 @@ class SvgTip {
 	}
 }
 
+/**
+ * Returns the value of a number upto 2 decimal places.
+ * @param {Number} d Any number
+ */
 function floatTwo(d) {
 	return parseFloat(d.toFixed(2));
 }
@@ -1724,14 +1728,13 @@ const NO_OF_DAYS_IN_WEEK = 7;
 const NO_OF_MILLIS = 1000;
 const SEC_IN_DAY = 86400;
 
-const MONTH_NAMES = ["January", "February", "March", "April", "May", "June",
-	"July", "August", "September", "October", "November", "December"];
-
-
+const MONTH_NAMES = ["January", "February", "March", "April", "May",
+	"June", "July", "August", "September", "October", "November", "December"];
 
 
 const DAY_NAMES_SHORT = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
 
+
 // https://stackoverflow.com/a/11252167/6495043
 function treatAsUtc(date) {
 	let result = new Date(date);
@@ -3635,6 +3638,7 @@ class AxisChart extends BaseChart {
 	// removeDataPoint(index = 0) {}
 }
 
+// import MultiAxisChart from './charts/MultiAxisChart';
 const chartTypes = {
 	bar: AxisChart,
 	line: AxisChart,

docs/assets/js/index.js

@@ -88,7 +88,7 @@ Array.prototype.slice.call(
 	});
 });
 
-document.querySelector('.export-aggr').addEventListener('click', (e) => {
+document.querySelector('.export-aggr').addEventListener('click', () => {
 	aggrChart.export();
 });
 
@@ -181,7 +181,7 @@ chartUpdateButtons.querySelector('[data-update="remove"]').addEventListener("cli
 	updateChart.removeDataPoint();
 });
 
-document.querySelector('.export-update').addEventListener('click', (e) => {
+document.querySelector('.export-update').addEventListener('click', () => {
 	updateChart.export();
 });
 
@@ -233,7 +233,7 @@ Array.prototype.slice.call(
 	});
 });
 
-document.querySelector('.export-trends').addEventListener('click', (e) => {
+document.querySelector('.export-trends').addEventListener('click', () => {
 	trendsChart.export();
 });
 
@@ -356,6 +356,6 @@ Array.prototype.slice.call(
 	});
 });
 
-document.querySelector('.export-heatmap').addEventListener('click', (e) => {
+document.querySelector('.export-heatmap').addEventListener('click', () => {
 	heatmapChart.export();
 });

docs/assets/js/index.min.js

@@ -118,7 +118,6 @@ var NO_OF_MILLIS = 1000;
 var SEC_IN_DAY = 86400;
 
 
-
 var MONTH_NAMES_SHORT = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
 
 
@@ -385,7 +384,7 @@ Array.prototype.slice.call(document.querySelectorAll('.aggr-type-buttons button'
 	});
 });
 
-document.querySelector('.export-aggr').addEventListener('click', function (e) {
+document.querySelector('.export-aggr').addEventListener('click', function () {
 	aggrChart.export();
 });
 
@@ -474,7 +473,7 @@ chartUpdateButtons.querySelector('[data-update="remove"]').addEventListener("cli
 	updateChart.removeDataPoint();
 });
 
-document.querySelector('.export-update').addEventListener('click', function (e) {
+document.querySelector('.export-update').addEventListener('click', function () {
 	updateChart.export();
 });
 
@@ -523,7 +522,7 @@ Array.prototype.slice.call(document.querySelectorAll('.chart-plot-buttons button
 	});
 });
 
-document.querySelector('.export-trends').addEventListener('click', function (e) {
+document.querySelector('.export-trends').addEventListener('click', function () {
 	trendsChart.export();
 });
 
@@ -634,7 +633,7 @@ Array.prototype.slice.call(document.querySelectorAll('.heatmap-color-buttons but
 	});
 });
 
-document.querySelector('.export-heatmap').addEventListener('click', function (e) {
+document.querySelector('.export-heatmap').addEventListener('click', function () {
 	heatmapChart.export();
 });
 

docs/index.html

@@ -56,15 +56,15 @@
 
       datasets: [
         {
-          label: "Some Data", type: 'bar',
+          label: "Some Data", chartType: 'bar',
           values: [25, 40, 30, 35, 8, 52, 17, -4]
         },
         {
-          label: "Another Set", type: 'bar',
+          label: "Another Set", chartType: 'bar',
           values: [25, 50, -10, 15, 18, 32, 27, 14]
         },
         {
-          label: "Yet Another", type: 'line',
+          label: "Yet Another", chartType: 'line',
           values: [15, 20, -3, -15, 58, 12, -17, 37]
         }
       ],
@@ -77,7 +77,10 @@
     type: 'axis-mixed', // or 'bar', 'line', 'pie', 'percentage'
     height: 250,
     colors: ['purple', '#ffa3ef', 'red']
-  });</code></pre>
+  });
+
+  chart.export();
+</code></pre>
               <!-- <div id="chart-types" class="border" style="margin-bottom: 15px"></div> -->
               <!-- <div >
                 <div class="btn-group x-axis-buttons margin-vertical-px" role="group">
@@ -100,7 +103,9 @@
                 <button type="button" class="btn btn-sm btn-secondary" data-type='pie'>Pie Chart</button>
                 <button type="button" class="btn btn-sm btn-secondary" data-type='percentage'>Percentage Chart</button>
               </div>
-              <button type="button" class="btn btn-sm btn-tertiary export-aggr">Export</button>
+              <div class="btn-group export-buttons margin-vertical-px mx-auto" role="group">
+                <button type="button" class="btn btn-sm btn-secondary export-aggr">Export ...</button>
+              </div>
               <!-- <p class="text-muted">
                 <a target="_blank" href="http://www.storytellingwithdata.com/blog/2011/07/death-to-pie-charts">Why Percentage?</a>
               </p> -->
@@ -117,7 +122,7 @@
                 <button type="button" class="btn btn-sm btn-secondary" data-update="random">Random Data</button>
                 <button type="button" class="btn btn-sm btn-secondary" data-update="add">Add Value</button>
                 <button type="button" class="btn btn-sm btn-secondary" data-update="remove">Remove Value</button>
-                <button type="button" class="btn btn-sm btn-tertiary export-update">Export</button>
+                <button type="button" class="btn btn-sm btn-secondary export-update">Export ...</button>
               </div>
             </div>
           </div>
@@ -134,7 +139,9 @@
                 <button type="button" class="btn btn-sm btn-secondary active" data-type="heatline">HeatLine</button>
                 <button type="button" class="btn btn-sm btn-secondary" data-type="regionFill">Region</button>
               </div>
-              <button type="button" class="btn btn-sm btn-tertiary export-trends">Export</button>
+              <div class="btn-group export-buttons mt-1 mx-auto" role="group">
+                <button type="button" class="btn btn-sm btn-secondary export-trends">Export ...</button>
+              </div>
               <!-- <pre><code class="hljs javascript margin-vertical-px">  ...
     lineOptions: 'line',   // Line Chart specific properties:
 
@@ -194,7 +201,9 @@
                 <button type="button" class="btn btn-sm btn-secondary active" data-color="blue">Blue</button>
                 <button type="button" class="btn btn-sm btn-secondary" data-color="halloween">GitHub's Halloween</button>
               </div>
-              <button type="button" class="btn btn-sm btn-tertiary export-heatmap">Export</button>
+              <div class="btn-group export-buttons mt-1 mx-auto" role="group">
+                <button type="button" class="btn btn-sm btn-secondary export-heatmap">Export ...</button>
+              </div>
               <pre><code class="hljs javascript margin-vertical-px">  let heatmap = new Chart("#heatmap", {
     type: 'heatmap',
     height: 115,

src/js/utils/animate.js

@@ -102,4 +102,3 @@ export function animatePath(paths, newXList, newYList, zeroLine) {
 export function animatePathStr(oldPath, pathStr) {
 	return [oldPath, {d: pathStr}, UNIT_ANIM_DUR, STD_EASING];
 }
-

src/js/utils/axis-chart-utils.js

@@ -121,4 +121,4 @@ export function getShortenedLabels(chartWidth, labels=[], isSeries=true) {
 	});
 
 	return calcLabels;
-}
+}

src/js/utils/constants.js

@@ -70,4 +70,4 @@ export const DEFAULT_COLORS = {
 
 // Universal constants
 export const ANGLE_RATIO = Math.PI / 180;
-export const FULL_ANGLE = 360;
+export const FULL_ANGLE = 360;

src/js/utils/date-utils.js

@@ -6,13 +6,14 @@ export const DAYS_IN_YEAR = 375;
 export const NO_OF_MILLIS = 1000;
 export const SEC_IN_DAY = 86400;
 
-export const MONTH_NAMES = ["January", "February", "March", "April", "May", "June",
-	"July", "August", "September", "October", "November", "December"];
+export const MONTH_NAMES = ["January", "February", "March", "April", "May",
+	"June", "July", "August", "September", "October", "November", "December"];
+export const MONTH_NAMES_SHORT = ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
+	"Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
 
-export const MONTH_NAMES_SHORT = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
-
-export const DAY_NAMES = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
 export const DAY_NAMES_SHORT = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+export const DAY_NAMES = ["Sunday", "Monday", "Tuesday", "Wednesday",
+	"Thursday", "Friday", "Saturday"];
 
 // https://stackoverflow.com/a/11252167/6495043
 function treatAsUtc(date) {