Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Pédagogies Multimodales
Phonographe
Commits
2df1cc4a
Commit
2df1cc4a
authored
Aug 22, 2022
by
Sylvain Coulange
🌼
Browse files
update stats vis
parent
0e5b6cdb
Changes
2
Hide whitespace changes
Inline
Side-by-side
static/js/appStatVis.js
View file @
2df1cc4a
var
appdata
=
[];
var
stats
=
{};
var
filter
=
{
app
:[],
mod
:[],
pay
:[],
lan
:[],
use
:[],
age
:[]}
var
initfilter
=
{
app
:[],
mod
:[],
pay
:[],
lan
:[],
use
:[],
age
:[]}
getStats
()
...
...
@@ -18,16 +19,73 @@ async function getStats() {
appdata
=
await
response
.
json
();
console
.
log
(
appdata
);
document
.
getElementById
(
'
nbTracesTotal
'
).
innerText
=
appdata
.
appdata
.
length
;
for
(
var
{
date
:
d
,
app
:
a
,
module
:
m
,
ip
:
i
,
agent
:
ag
,
country
:
c
,
lang
:
l
}
of
appdata
.
appdata
)
{
if
(
!
filter
.
app
.
includes
(
a
))
filter
.
app
.
push
(
a
);
if
(
!
filter
.
mod
.
includes
(
m
))
filter
.
mod
.
push
(
m
);
if
(
!
filter
.
pay
.
includes
(
c
))
filter
.
pay
.
push
(
c
);
if
(
!
filter
.
lan
.
includes
(
l
))
filter
.
lan
.
push
(
l
);
if
(
!
filter
.
app
.
includes
(
a
))
{
filter
.
app
.
push
(
a
);
initfilter
.
app
.
push
(
a
);
}
if
(
!
filter
.
mod
.
includes
(
m
))
{
filter
.
mod
.
push
(
m
);
initfilter
.
mod
.
push
(
m
);
}
if
(
!
filter
.
pay
.
includes
(
c
))
{
filter
.
pay
.
push
(
c
);
initfilter
.
pay
.
push
(
c
);
}
if
(
!
filter
.
lan
.
includes
(
l
))
{
filter
.
lan
.
push
(
l
);
initfilter
.
lan
.
push
(
l
);
}
if
(
!
filter
.
use
.
includes
(
i
))
{
filter
.
use
.
push
(
i
);
initfilter
.
use
.
push
(
i
);
}
if
(
!
filter
.
age
.
includes
(
ag
))
{
filter
.
age
.
push
(
ag
);
initfilter
.
age
.
push
(
ag
);
}
}
makeCharts
(
filter
)
}
function
select
(
param
)
{
if
(
initfilter
.
app
.
includes
(
param
)
)
{
if
(
filter
.
app
.
length
==
1
)
filter
.
app
=
initfilter
.
app
;
else
{
filter
.
app
=
[
param
]
}
}
else
if
(
initfilter
.
mod
.
includes
(
param
)
)
{
if
(
filter
.
mod
.
length
==
1
)
filter
.
mod
=
initfilter
.
mod
;
else
{
filter
.
mod
=
[
param
]
}
}
else
if
(
initfilter
.
pay
.
includes
(
param
)
)
{
if
(
filter
.
pay
.
length
==
1
)
filter
.
pay
=
initfilter
.
pay
;
else
{
filter
.
pay
=
[
param
]
}
}
else
if
(
initfilter
.
lan
.
includes
(
param
)
)
{
if
(
filter
.
lan
.
length
==
1
)
filter
.
lan
=
initfilter
.
lan
;
else
{
filter
.
lan
=
[
param
]
}
}
else
if
(
initfilter
.
use
.
includes
(
param
)
)
{
if
(
filter
.
use
.
length
==
1
)
filter
.
use
=
initfilter
.
use
;
else
{
filter
.
use
=
[
param
]
}
}
else
if
(
initfilter
.
age
.
includes
(
param
)
)
{
if
(
filter
.
age
.
length
==
1
)
filter
.
age
=
initfilter
.
age
;
else
{
filter
.
age
=
[
param
]
}
}
updateCharts
(
filter
);
}
var
chartApps
;
var
chartModules
;
var
chartPays
;
...
...
@@ -43,8 +101,8 @@ function makeCharts(filter) {
chartModules
=
makeChart
(
'
chartModules
'
,
stats
.
mod2freq
);
chartPays
=
makeChart
(
'
chartPays
'
,
stats
.
pay2freq
);
chartLangues
=
makeChart
(
'
chartLangues
'
,
stats
.
lan2freq
);
chartUsers
=
makeChart
(
'
chartUsers
'
,
stats
.
use2freq
);
chartAgents
=
makeChart
(
'
chartAgents
'
,
stats
.
age2freq
);
chartUsers
=
makeChart
(
'
chartUsers
'
,
stats
.
use2freq
,
false
);
chartAgents
=
makeChart
(
'
chartAgents
'
,
stats
.
age2freq
,
false
);
chartTime
=
makeTimeChart
(
'
chartTime
'
,
stats
.
day2traces
);
}
...
...
@@ -75,6 +133,7 @@ function summarize(filter, data, day2traces){
var
lan2freq
=
{};
var
use2freq
=
{};
var
age2freq
=
{};
var
cpt
=
0
;
for
(
var
{
date
:
d
,
app
:
a
,
module
:
m
,
ip
:
i
,
agent
:
ag
,
country
:
c
,
lang
:
l
}
of
data
)
{
if
(
filter
.
app
.
includes
(
a
)
&&
filter
.
mod
.
includes
(
m
)
&&
filter
.
pay
.
includes
(
c
)
&&
filter
.
lan
.
includes
(
l
))
{
...
...
@@ -98,8 +157,11 @@ function summarize(filter, data, day2traces){
var
df
=
d
.
slice
(
0
,
10
);
if
(
Object
.
keys
(
day2traces
).
includes
(
df
))
day2traces
[
df
]
++
;
cpt
++
}
}
document
.
getElementById
(
'
nbTraces
'
).
innerText
=
cpt
;
return
{
'
app2freq
'
:
app2freq
,
'
mod2freq
'
:
mod2freq
,
...
...
@@ -111,8 +173,7 @@ function summarize(filter, data, day2traces){
}
}
function
makeChart
(
canvasName
,
stats
)
{
function
makeChart
(
canvasName
,
stats
,
legend
=
true
)
{
var
data
=
{
labels
:
Object
.
keys
(
stats
),
datasets
:
[{
...
...
@@ -129,10 +190,20 @@ function makeChart(canvasName, stats) {
options
:
{
plugins
:
{
legend
:
{
display
:
true
,
display
:
legend
,
position
:
'
bottom
'
}
},
onClick
:
(
e
,
activeEls
)
=>
{
let
datasetIndex
=
activeEls
[
0
].
datasetIndex
;
let
dataIndex
=
activeEls
[
0
].
index
;
let
datasetLabel
=
e
.
chart
.
data
.
datasets
[
datasetIndex
].
label
;
let
value
=
e
.
chart
.
data
.
datasets
[
datasetIndex
].
data
[
dataIndex
];
let
label
=
e
.
chart
.
data
.
labels
[
dataIndex
];
console
.
log
(
"
In click
"
,
datasetLabel
,
label
,
value
);
select
(
label
);
}
}
};
...
...
@@ -140,11 +211,12 @@ function makeChart(canvasName, stats) {
document
.
getElementById
(
canvasName
),
config
);
return
myChart
}
// DISPLAY TIME CHART
function
makeTimeChart
(
canvasName
,
day2traces
)
{
...
...
templates/users/appStatVis.html
View file @
2df1cc4a
...
...
@@ -11,6 +11,7 @@
<h1>
Statistiques d'utilisation des applications ALeM
</h1>
<p>
(depuis le 7 août 2022)
</p>
<strong><span
id=
"nbTraces"
></span>
traces sélectionnées sur
<span
id=
"nbTracesTotal"
></span>
traces enregistrées.
</strong>
<div
class=
"container"
>
<div
class=
"row"
>
<div
class=
"col myChart"
>
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment