{upd} statistiques are responsive
This commit is contained in:
parent
32da5131b4
commit
21d67f3d2a
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
|
||||
<div id='CONTAINER' class='list'>
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" :viewBox="gstore.viewBox">
|
||||
<template v-if="gstore.dimensions">
|
||||
<path
|
||||
:d="'m ' + (gstore.dimensions.padding + gstore.dimensions.text.size) + ',' + (gstore.dimensions.padding) + ' ' +
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
/* (1) Load statistics
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Initialize list */
|
||||
gstore.add('stats', []);
|
||||
gstore.add('stats', null);
|
||||
gstore.add('dimensions', null);
|
||||
|
||||
/* (2) Get statistics */
|
||||
|
@ -46,7 +46,7 @@ api.call('GET department/stats', {}, function(rs) {
|
|||
gstore.get.dimensions = {
|
||||
padding: 5,
|
||||
text: {
|
||||
size: maxLabelLength * 9.5,
|
||||
size: maxLabelLength * 8.5,
|
||||
alignH: 5,
|
||||
alignV: 20,
|
||||
},
|
||||
|
@ -71,6 +71,8 @@ api.call('GET department/stats', {}, function(rs) {
|
|||
width: 500,
|
||||
precision: 4
|
||||
};
|
||||
|
||||
gstore.get.viewBox = `0 0 ${gstore.get.dimensions.axis.width + gstore.get.dimensions.text.size + 50} ${gstore.get.dimensions.axis.height + 30}`;
|
||||
});
|
||||
|
||||
gstore.add('colors', ["blue", "yellow", "green", "red", "purple", "lightblue", "lightred", "lightyellow", "lightgreen", "lightpurple"]);
|
|
@ -12,8 +12,8 @@ $svg-lightpurple: #994499;
|
|||
|
||||
svg {
|
||||
|
||||
width: 50em;
|
||||
height: 20em;
|
||||
width: 100%;
|
||||
height: 30vh;
|
||||
margin: 10px;
|
||||
-webkit-touch-callout: none; /* iOS Safari */
|
||||
-webkit-user-select: none; /* Safari */
|
||||
|
|
Loading…
Reference in New Issue