Comments (4)
Hello, at the moment there is no possibility to stop the animation at a certain point, if you are interested, then I will implement it, in addition, write English documentation :)
from radialbar.
At the moment, to stop the progress bar can be thus:
if(bar.get() == 20) bar.isStop = true;
And in the same way it is possible to run.
I believe that the question is closed =)
from radialbar.
Oh, i tried this and i'm not sure how to use it.
This are my current settings:
// graf
window.onload = function() {
// Controll
var canvas = document.getElementById('porabe');
var ctx = canvas.getContext('2d');
canvas.width = 208;
canvas.height = 208;
var progressBarOne = new RadialBar(ctx,
{
x: 104,
y: 96,
radius: 70,
lineWidth: 30,
lineFill: '#a0c9ec',
backLineFill: '#d12f30',
bgFill: '#1d355e',
//progress: 10,
isShowInfoText: true,
infoStyle: 'bold 24px Ubuntu',
infoColor: '#FFF'
});
function loop() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
progressBarOne.set(32);
progressBarOne.add(0.5);
progressBarOne.update();
requestAnimationFrame(loop);
}
loop();
}
from radialbar.
For starters update the library to the new version https://github.com/AZbang/RadialBar/releases/tag/v0.2.0
Then try this:
// code...
// To set the value outside the loop
progressBarOne.set(32);
function loop() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
// add value (loop)
progressBarOne.add(0.5);
// If progress is 55%, then stop
if(progressBarOne.get() == 55) progressBarOne.isStop = true;
// update progress bar
progressBarOne.update();
requestAnimationFrame(loop);
}
loop();
from radialbar.
Related Issues (1)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from radialbar.