トータル数も表示する
This commit is contained in:
parent
0a16474f9d
commit
56ae1797ed
3 changed files with 60 additions and 42 deletions
|
@ -1,27 +1,31 @@
|
||||||
{
|
query GetZoneAnalytics($zoneTag: string, $from: string, $to: string) {
|
||||||
viewer {
|
viewer {
|
||||||
zones(filter: {
|
zones(filter: {zoneTag: $zoneTag}) {
|
||||||
zoneTag: $zoneTag
|
totals: httpRequests1dGroups(limit: 10000, filter: {date_gt: $from, date_leq: $to}) {
|
||||||
}) {
|
uniq {
|
||||||
httpRequests1dGroups(
|
uniques
|
||||||
orderBy: [date_ASC],
|
__typename
|
||||||
limit: $limit,
|
|
||||||
filter: {
|
|
||||||
date_gt: $from,
|
|
||||||
date_leq: $to
|
|
||||||
}
|
}
|
||||||
) {
|
__typename
|
||||||
|
}
|
||||||
|
zones: httpRequests1dGroups(orderBy: [date_ASC], limit: 10000, filter: {date_gt: $from, date_leq: $to}) {
|
||||||
dimensions {
|
dimensions {
|
||||||
date
|
timeslot: date
|
||||||
|
__typename
|
||||||
|
}
|
||||||
|
uniq {
|
||||||
|
uniques
|
||||||
|
__typename
|
||||||
}
|
}
|
||||||
sum {
|
sum {
|
||||||
bytes
|
bytes
|
||||||
cachedBytes
|
cachedBytes
|
||||||
|
__typename
|
||||||
}
|
}
|
||||||
uniq {
|
__typename
|
||||||
uniques
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
__typename
|
||||||
}
|
}
|
||||||
|
__typename
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,27 +1,31 @@
|
||||||
{
|
query GetZoneAnalytics($zoneTag: string, $from: string, $to: string) {
|
||||||
viewer {
|
viewer {
|
||||||
zones(filter: {
|
zones(filter: {zoneTag: $zoneTag}) {
|
||||||
zoneTag: $zoneTag
|
totals: httpRequests1hGroups(limit: 10000, filter: {datetime_gt: $from, datetime_leq: $to}) {
|
||||||
}) {
|
uniq {
|
||||||
httpRequests1hGroups(
|
uniques
|
||||||
orderBy: [datetime_ASC],
|
__typename
|
||||||
limit: $limit,
|
|
||||||
filter: {
|
|
||||||
datetime_gt: $from,
|
|
||||||
datetime_leq: $to
|
|
||||||
}
|
}
|
||||||
) {
|
__typename
|
||||||
|
}
|
||||||
|
zones: httpRequests1hGroups(orderBy: [datetime_ASC], limit: 10000, filter: {datetime_gt: $from, datetime_leq: $to}) {
|
||||||
dimensions {
|
dimensions {
|
||||||
datetime
|
timeslot: datetime
|
||||||
|
__typename
|
||||||
|
}
|
||||||
|
uniq {
|
||||||
|
uniques
|
||||||
|
__typename
|
||||||
}
|
}
|
||||||
sum {
|
sum {
|
||||||
bytes
|
bytes
|
||||||
cachedBytes
|
cachedBytes
|
||||||
|
__typename
|
||||||
}
|
}
|
||||||
uniq {
|
__typename
|
||||||
uniques
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
__typename
|
||||||
}
|
}
|
||||||
|
__typename
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -89,8 +89,8 @@ addEventListener("load", () => {
|
||||||
.then((results) => {
|
.then((results) => {
|
||||||
document.querySelector("#loading").remove();
|
document.querySelector("#loading").remove();
|
||||||
|
|
||||||
const scale = Math.max(...results.map((r) => r.json["data"]["viewer"]["zones"][0]["httpRequests1dGroups"].length));
|
const scale = Math.max(...results.map((r) => r.json["data"]["viewer"]["zones"][0]["zones"].length));
|
||||||
const endedAt = Math.max(...results.map((r) => r.json["data"]["viewer"]["zones"][0]["httpRequests1dGroups"].map((g) => new Date(g["dimensions"]["date"]).getTime())).flat());
|
const endedAt = Math.max(...results.map((r) => r.json["data"]["viewer"]["zones"][0]["zones"].map((g) => new Date(g["dimensions"]["timeslot"]).getTime())).flat());
|
||||||
const range = Array.from({ length: scale }, (_, k) => new Date(endedAt - k * 24 * 60 * 60 * 1000));
|
const range = Array.from({ length: scale }, (_, k) => new Date(endedAt - k * 24 * 60 * 60 * 1000));
|
||||||
|
|
||||||
const ctxUsers = document.querySelector("#users").getContext("2d");
|
const ctxUsers = document.querySelector("#users").getContext("2d");
|
||||||
|
@ -99,10 +99,15 @@ addEventListener("load", () => {
|
||||||
ctxUsers,
|
ctxUsers,
|
||||||
range.map((d) => d.toISOString().slice(0, 10)).reverse(),
|
range.map((d) => d.toISOString().slice(0, 10)).reverse(),
|
||||||
results.map((r) => {
|
results.map((r) => {
|
||||||
|
const total = Intl.NumberFormat('en-US', {
|
||||||
|
notation: "compact",
|
||||||
|
maximumFractionDigits: 1,
|
||||||
|
}).format(r.json["data"]["viewer"]["zones"][0]["totals"][0]["uniq"]["uniques"]);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
type: "line",
|
type: "line",
|
||||||
label: r.domain,
|
label: r.domain + " - (" + total + ")",
|
||||||
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["httpRequests1dGroups"].find((g) => g["dimensions"]["date"] === d.toISOString().slice(0, 10))?.["uniq"]?.["uniques"] ?? null).reverse(),
|
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["zones"].find((g) => g["dimensions"]["timeslot"] === d.toISOString().slice(0, 10))?.["uniq"]?.["uniques"] ?? null).reverse(),
|
||||||
borderColor: r.fg,
|
borderColor: r.fg,
|
||||||
borderWidth: 1,
|
borderWidth: 1,
|
||||||
fill: "origin",
|
fill: "origin",
|
||||||
|
@ -122,7 +127,7 @@ addEventListener("load", () => {
|
||||||
return {
|
return {
|
||||||
type: "line",
|
type: "line",
|
||||||
label: r.domain,
|
label: r.domain,
|
||||||
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["httpRequests1dGroups"].find((g) => g["dimensions"]["date"] === d.toISOString().slice(0, 10))?.["sum"]?.["bytes"] / 1000 ** 3 ?? null).reverse(),
|
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["zones"].find((g) => g["dimensions"]["timeslot"] === d.toISOString().slice(0, 10))?.["sum"]?.["bytes"] / 1000 ** 3 ?? null).reverse(),
|
||||||
borderColor: r.fg,
|
borderColor: r.fg,
|
||||||
borderWidth: 1,
|
borderWidth: 1,
|
||||||
fill: "origin",
|
fill: "origin",
|
||||||
|
@ -142,7 +147,7 @@ addEventListener("load", () => {
|
||||||
return {
|
return {
|
||||||
type: "line",
|
type: "line",
|
||||||
label: r.domain,
|
label: r.domain,
|
||||||
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["httpRequests1dGroups"].find((g) => g["dimensions"]["date"] === d.toISOString().slice(0, 10))?.["sum"]?.["cachedBytes"] / 1000 ** 3 ?? null).reverse(),
|
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["zones"].find((g) => g["dimensions"]["timeslot"] === d.toISOString().slice(0, 10))?.["sum"]?.["cachedBytes"] / 1000 ** 3 ?? null).reverse(),
|
||||||
borderColor: r.fg,
|
borderColor: r.fg,
|
||||||
borderWidth: 1,
|
borderWidth: 1,
|
||||||
fill: "origin",
|
fill: "origin",
|
||||||
|
@ -158,8 +163,8 @@ addEventListener("load", () => {
|
||||||
.then((results) => {
|
.then((results) => {
|
||||||
document.querySelector("#loading-2").remove();
|
document.querySelector("#loading-2").remove();
|
||||||
|
|
||||||
const scale = Math.max(...results.map((r) => r.json["data"]["viewer"]["zones"][0]["httpRequests1hGroups"].length));
|
const scale = Math.max(...results.map((r) => r.json["data"]["viewer"]["zones"][0]["zones"].length));
|
||||||
const endedAt = Math.max(...results.map((r) => r.json["data"]["viewer"]["zones"][0]["httpRequests1hGroups"].map((g) => new Date(g["dimensions"]["datetime"]).getTime())).flat());
|
const endedAt = Math.max(...results.map((r) => r.json["data"]["viewer"]["zones"][0]["zones"].map((g) => new Date(g["dimensions"]["timeslot"]).getTime())).flat());
|
||||||
const range = Array.from({ length: scale }, (_, k) => new Date(endedAt - k * 60 * 60 * 1000));
|
const range = Array.from({ length: scale }, (_, k) => new Date(endedAt - k * 60 * 60 * 1000));
|
||||||
|
|
||||||
const ctxUsers = document.querySelector("#users-2").getContext("2d");
|
const ctxUsers = document.querySelector("#users-2").getContext("2d");
|
||||||
|
@ -168,10 +173,15 @@ addEventListener("load", () => {
|
||||||
ctxUsers,
|
ctxUsers,
|
||||||
range.map((d) => d.toLocaleString()).reverse(),
|
range.map((d) => d.toLocaleString()).reverse(),
|
||||||
results.map((r) => {
|
results.map((r) => {
|
||||||
|
const total = Intl.NumberFormat('en-US', {
|
||||||
|
notation: "compact",
|
||||||
|
maximumFractionDigits: 1,
|
||||||
|
}).format(r.json["data"]["viewer"]["zones"][0]["totals"][0]["uniq"]["uniques"]);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
type: "line",
|
type: "line",
|
||||||
label: r.domain,
|
label: r.domain + " - (" + total + ")",
|
||||||
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["httpRequests1hGroups"].find((g) => g["dimensions"]["datetime"] === d.toISOString().slice(0, 19) + "Z")?.["uniq"]?.["uniques"] ?? null).reverse(),
|
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["zones"].find((g) => g["dimensions"]["timeslot"] === d.toISOString().slice(0, 19) + "Z")?.["uniq"]?.["uniques"] ?? null).reverse(),
|
||||||
borderColor: r.fg,
|
borderColor: r.fg,
|
||||||
borderWidth: 1,
|
borderWidth: 1,
|
||||||
fill: "origin",
|
fill: "origin",
|
||||||
|
@ -191,7 +201,7 @@ addEventListener("load", () => {
|
||||||
return {
|
return {
|
||||||
type: "line",
|
type: "line",
|
||||||
label: r.domain,
|
label: r.domain,
|
||||||
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["httpRequests1hGroups"].find((g) => g["dimensions"]["datetime"] === d.toISOString().slice(0, 19) + "Z")?.["sum"]?.["bytes"] / 1000 ** 3 ?? null).reverse(),
|
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["zones"].find((g) => g["dimensions"]["timeslot"] === d.toISOString().slice(0, 19) + "Z")?.["sum"]?.["bytes"] / 1000 ** 3 ?? null).reverse(),
|
||||||
borderColor: r.fg,
|
borderColor: r.fg,
|
||||||
borderWidth: 1,
|
borderWidth: 1,
|
||||||
fill: "origin",
|
fill: "origin",
|
||||||
|
@ -211,7 +221,7 @@ addEventListener("load", () => {
|
||||||
return {
|
return {
|
||||||
type: "line",
|
type: "line",
|
||||||
label: r.domain,
|
label: r.domain,
|
||||||
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["httpRequests1hGroups"].find((g) => g["dimensions"]["datetime"] === d.toISOString().slice(0, 19) + "Z")?.["sum"]?.["cachedBytes"] / 1000 ** 3 ?? null).reverse(),
|
data: range.map((d) => r.json["data"]["viewer"]["zones"][0]["zones"].find((g) => g["dimensions"]["timeslot"] === d.toISOString().slice(0, 19) + "Z")?.["sum"]?.["cachedBytes"] / 1000 ** 3 ?? null).reverse(),
|
||||||
borderColor: r.fg,
|
borderColor: r.fg,
|
||||||
borderWidth: 1,
|
borderWidth: 1,
|
||||||
fill: "origin",
|
fill: "origin",
|
||||||
|
|
Loading…
Add table
Reference in a new issue