Float/FloatBackOfffice
1
0
Fork 0
Code Issues Pull Requests Releases Activity

first commit

Browse Source
This commit is contained in:
dev-chiefworks
2022-05-31 16:21:53 -04:00
commit f76abffdcd
5978 changed files with 1078901 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/global/js/demo_pages/charts/dimple/pies/pie_basic.js
+108
View File
@@ -0,0 +1,108 @@
/* ------------------------------------------------------------------------------
*
* # Dimple.js - basic pie
*
* Demo of pie chart. Data stored in .tsv file format
*
* ---------------------------------------------------------------------------- */
// Setup module
// ------------------------------
var DimplePieBasic = function() {
//
// Setup module components
//
// Chart
var _pieBasic = function() {
if (typeof dimple == 'undefined') {
console.warn('Warning - dimple.min.js is not loaded.');
return;
}
// Main variables
var element = document.getElementById('dimple-pie-basic');
// Initialize chart only if element exsists in the DOM
if(element) {
// Construct chart
var svg = dimple.newSvg(element, 420, 300);
// Chart setup
// ------------------------------
d3.tsv("../../../../global_assets/demo_data/dimple/demo_data.tsv", function (data) {
// Create chart
// ------------------------------
// Define chart
var myChart = new dimple.chart(svg, data);
// Set bounds
myChart.setBounds(0, 0, "100%", "100%")
// Set margins
myChart.setMargins(5, 5, 5, 5);
// Add axes
// ------------------------------
var p = myChart.addMeasureAxis("p", "Unit Sales");
// Construct layout
// ------------------------------
// Add pie
myChart.addSeries("Owner", dimple.plot.pie);
// Add styles
// ------------------------------
// Font size
p.fontSize = "12";
// Font family
p.fontFamily = "Roboto";
//
// Draw chart
//
// Draw
myChart.draw();
});
}
};
//
// Return objects assigned to module
//
return {
init: function() {
_pieBasic();
}
}
}();
// Initialize module
// ------------------------------
document.addEventListener('DOMContentLoaded', function() {
DimplePieBasic.init();
});
assets/global/js/demo_pages/charts/dimple/pies/pie_bubble.js
+152
View File
@@ -0,0 +1,152 @@
/* ------------------------------------------------------------------------------
*
* # Dimple.js - bubbles with pie
*
* Demo of bubble chart with pies. Data stored in .tsv file format
*
* ---------------------------------------------------------------------------- */
// Setup module
// ------------------------------
var DimplePieBubble = function() {
//
// Setup module components
//
// Chart
var _pieBubble = function() {
if (typeof dimple == 'undefined') {
console.warn('Warning - dimple.min.js is not loaded.');
return;
}
// Main variables
var element = document.getElementById('dimple-pie-bubble');
// Initialize chart only if element exsists in the DOM
if(element) {
// Construct chart
var svg = dimple.newSvg(element, "100%", 500);
// Chart setup
// ------------------------------
d3.tsv("../../../../global_assets/demo_data/dimple/demo_data.tsv", function (data) {
// Filter data
data = dimple.filterData(data, "Date", "01/12/2011");
// Create chart
// ------------------------------
// Define chart
var myChart = new dimple.chart(svg, data);
// Set bounds
myChart.setBounds(0, 0, "100%", "100%");
// Set margins
myChart.setMargins(55, 35, 20, 45);
// Add axes
// ------------------------------
// Horizontal
var x = myChart.addMeasureAxis("x", "Price Monthly Change");
// Vertical
var y = myChart.addMeasureAxis("y", "Unit Sales Monthly Change");
// Other axes
myChart.addMeasureAxis("p", "Operating Profit");
myChart.addMeasureAxis("z", "Operating Profit");
// Construct layout
// ------------------------------
// Add pie
myChart.addSeries(["Owner", "Channel"], dimple.plot.pie);
// Add legend
// ------------------------------
var myLegend = myChart.addLegend(0, 5, "100%", 0, "right");
// Add styles
// ------------------------------
// Font size
x.fontSize = "12";
y.fontSize = "12";
// Font family
x.fontFamily = "Roboto";
y.fontFamily = "Roboto";
// Legend font style
myLegend.fontSize = "12";
myLegend.fontFamily = "Roboto";
//
// Draw chart
//
// Draw
myChart.draw();
// Position legend text
myLegend.shapes.selectAll("text").attr("dy", "1");
// Resize chart
// ------------------------------
// Add a method to draw the chart on resize of the window
$(window).on('resize', resize);
$('.sidebar-control').on('click', resize);
// Resize function
function resize() {
// Redraw chart
myChart.draw(0, true);
// Position legend text
myLegend.shapes.selectAll("text").attr("dy", "1");
}
});
}
};
//
// Return objects assigned to module
//
return {
init: function() {
_pieBubble();
}
}
}();
// Initialize module
// ------------------------------
document.addEventListener('DOMContentLoaded', function() {
DimplePieBubble.init();
});
assets/global/js/demo_pages/charts/dimple/pies/pie_legend.js
+114
View File
@@ -0,0 +1,114 @@
/* ------------------------------------------------------------------------------
*
* # Dimple.js - pie with legend
*
* Demo of pie chart with legend. Data stored in .tsv file format
*
* ---------------------------------------------------------------------------- */
// Setup module
// ------------------------------
var DimplePieLegend = function() {
//
// Setup module components
//
// Chart
var _pieLegend = function() {
if (typeof dimple == 'undefined') {
console.warn('Warning - dimple.min.js is not loaded.');
return;
}
// Main variables
var element = document.getElementById('dimple-pie-legend');
// Initialize chart only if element exsists in the DOM
if(element) {
// Construct chart
var svg = dimple.newSvg(element, 420, 300);
// Chart setup
// ------------------------------
d3.tsv("../../../../global_assets/demo_data/dimple/demo_data.tsv", function (data) {
// Create chart
// ------------------------------
// Define chart
var myChart = new dimple.chart(svg, data);
// Set bounds
myChart.setBounds(0, 0, "100%", "100%")
// Set margins
myChart.setMargins(5, 5, 100, 5);
// Add axes
// ------------------------------
myChart.addMeasureAxis("p", "Unit Sales");
// Construct layout
// ------------------------------
// Add pie
myChart.addSeries("Owner", dimple.plot.pie);
// Add legend
// ------------------------------
var myLegend = myChart.addLegend("100%", 0, 0, "100%", "right");
// Add styles
// ------------------------------
// Font size
myLegend.fontSize = "12";
// Font family
myLegend.fontFamily = "Roboto";
//
// Draw chart
//
// Draw
myChart.draw();
});
}
};
//
// Return objects assigned to module
//
return {
init: function() {
_pieLegend();
}
}
}();
// Initialize module
// ------------------------------
document.addEventListener('DOMContentLoaded', function() {
DimplePieLegend.init();
});
assets/global/js/demo_pages/charts/dimple/pies/pie_lollipop.js
+158
View File
@@ -0,0 +1,158 @@
/* ------------------------------------------------------------------------------
*
* # Dimple.js - lollipops
*
* Demo of lollipop chart. Data stored in .tsv file format
*
* ---------------------------------------------------------------------------- */
// Setup module
// ------------------------------
var DimplePieLollipop = function() {
//
// Setup module components
//
// Chart
var _pieLollipop = function() {
if (typeof dimple == 'undefined') {
console.warn('Warning - dimple.min.js is not loaded.');
return;
}
// Main variables
var element = document.getElementById('dimple-pie-lollipop');
// Initialize chart only if element exsists in the DOM
if(element) {
// Construct chart
var svg = dimple.newSvg(element, "100%", 500);
// Chart setup
// ------------------------------
d3.tsv("../../../../global_assets/demo_data/dimple/demo_data.tsv", function (data) {
// Filter data
data = dimple.filterData(data, "Date", [
"01/07/2011", "01/08/2011", "01/09/2011",
"01/10/2011", "01/11/2011", "01/12/2011"
]);
// Create chart
// ------------------------------
// Define chart
var myChart = new dimple.chart(svg, data);
// Set bounds
myChart.setBounds(0, 0, "100%", "100%");
// Set margins
myChart.setMargins(55, 25, 10, 30);
// Add axes
// ------------------------------
// Horizontal
var x = myChart.addCategoryAxis("x", "Month");
x.addOrderRule("Date");
// Vertical
var y = myChart.addMeasureAxis("y", "Unit Sales");
// Other axes
myChart.addMeasureAxis("p", "Unit Sales");
// Construct layout
// ------------------------------
// Add pie
var pies = myChart.addSeries("Channel", dimple.plot.pie);
// Radius
pies.radius = 30;
// Add legend
// ------------------------------
var myLegend = myChart.addLegend(0, 5, "100%", 0, "right");
// Add styles
// ------------------------------
// Font size
x.fontSize = "12";
y.fontSize = "12";
// Font family
x.fontFamily = "Roboto";
y.fontFamily = "Roboto";
// Legend font style
myLegend.fontSize = "12";
myLegend.fontFamily = "Roboto";
//
// Draw chart
//
// Draw
myChart.draw();
// Remove axis titles
x.titleShape.remove();
// Resize chart
// ------------------------------
// Add a method to draw the chart on resize of the window
$(window).on('resize', resize);
$('.sidebar-control').on('click', resize);
// Resize function
function resize() {
// Redraw chart
myChart.draw(0, true);
// Remove axis titles
x.titleShape.remove();
}
});
}
};
//
// Return objects assigned to module
//
return {
init: function() {
_pieLollipop();
}
}
}();
// Initialize module
// ------------------------------
document.addEventListener('DOMContentLoaded', function() {
DimplePieLollipop.init();
});
assets/global/js/demo_pages/charts/dimple/pies/pie_matrix.js
+155
View File
@@ -0,0 +1,155 @@
/* ------------------------------------------------------------------------------
*
* # Dimple.js - pies matrix
*
* Demo of matrix of pies. Data stored in .tsv file format
*
* ---------------------------------------------------------------------------- */
// Setup module
// ------------------------------
var DimplePieMatrix = function() {
//
// Setup module components
//
// Chart
var _pieMatrix = function() {
if (typeof dimple == 'undefined') {
console.warn('Warning - dimple.min.js is not loaded.');
return;
}
// Main variables
var element = document.getElementById('dimple-pie-matrix');
// Initialize chart only if element exsists in the DOM
if(element) {
// Construct chart
var svg = dimple.newSvg(element, "100%", 500);
// Chart setup
// ------------------------------
d3.tsv("../../../../global_assets/demo_data/dimple/demo_data.tsv", function (data) {
// Create chart
// ------------------------------
// Define chart
var myChart = new dimple.chart(svg, data);
// Set bounds
myChart.setBounds(0, 0, "100%", "100%");
// Set margins
myChart.setMargins(45, 25, 10, 45);
// Add axes
// ------------------------------
// Horizontal
var x = myChart.addCategoryAxis("x", "Price Tier");
// Vertical
var y = myChart.addCategoryAxis("y", "Pack Size");
// Other axes
myChart.addMeasureAxis("p", "Unit Sales");
// Construct layout
// ------------------------------
// Add pie
var pies = myChart.addSeries("Channel", dimple.plot.pie);
// Radius
pies.radius = 30;
// Display grid lines
x.showGridlines = true;
y.showGridlines = true;
// Add legend
// ------------------------------
var myLegend = myChart.addLegend(0, 5, "100%", 0, "right");
// Add styles
// ------------------------------
// Font size
x.fontSize = "12";
y.fontSize = "12";
// Font family
x.fontFamily = "Roboto";
y.fontFamily = "Roboto";
// Legend font style
myLegend.fontSize = "12";
myLegend.fontFamily = "Roboto";
//
// Draw chart
//
// Draw
myChart.draw();
// Remove axis titles
x.titleShape.remove();
// Resize chart
// ------------------------------
// Add a method to draw the chart on resize of the window
$(window).on('resize', resize);
$('.sidebar-control').on('click', resize);
// Resize function
function resize() {
// Redraw chart
myChart.draw(0, true);
// Remove axis titles
x.titleShape.remove();
}
});
}
};
//
// Return objects assigned to module
//
return {
init: function() {
_pieMatrix();
}
}
}();
// Initialize module
// ------------------------------
document.addEventListener('DOMContentLoaded', function() {
DimplePieMatrix.init();
});
assets/global/js/demo_pages/charts/dimple/pies/pie_scatter.js
+148
View File
@@ -0,0 +1,148 @@
/* ------------------------------------------------------------------------------
*
* # Dimple.js - pies as scatter
*
* Demo of scatter chart with pies. Data stored in .tsv file format
*
* ---------------------------------------------------------------------------- */
// Setup module
// ------------------------------
var DimplePieScatter = function() {
//
// Setup module components
//
// Chart
var _pieScatter = function() {
if (typeof dimple == 'undefined') {
console.warn('Warning - dimple.min.js is not loaded.');
return;
}
// Main variables
var element = document.getElementById('dimple-pie-scatter');
// Initialize chart only if element exsists in the DOM
if(element) {
// Construct chart
var svg = dimple.newSvg(element, "100%", 500);
// Chart setup
// ------------------------------
d3.tsv("../../../../global_assets/demo_data/dimple/demo_data.tsv", function (data) {
// Filter data
data = dimple.filterData(data, "Date", "01/12/2011");
// Create chart
// ------------------------------
// Define chart
var myChart = new dimple.chart(svg, data);
// Set bounds
myChart.setBounds(0, 0, "100%", "100%");
// Set margins
myChart.setMargins(60, 35, 10, 45);
// Add axes
// ------------------------------
// Horizontal
var x = myChart.addMeasureAxis("x", "Price Monthly Change");
// Vertical
var y = myChart.addMeasureAxis("y", "Unit Sales Monthly Change");
// Other axes
myChart.addMeasureAxis("p", "Operating Profit");
// Construct layout
// ------------------------------
// Add pie
var pies = myChart.addSeries(["Owner", "Channel"], dimple.plot.pie);
// Radius
pies.radius = 40;
// Add legend
// ------------------------------
var myLegend = myChart.addLegend(0, 5, "100%", 0, "right");
// Add styles
// ------------------------------
// Font size
x.fontSize = "12";
y.fontSize = "12";
// Font family
x.fontFamily = "Roboto";
y.fontFamily = "Roboto";
// Legend font style
myLegend.fontSize = "12";
myLegend.fontFamily = "Roboto";
//
// Draw chart
//
// Draw
myChart.draw();
// Resize chart
// ------------------------------
// Add a method to draw the chart on resize of the window
$(window).on('resize', resize);
$('.sidebar-control').on('click', resize);
// Resize function
function resize() {
// Redraw chart
myChart.draw(0, true);
}
});
}
};
//
// Return objects assigned to module
//
return {
init: function() {
_pieScatter();
}
}
}();
// Initialize module
// ------------------------------
document.addEventListener('DOMContentLoaded', function() {
DimplePieScatter.init();
});