/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: js
*/
$(function () {
"use strict";
// ==============================================================
// Newsletter
// ==============================================================
var chart = new Chartist.Line('.campaign', {
labels: [1, 2, 3, 4, 5, 6, 7, 8],
series: [
[0, 5000, 15000, 8000, 15000, 9000, 30000, 0]
, [0, 3000, 5000, 2000, 8000, 1000, 5000, 0]
]}, {
low: 0,
high: 28000,
showArea: true,
fullWidth: true,
plugins: [
Chartist.plugins.tooltip()
],
axisY: {
onlyInteger: true
, scaleMinSpace: 40
, offset: 20
, labelInterpolationFnc: function (value) {
return (value / 1000) + 'k';
}
},
});
// Offset x1 a tiny amount so that the straight stroke gets a bounding box
// Straight lines don't get a bounding box
// Last remark on -> http://www.w3.org/TR/SVG11/coords.html#ObjectBoundingBox
chart.on('draw', function(ctx) {
if(ctx.type === 'area') {
ctx.element.attr({
x1: ctx.x1 + 0.001
});
}
});
// Create the gradient definition on created event (always after chart re-render)
chart.on('created', function(ctx) {
var defs = ctx.svg.elem('defs');
defs.elem('linearGradient', {
id: 'gradient',
x1: 0,
y1: 1,
x2: 0,
y2: 0
}).elem('stop', {
offset: 0,
'stop-color': 'rgba(255, 255, 255, 1)'
}).parent().elem('stop', {
offset: 1,
'stop-color': 'rgba(38, 198, 218, 1)'
});
});
var chart = [chart];
// ==============================================================
// This is for the animation
// ==============================================================
for (var i = 0; i < chart.length; i++) {
chart[i].on('draw', function(data) {
if (data.type === 'line' || data.type === 'area') {
data.element.animate({
d: {
begin: 500 * data.index,
dur: 500,
from: data.path.clone().scale(1, 0).translate(0, data.chartRect.height()).stringify(),
to: data.path.clone().stringify(),
easing: Chartist.Svg.Easing.easeInOutElastic
}
});
}
if (data.type === 'bar') {
data.element.animate({
y2: {
dur: 500,
from: data.y1,
to: data.y2,
easing: Chartist.Svg.Easing.easeInOutElastic
},
opacity: {
dur: 500,
from: 0,
to: 1,
easing: Chartist.Svg.Easing.easeInOutElastic
}
});
}
});
}
// ==============================================================
// world map
// ==============================================================
jQuery('#visitfromworld').vectorMap({
map: 'world_mill_en'
, backgroundColor: '#fff'
, borderColor: '#ccc'
, borderOpacity: 0.9
, borderWidth: 1
, zoomOnScroll : false
, color: '#ddd'
, regionStyle: {
initial: {
fill: '#fff'
}
}
, markerStyle: {
initial: {
r: 8
, 'fill': '#26c6da'
, 'fill-opacity': 1
, 'stroke': '#000'
, 'stroke-width': 0
, 'stroke-opacity': 1
}
, }
, enableZoom: true
, hoverColor: '#79e580'
, markers: [{
latLng: [21.00, 78.00]
, name: 'India : 9347'
, style: {fill: '#26c6da'}
},
{
latLng : [-33.00, 151.00],
name : 'Australia : 250'
, style: {fill: '#02b0c3'}
},
{
latLng : [36.77, -119.41],
name : 'USA : 250'
, style: {fill: '#11a0f8'}
},
{
latLng : [55.37, -3.41],
name : 'UK : 250'
, style: {fill: '#745af2'}
},
{
latLng : [25.20, 55.27],
name : 'UAE : 250'
, style: {fill: '#ffbc34'}
}]
, hoverOpacity: null
, normalizeFunction: 'linear'
, scaleColors: ['#fff', '#ccc']
, selectedColor: '#c9dfaf'
, selectedRegions: []
, showTooltip: true
, onRegionClick: function (element, code, region) {
var message = 'You clicked "' + region + '" which has the code: ' + code.toUpperCase();
alert(message);
}
});
// ==============================================================
// SALES DIFFERENCE
// ==============================================================
Morris.Area({
element: 'morris-area-chart2',
data: [{
period: '2010',
SiteA: 0,
SiteB: 0,
}, {
period: '2011',
SiteA: 130,
SiteB: 100,
}, {
period: '2012',
SiteA: 80,
SiteB: 60,
}, {
period: '2013',
SiteA: 70,
SiteB: 200,
}, {
period: '2014',
SiteA: 180,
SiteB: 150,
}, {
period: '2015',
SiteA: 105,
SiteB: 90,
},
{
period: '2016',
SiteA: 250,
SiteB: 150,
}],
xkey: 'period',
ykeys: ['SiteA', 'SiteB'],
labels: ['Site A', 'Site B'],
pointSize: 0,
fillOpacity: 0.4,
pointStrokeColors:['#b4becb', '#01c0c8'],
behaveLikeLine: true,
gridLineColor: '#e0e0e0',
lineWidth: 0,
smooth: false,
hideHover: 'auto',
lineColors: ['#b4becb', '#01c0c8'],
resize: true
});
// ==============================================================
// sparkline chart
// ==============================================================
var sparklineLogin = function() {
$('.spark-count').sparkline([4, 5, 0, 10, 9, 12, 4, 9, 4, 5, 3, 10, 9, 12, 10, 9, 12, 4, 9], {
type: 'bar'
, width: '100%'
, height: '70'
, barWidth: '2'
, resize: true
, barSpacing: '6'
, barColor: 'rgba(255, 255, 255, 0.3)'
});
$('.spark-count2').sparkline([4, 5, 0, 10, 9, 12, 4, 9, 4, 5, 3, 10, 9, 12, 10, 9, 12, 4, 9], {
type: 'bar'
, width: '100%'
, height: '70'
, barWidth: '2'
, resize: true
, barSpacing: '6'
, barColor: 'rgba(255, 255, 255, 0.3)'
});
$('#spark8').sparkline([ 4, 5, 0, 10, 9, 12, 4, 9], {
type: 'bar',
width: '100%',
height: '40',
barWidth: '4',
resize: true,
barSpacing: '5',
barColor: '#26c6da'
});
$('#spark9').sparkline([ 0, 5, 6, 10, 9, 12, 4, 9], {
type: 'bar',
width: '100%',
height: '40',
barWidth: '4',
resize: true,
barSpacing: '5',
barColor: '#ef5350'
});
$('#spark10').sparkline([ 0, 5, 6, 10, 9, 12, 4, 9], {
type: 'bar',
width: '100%',
height: '40',
barWidth: '4',
resize: true,
barSpacing: '5',
barColor: '#7460ee'
});
}
var sparkResize;
$(window).resize(function(e) {
clearTimeout(sparkResize);
sparkResize = setTimeout(sparklineLogin, 500);
});
sparklineLogin();
});
|