An AngularJS directive to draw stars on a webpage.
See the presentation: http://richardeigenmann.github.io/DrawStars/presentation.html
This project needs updating as AngularJS is now firmly outdated even though it still works fine.
<!DOCTYPE html>
<html ng-app="drawStarsApp">
<body>
<drawstars highlightstars="3" maxstars="4"></drawstars>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.3/angular.min.js">
</script>
<script src="drawStars.js"></script>
<script>
angular.module('drawStarsApp', ['drawStars']);
</script>
</body>
</html>Link to drawStars.js: http://richardeigenmann.github.io/DrawStars/drawStars.js
The number of stars to show. An integer between 1 and any reasonable number. Defaults to 4.
A string for the color for the non-highlighted stars. Any color the HTML5 context.fillSytle will understand will work. Examples: "red", "gold", "%FF0000". Defaults to "gold".
The number of stars that are highlighted. An integer between 1 and maxstars. (Though it doesn't matter if it is higher than maxstars.) Defaults to 0.
A string representing the color for the highlighted stars. See offcolor for syntax. Defaults to "red".
An integer between 4 and a reasonable number, say 30. This parameter defines how many points and troughs the stars will have. Defaults to 5.
An integer that measures the radius of the star from the centre to the outer points in pixels. Defaults to 10.
The multiplier to determine the inner radius from the radius. Defaults to 0.5.
- Update to a new Version of Angular
- Update grunt to a modern tool