Leocardoso94 / Animated Number Vue
Licence: mit
Super easy way to animate numbers.
Stars: ✭ 170
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Animated Number Vue
Anime Face Detector
A Faster-RCNN based anime face detector implementation using tensorflow.
Stars: ✭ 117 (-31.18%)
Mutual labels: anime
Transfer Learning Anime
Transfer Learning for Anime Characters Recognition
Stars: ✭ 155 (-8.82%)
Mutual labels: anime
Cloudstream 2
CloudStream 2 is an android streaming app for movies, tv-shows and anime
Stars: ✭ 120 (-29.41%)
Mutual labels: anime
Awesomeanimeresearch
Papers, repository or other data about anime or manga research. Please let me know if you know information which the list don't include.
Stars: ✭ 127 (-25.29%)
Mutual labels: anime
Doki Theme Jetbrains
Code with your waifu! Here are a bunch of themes for your JetBrains IDEs. Choose a girl from various anime series, manga, and visual novels such as: Re:Zero, KillLaKill and Doki-Doki Literature Club.
Stars: ✭ 143 (-15.88%)
Mutual labels: anime
Overmix
Automatic anime screenshot stitching in high quality
Stars: ✭ 114 (-32.94%)
Mutual labels: anime
Anime Face Gan Keras
A DCGAN to generate anime faces using custom mined dataset
Stars: ✭ 161 (-5.29%)
Mutual labels: anime
Deepcreampy
Decensoring Hentai with Deep Neural Networks
Stars: ✭ 10,822 (+6265.88%)
Mutual labels: anime
Onepiece Kg
a knowledge graph project for ONEPIECE /《海贼王》知识图谱
Stars: ✭ 123 (-27.65%)
Mutual labels: anime
Yolo V3 Iou
YOLO3 动漫人脸检测 (Based on keras and tensorflow) 2019-1-19
Stars: ✭ 116 (-31.76%)
Mutual labels: anime
Malgraph4
MALgraph: statistics service for MyAnimeList.net users.
Stars: ✭ 143 (-15.88%)
Mutual labels: anime
Waifu Motivator Plugin
OSS Waifu Motivator Plugin for Jetbrains to help boost your motivation while coding!
Stars: ✭ 160 (-5.88%)
Mutual labels: anime
animated-number-vue
A simple vue animated number for Vue2, using anime.
Live demo here
Usage
$ npm install animated-number-vue
# OR
$ yarn add animated-number-vue
<template>
<animated-number
:value="value"
:formatValue="formatToPrice"
:duration="300"
/>
</template>
<script>
import AnimatedNumber from "animated-number-vue";
export default {
components: {
AnimatedNumber
},
data() {
return {
value: 1000
};
},
methods: {
formatToPrice(value) {
return `R$ ${value.toFixed(2)}`;
}
}
};
</script>
Props
Following props
are used while initialization
Note : Only
value
is a required prop. Others are optional
Prop Name | Type | Description |
---|---|---|
value (required)
|
[ Number, String] | number that will be animated |
duration (optional)
|
Number | the duration of animation |
round (optional)
|
Number | remove decimals by rounding the value |
delay (optional)
|
Number | the delay of animation |
easing (optional)
|
String | you can found all valid values here |
Callbacks props
Execute a function at the beginning, during or when an animation or timeline is completed.
Names | Types | Arguments | Info |
---|---|---|---|
formatValue | Function | value Number
|
A function that will manipulate the animated value |
update | Function | animation Object
|
Called at time = 0 |
run | Function | animation Object
|
Called after delay is finished |
begin | Function | animation Object
|
Called after animation delay is over |
complete | Function | animation Object
|
Called only after all the loops are completed |
Format Value
formatValue()
is used to format the animatedValue.
Update
update()
is called on every frame while the instance is playing.
Begin
begin()
is called once after the delay is finished.
Check if the animation has begun with myAnimation.began
, return true
or false
.
Run
run()
is called every frame after the delay is finished.
Complete
complete()
is called once after the animation is finished.
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].