| Server IP : 144.76.124.212 / Your IP : 216.73.216.165 Web Server : LiteSpeed System : Linux l4cp.vnetindia.com 4.18.0-553.40.1.lve.el8.x86_64 #1 SMP Wed Feb 12 18:54:57 UTC 2025 x86_64 User : rakcha ( 1356) PHP Version : 7.4.33 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /home5/rakcha/public_html/app/assets/js/page/ |
Upload File : |
"use strict";
var sparkline_values = [10, 7, 4, 8, 5, 8, 6, 5, 2, 4, 7, 4, 9, 6, 5, 9];
var sparkline_values_chart = [2, 6, 4, 8, 3, 5, 2, 7];
var sparkline_values_bar = [
10, 7, 4, 8, 5, 8, 6, 5, 2, 4, 7, 4, 9, 10, 7, 4, 8, 5, 8, 6, 5, 2, 4, 7, 4,
9, 8, 6, 5, 2, 4, 7, 4, 9, 10, 2, 4, 7, 4, 9, 7, 4, 8, 5, 8, 6, 5,
];
$(".sparkline-inline").sparkline(sparkline_values, {
type: "line",
width: "100%",
height: "32",
lineWidth: 3,
lineColor: "rgba(87,75,144,.1)",
fillColor: "rgba(87,75,144,.25)",
highlightSpotColor: "rgba(87,75,144,.1)",
highlightLineColor: "rgba(87,75,144,.1)",
spotRadius: 3,
});
$(".sparkline-line").sparkline(sparkline_values, {
type: "line",
width: "100%",
height: "32",
lineWidth: 3,
lineColor: "rgba(63, 82, 227, .5)",
fillColor: "transparent",
highlightSpotColor: "rgba(63, 82, 227, .5)",
highlightLineColor: "rgba(63, 82, 227, .5)",
spotRadius: 3,
});
$(".sparkline-line-chart").sparkline(sparkline_values_chart, {
type: "line",
width: "100%",
height: "32",
lineWidth: 2,
lineColor: "rgba(63, 82, 227, .5)",
fillColor: "transparent",
highlightSpotColor: "rgba(63, 82, 227, .5)",
highlightLineColor: "rgba(63, 82, 227, .5)",
spotRadius: 2,
});
$(".sparkline-line-chart2").sparkline(sparkline_values_chart, {
type: "line",
width: "100%",
height: "100",
lineWidth: 3,
lineColor: "white",
fillColor: "transparent",
highlightSpotColor: "rgba(63,82,227,.1)",
highlightLineColor: "rgba(63,82,227,.1)",
spotRadius: 3,
});
$(".sparkline-bar").sparkline(sparkline_values_bar, {
type: "bar",
width: "100%",
height: "100",
barColor: "white",
barWidth: 2,
});
var ctx = document.getElementById("myChart").getContext("2d");
var myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Sunday",
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Saturday",
],
datasets: [
{
label: "Statistics",
data: [460, 458, 330, 502, 430, 610, 488],
borderWidth: 2,
backgroundColor: "rgba(145,141,197,.8)",
borderWidth: 0,
borderColor: "transparent",
pointBorderWidth: 0,
pointRadius: 3.5,
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "rgba(63,82,227,.8)",
},
{
label: "Statistics",
data: [390, 600, 390, 280, 600, 430, 638],
borderWidth: 2,
backgroundColor: "rgba(58,184,214,.7)",
borderWidth: 0,
borderColor: "transparent",
pointBorderWidth: 0,
pointRadius: 3.5,
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "rgba(254,86,83,.8)",
},
],
},
options: {
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
drawBorder: false,
color: "#f2f2f2",
},
ticks: {
beginAtZero: true,
stepSize: 200,
fontColor: "#9aa0ac", // Font Color
callback: function (value, index, values) {
return value;
},
},
},
],
xAxes: [
{
gridLines: {
display: false,
tickMarkLength: 15,
},
ticks: {
fontColor: "#9aa0ac", // Font Color
},
},
],
},
},
});
var ctx = document.getElementById("myChart2").getContext("2d");
var myChart = new Chart(ctx, {
type: "bar",
data: {
labels: [
"Sunday",
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Saturday",
],
datasets: [
{
label: "Statistics",
data: [428, 354, 425, 528, 450, 632, 429],
borderWidth: 2,
backgroundColor: "rgba(255,164,38,.9)",
borderColor: "rgba(255,164,38,.9)",
borderWidth: 2.5,
pointBackgroundColor: "#ffffff",
pointRadius: 4,
},
{
label: "Statistics",
data: [468, 387, 401, 574, 498, 568, 452],
borderWidth: 2,
backgroundColor: "rgba(71,65,98,.9)",
borderColor: "transparent",
borderWidth: 0,
pointBackgroundColor: "#999",
pointRadius: 4,
},
],
},
options: {
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
drawBorder: false,
color: "#f2f2f2",
},
ticks: {
beginAtZero: true,
stepSize: 150,
fontColor: "#9aa0ac", // Font Color
},
},
],
xAxes: [
{
gridLines: {
display: false,
},
ticks: {
fontColor: "#9aa0ac", // Font Color
},
},
],
},
},
});
var ctx = document.getElementById("myChart3").getContext("2d");
var myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Sunday",
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Saturday",
],
datasets: [
{
label: "Google",
data: [290, 358, 220, 402, 440, 510, 688],
borderWidth: 2,
backgroundColor: "transparent",
borderColor: "rgba(254,86,83,.7)",
borderWidth: 2.5,
pointBackgroundColor: "transparent",
pointBorderColor: "transparent",
pointRadius: 4,
},
{
label: "Facebook",
data: [450, 258, 390, 162, 650, 570, 438],
borderWidth: 2,
backgroundColor: "transparent",
borderColor: "rgba(63,82,227,.8)",
borderWidth: 0,
pointBackgroundColor: "transparent",
pointBorderColor: "transparent",
pointRadius: 4,
},
],
},
options: {
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
drawBorder: false,
color: "#f2f2f2",
},
ticks: {
beginAtZero: true,
stepSize: 200,
fontColor: "#9aa0ac", // Font Color
},
},
],
xAxes: [
{
gridLines: {
display: false,
},
ticks: {
fontColor: "#9aa0ac", // Font Color
},
},
],
},
},
});
$("#visitorMap4").vectorMap({
map: "world_en",
backgroundColor: "#ffffff",
borderColor: "#F5AE46",
borderOpacity: 0.8,
borderWidth: 1,
hoverColor: "#000",
hoverOpacity: 0.8,
color: "#ddd",
normalizeFunction: "linear",
selectedRegions: false,
showTooltip: true,
pins: {
id: '<div class="jqvmap-circle"></div>',
my: '<div class="jqvmap-circle"></div>',
th: '<div class="jqvmap-circle"></div>',
sy: '<div class="jqvmap-circle"></div>',
eg: '<div class="jqvmap-circle"></div>',
ae: '<div class="jqvmap-circle"></div>',
nz: '<div class="jqvmap-circle"></div>',
tl: '<div class="jqvmap-circle"></div>',
ng: '<div class="jqvmap-circle"></div>',
si: '<div class="jqvmap-circle"></div>',
pa: '<div class="jqvmap-circle"></div>',
au: '<div class="jqvmap-circle"></div>',
ca: '<div class="jqvmap-circle"></div>',
tr: '<div class="jqvmap-circle"></div>',
},
});
/* chart shadow */
var draw = Chart.controllers.line.prototype.draw;
Chart.controllers.lineShadow = Chart.controllers.line.extend({
draw: function () {
draw.apply(this, arguments);
var ctx = this.chart.chart.ctx;
var _stroke = ctx.stroke;
ctx.stroke = function () {
ctx.save();
ctx.shadowColor = "#00000075";
ctx.shadowBlur = 10;
ctx.shadowOffsetX = 8;
ctx.shadowOffsetY = 8;
_stroke.apply(this, arguments);
ctx.restore();
};
},
});
var balance_chart = document.getElementById("chart-1").getContext("2d");
var balance_chart_bg_color = balance_chart.createLinearGradient(0, 0, 0, 70);
balance_chart_bg_color.addColorStop(0, "rgba(120, 107, 236, .2)");
balance_chart_bg_color.addColorStop(1, "rgba(120, 107, 236, 0)");
var myChart = new Chart(balance_chart, {
type: "lineShadow",
data: {
labels: [
"1990",
"1991",
"1992",
"1993",
"1994",
"1995",
"1996",
"1997",
"1998",
"1999",
"2000",
"2001",
],
datasets: [
{
label: "Balance",
data: [50, 61, 80, 50, 72, 52, 60, 41, 30, 45, 70, 40],
backgroundColor: balance_chart_bg_color,
borderWidth: 3,
borderColor: "rgba(41, 192, 177, 1)",
pointBorderWidth: 0,
pointBorderColor: "transparent",
pointRadius: 3,
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "rgba(120, 107, 236,1)",
},
],
},
options: {
layout: {
padding: {
bottom: -1,
left: -1,
},
},
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
display: false,
drawBorder: false,
},
ticks: {
beginAtZero: true,
display: false,
fontColor: "#9aa0ac", // Font Color
},
},
],
xAxes: [
{
gridLines: {
drawBorder: false,
display: false,
},
ticks: {
display: false,
fontColor: "#9aa0ac", // Font Color
},
},
],
},
},
});
var sales_chart = document.getElementById("chart-2").getContext("2d");
var myChart = new Chart(sales_chart, {
type: "lineShadow",
data: {
labels: [
"1990",
"1991",
"1992",
"1993",
"1994",
"1995",
"1996",
"1997",
"1998",
"1999",
"2000",
"2001",
],
datasets: [
{
label: "Sales",
data: [70, 62, 44, 40, 21, 63, 82, 52, 50, 31, 70, 50],
borderWidth: 2,
backgroundColor: balance_chart_bg_color,
borderWidth: 3,
borderColor: "rgba(156, 39, 176, 1)",
pointBorderWidth: 0,
pointBorderColor: "transparent",
pointRadius: 3,
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "rgba(120, 107, 236,1)",
},
],
},
options: {
layout: {
padding: {
bottom: -1,
left: -1,
},
},
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
display: false,
drawBorder: false,
},
ticks: {
beginAtZero: true,
display: false,
},
},
],
xAxes: [
{
gridLines: {
drawBorder: false,
display: false,
},
ticks: {
display: false,
},
},
],
},
},
});
var sales_chart = document.getElementById("chart-3").getContext("2d");
var myChart = new Chart(sales_chart, {
type: "lineShadow",
data: {
labels: [
"1990",
"1991",
"1992",
"1993",
"1994",
"1995",
"1996",
"1997",
"1998",
"1999",
"2000",
"2001",
],
datasets: [
{
label: "Sales",
data: [63, 82, 52, 50, 31, 70, 50, 70, 62, 44, 40, 21],
borderWidth: 2,
backgroundColor: balance_chart_bg_color,
borderWidth: 3,
borderColor: "rgba(76, 175, 80, 1)",
pointBorderWidth: 0,
pointBorderColor: "transparent",
pointRadius: 3,
pointBackgroundColor: "transparent",
pointHoverBackgroundColor: "rgba(120, 107, 236,1)",
},
],
},
options: {
layout: {
padding: {
bottom: -1,
left: -1,
},
},
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines: {
display: false,
drawBorder: false,
},
ticks: {
beginAtZero: true,
display: false,
},
},
],
xAxes: [
{
gridLines: {
drawBorder: false,
display: false,
},
ticks: {
display: false,
},
},
],
},
},
});
var ctx = document.getElementById("donutChart").getContext("2d");
var myChart = new Chart(ctx, {
type: "doughnut",
data: {
datasets: [
{
data: [30, 50, 20],
backgroundColor: ["#191d21", "#63ed7a", "#ffa426"],
label: "Dataset 1",
},
],
labels: ["Black", "Green", "Yellow"],
},
options: {
responsive: true,
legend: {
position: "bottom",
display: false,
},
},
});
var ctx = document.getElementById("line-chart3").getContext("2d");
var gradientStroke = ctx.createLinearGradient(0, 0, 700, 0);
gradientStroke.addColorStop(0, "rgba(255, 204, 128, 1)");
gradientStroke.addColorStop(0.5, "rgba(255, 152, 0, 1)");
gradientStroke.addColorStop(1, "rgba(239, 108, 0, 1)");
var myChart = new Chart(ctx, {
type: "lineShadow",
data: {
labels: ["2010", "2011", "2012", "2013", "2014", "2015", "2016"],
type: "line",
defaultFontFamily: "Poppins",
datasets: [
{
label: "Income",
data: [0, 30, 10, 120, 50, 63, 10],
borderColor: gradientStroke,
pointBorderColor: gradientStroke,
pointBackgroundColor: gradientStroke,
pointHoverBackgroundColor: gradientStroke,
pointHoverBorderColor: gradientStroke,
pointBorderWidth: 10,
pointHoverRadius: 6,
pointHoverBorderWidth: 1,
pointRadius: 1,
fill: false,
borderWidth: 4,
},
{
label: "Expense",
data: [0, 50, 40, 80, 40, 79, 120],
borderColor: gradientStroke,
pointBorderColor: gradientStroke,
pointBackgroundColor: gradientStroke,
pointHoverBackgroundColor: gradientStroke,
pointHoverBorderColor: gradientStroke,
pointBorderWidth: 10,
pointHoverRadius: 6,
pointHoverBorderWidth: 1,
pointRadius: 1,
fill: false,
borderWidth: 4,
},
],
},
options: {
legend: {
position: "bottom",
display: false,
},
scales: {
yAxes: [
{
ticks: {
fontColor: "rgba(0,0,0,0.5)",
fontStyle: "bold",
beginAtZero: true,
maxTicksLimit: 5,
padding: 20,
fontColor: "#9aa0ac", // Font Color
},
gridLines: {
drawTicks: false,
display: false,
},
},
],
xAxes: [
{
gridLines: {
zeroLineColor: "transparent",
},
ticks: {
padding: 20,
fontColor: "rgba(0,0,0,0.5)",
fontStyle: "bold",
fontColor: "#9aa0ac", // Font Color
},
},
],
},
},
});
// revenue chart
var options = {
chart: {
height: 230,
type: "line",
shadow: {
enabled: true,
color: "#000",
top: 18,
left: 7,
blur: 10,
opacity: 1,
},
toolbar: {
show: false,
},
},
colors: ["#3dc7be", "#ffa117"],
dataLabels: {
enabled: true,
},
stroke: {
curve: "smooth",
},
series: [
{
name: "High - 2019",
data: [5, 15, 14, 36, 32, 32],
},
{
name: "Low - 2019",
data: [7, 11, 30, 18, 25, 13],
},
],
grid: {
borderColor: "#e7e7e7",
row: {
colors: ["#f3f3f3", "transparent"], // takes an array which will be repeated on columns
opacity: 0.0,
},
},
markers: {
size: 6,
},
xaxis: {
categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"],
labels: {
style: {
colors: "#9aa0ac",
},
},
},
yaxis: {
title: {
text: "Income",
},
labels: {
style: {
color: "#9aa0ac",
},
},
min: 5,
max: 40,
},
legend: {
position: "top",
horizontalAlign: "right",
floating: true,
offsetY: -25,
offsetX: -5,
},
};
var chart = new ApexCharts(document.querySelector("#revenue"), options);
chart.render();