mirror of
https://github.com/cwinfo/powerdns-admin.git
synced 2024-11-13 00:50:27 +00:00
242 lines
7.9 KiB
JavaScript
242 lines
7.9 KiB
JavaScript
var EcommerceIndex = function () {
|
|
|
|
function showTooltip(x, y, labelX, labelY) {
|
|
$('<div id="tooltip" class="chart-tooltip">' + (labelY.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,')) + 'USD<\/div>').css({
|
|
position: 'absolute',
|
|
display: 'none',
|
|
top: y - 40,
|
|
left: x - 60,
|
|
border: '0px solid #ccc',
|
|
padding: '2px 6px',
|
|
'background-color': '#fff'
|
|
}).appendTo("body").fadeIn(200);
|
|
}
|
|
|
|
var initChart1 = function () {
|
|
|
|
var data = [
|
|
['01/2013', 4],
|
|
['02/2013', 8],
|
|
['03/2013', 10],
|
|
['04/2013', 12],
|
|
['05/2013', 2125],
|
|
['06/2013', 324],
|
|
['07/2013', 1223],
|
|
['08/2013', 1365],
|
|
['09/2013', 250],
|
|
['10/2013', 999],
|
|
['11/2013', 390]
|
|
];
|
|
|
|
var plot_statistics = $.plot(
|
|
$("#statistics_1"),
|
|
[
|
|
{
|
|
data:data,
|
|
lines: {
|
|
fill: 0.6,
|
|
lineWidth: 0
|
|
},
|
|
color: ['#f89f9f']
|
|
},
|
|
{
|
|
data: data,
|
|
points: {
|
|
show: true,
|
|
fill: true,
|
|
radius: 5,
|
|
fillColor: "#f89f9f",
|
|
lineWidth: 3
|
|
},
|
|
color: '#fff',
|
|
shadowSize: 0
|
|
}
|
|
],
|
|
{
|
|
|
|
xaxis: {
|
|
tickLength: 0,
|
|
tickDecimals: 0,
|
|
mode: "categories",
|
|
min: 2,
|
|
font: {
|
|
lineHeight: 15,
|
|
style: "normal",
|
|
variant: "small-caps",
|
|
color: "#6F7B8A"
|
|
}
|
|
},
|
|
yaxis: {
|
|
ticks: 3,
|
|
tickDecimals: 0,
|
|
tickColor: "#f0f0f0",
|
|
font: {
|
|
lineHeight: 15,
|
|
style: "normal",
|
|
variant: "small-caps",
|
|
color: "#6F7B8A"
|
|
}
|
|
},
|
|
grid: {
|
|
backgroundColor: {
|
|
colors: ["#fff", "#fff"]
|
|
},
|
|
borderWidth: 1,
|
|
borderColor: "#f0f0f0",
|
|
margin: 0,
|
|
minBorderMargin: 0,
|
|
labelMargin: 20,
|
|
hoverable: true,
|
|
clickable: true,
|
|
mouseActiveRadius: 6
|
|
},
|
|
legend: {
|
|
show: false
|
|
}
|
|
}
|
|
);
|
|
|
|
var previousPoint = null;
|
|
|
|
$("#statistics_1").bind("plothover", function (event, pos, item) {
|
|
$("#x").text(pos.x.toFixed(2));
|
|
$("#y").text(pos.y.toFixed(2));
|
|
if (item) {
|
|
if (previousPoint != item.dataIndex) {
|
|
previousPoint = item.dataIndex;
|
|
|
|
$("#tooltip").remove();
|
|
var x = item.datapoint[0].toFixed(2),
|
|
y = item.datapoint[1].toFixed(2);
|
|
|
|
showTooltip(item.pageX, item.pageY, item.datapoint[0], item.datapoint[1]);
|
|
}
|
|
} else {
|
|
$("#tooltip").remove();
|
|
previousPoint = null;
|
|
}
|
|
});
|
|
|
|
}
|
|
|
|
var initChart2 = function() {
|
|
|
|
var data = [
|
|
['01/2013', 10],
|
|
['02/2013', 0],
|
|
['03/2013', 10],
|
|
['04/2013', 12],
|
|
['05/2013', 212],
|
|
['06/2013', 324],
|
|
['07/2013', 122],
|
|
['08/2013', 136],
|
|
['09/2013', 250],
|
|
['10/2013', 99],
|
|
['11/2013', 190]
|
|
];
|
|
|
|
var plot_statistics = $.plot(
|
|
$("#statistics_2"),
|
|
[
|
|
{
|
|
data:data,
|
|
lines: {
|
|
fill: 0.6,
|
|
lineWidth: 0
|
|
},
|
|
color: ['#BAD9F5']
|
|
},
|
|
{
|
|
data: data,
|
|
points: {
|
|
show: true,
|
|
fill: true,
|
|
radius: 5,
|
|
fillColor: "#BAD9F5",
|
|
lineWidth: 3
|
|
},
|
|
color: '#fff',
|
|
shadowSize: 0
|
|
}
|
|
],
|
|
{
|
|
|
|
xaxis: {
|
|
tickLength: 0,
|
|
tickDecimals: 0,
|
|
mode: "categories",
|
|
min: 2,
|
|
font: {
|
|
lineHeight: 14,
|
|
style: "normal",
|
|
variant: "small-caps",
|
|
color: "#6F7B8A"
|
|
}
|
|
},
|
|
yaxis: {
|
|
ticks: 3,
|
|
tickDecimals: 0,
|
|
tickColor: "#f0f0f0",
|
|
font: {
|
|
lineHeight: 14,
|
|
style: "normal",
|
|
variant: "small-caps",
|
|
color: "#6F7B8A"
|
|
}
|
|
},
|
|
grid: {
|
|
backgroundColor: {
|
|
colors: ["#fff", "#fff"]
|
|
},
|
|
borderWidth: 1,
|
|
borderColor: "#f0f0f0",
|
|
margin: 0,
|
|
minBorderMargin: 0,
|
|
labelMargin: 20,
|
|
hoverable: true,
|
|
clickable: true,
|
|
mouseActiveRadius: 6
|
|
},
|
|
legend: {
|
|
show: false
|
|
}
|
|
}
|
|
);
|
|
|
|
var previousPoint = null;
|
|
|
|
$("#statistics_2").bind("plothover", function (event, pos, item) {
|
|
$("#x").text(pos.x.toFixed(2));
|
|
$("#y").text(pos.y.toFixed(2));
|
|
if (item) {
|
|
if (previousPoint != item.dataIndex) {
|
|
previousPoint = item.dataIndex;
|
|
|
|
$("#tooltip").remove();
|
|
var x = item.datapoint[0].toFixed(2),
|
|
y = item.datapoint[1].toFixed(2);
|
|
|
|
showTooltip(item.pageX, item.pageY, item.datapoint[0], item.datapoint[1]);
|
|
}
|
|
} else {
|
|
$("#tooltip").remove();
|
|
previousPoint = null;
|
|
}
|
|
});
|
|
|
|
}
|
|
|
|
return {
|
|
|
|
//main function
|
|
init: function () {
|
|
initChart1();
|
|
|
|
$('#statistics_amounts_tab').on('shown.bs.tab', function (e) {
|
|
initChart2();
|
|
});
|
|
}
|
|
|
|
};
|
|
|
|
}(); |