[demo] correct example
This commit is contained in:
parent
eb3cd64b1b
commit
8b61bcf888
12
dist/frappe-charts.esm.js
vendored
12
dist/frappe-charts.esm.js
vendored
@ -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,
|
||||
|
||||
2
dist/frappe-charts.min.iife.js.map
vendored
2
dist/frappe-charts.min.iife.js.map
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -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();
|
||||
});
|
||||
|
||||
9
docs/assets/js/index.min.js
vendored
9
docs/assets/js/index.min.js
vendored
@ -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();
|
||||
});
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -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,
|
||||
|
||||
@ -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];
|
||||
}
|
||||
|
||||
|
||||
@ -121,4 +121,4 @@ export function getShortenedLabels(chartWidth, labels=[], isSeries=true) {
|
||||
});
|
||||
|
||||
return calcLabels;
|
||||
}
|
||||
}
|
||||
|
||||
@ -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;
|
||||
|
||||
@ -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) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user