Robot/morris.js
1
0
Fork 0
mirror of https://github.com/morrisjs/morris.js.git synced 2024-11-10 21:36:34 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add animatino to line chart

Browse Source
This commit is contained in:
Alan Schio 2018-06-16 08:26:39 -04:00 committed by GitHub
parent 0a6d0fa44d
commit d338412cdc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 60 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
morris.css
View File

@ -1,2 +1,62 @@
.morris-hover{position:absolute;z-index:1000}.morris-hover.morris-default-style{border-radius:10px;padding:6px;color:#666;background:rgba(255,255,255,0.8);border:solid 2px rgba(230,230,230,0.8);font-family:sans-serif;font-size:12px;text-align:center}.morris-hover.morris-default-style .morris-hover-row-label{font-weight:bold;margin:0.25em 0}
.morris-hover.morris-default-style .morris-hover-point{white-space:nowrap;margin:0.1em 0}
path.morris-line {
stroke-dasharray:5000;
stroke-dashoffset:0;
animation: dash 10s linear;
animation-iteration-count: 1;
-moz-animation-iteration-count: 1;
-webkit-animation-iteration-count: 1;
-o-animation-iteration-count: 1;
}
@keyframes dash {
from {
stroke-dashoffset: 5000;
}
}
circle.morris-line-point {
animation: fadeEnter 2s linear;
animation-iteration-count: 1;
-moz-animation-iteration-count: 1;
-webkit-animation-iteration-count: 1;
-o-animation-iteration-count: 1;
}
@keyframes fadeEnter {
from {
opacity: 0;
}
to {
opacity: 1
}
}
.morris-hover {
animation: popUp .2s linear;
animation-iteration-count: 1;
-moz-animation-iteration-count: 1;
-webkit-animation-iteration-count: 1;
-o-animation-iteration-count: 1;
}
@keyframes popUp {
0% {
transform: scale(.3);
}
0% {
transform: scale(1.3);
}
100% {
transform: scale(1);
}
}