Closed tbillion closed 7 years ago
Hi @tbillion,
You reverse engineered it correctly. It may not be working because of some mathematical equation.
Anyways, the use case that you have is to show value greater than 100
. So for that do not use value
attribute. Use used
and total
attributes. Why? You are right, value attribute only supports value between 0-100. used
and total
attribute will show the actual value of used
on label, but gauge will be created as the percentage of used
out of total
.
For example:
<ng-gauge used="156" total="500"
thick="10" type="arch" append="rpm"
foreground-color="rgba(147, 0, 14, 1)" background-color="rgba(89, 89, 89, 1)">
</ng-gauge>
For now, this will help you with your usecase. Just figure out what could be the maximum value rpm can get use that as total
and the value that your platform returning for current time is sent to used
attribute. It is also mentioned on the documentation here
And i very well got your point of making angular-gauge
more usable for larger audience like for your usecase. Even i received similar pull requests few days back for same thing to support negative usecase using negateValue
, displayValue
etc. But the problem is i do not want to introduce custom attributes like negateValue
, displayValue
, divisor
etc. I want to make it more general that can serve as many usecases as possible. But, yes you idea really helped in figuring out the mathematical equation in more depth.
So in next major release v2.0 i will introduce min
, max
and value
attribute which can handle 0-100 case, greater than 100 use case as well as negative use case. And from API wise it will become more closer to HTML5 <meter>
element MDN.
So try to use it the way i mentioned, do take an upgrade to 2.0 once it is available in few days.
Let me know, if it works. Ashish
@tbillion this issue has been addressed in v2.0.0. You may take an upgrade.
Im not a java programmer but i did take a crack at trying to get this to work ...
this guage in its current configuration is really only good for values 0 to 100 however it could be made much more useful for values over 100 if there was a settable property called a "divisor" basically it would take this line of code:
tail = head + (distance * value) / 100;
and replace it with this:
tail = head + (distance * value) / divisor;
i have tried to do this but i have no idea how to pass a variable from the browser to the java script, i have however been able to reverse engineer this to some extent to be updated via php. yay me...
i have attached the modified file, maybe it did it right maybe i did it wrong (more than likely) either way i cant get it to work . angularjs-gauge1.zip
obviously this would be good if you have any value over 100, for example and in my case in the arduino community we oftern measure tempuratures or rpms that are far higher than 100, and in that case we could map it to a value of percentage but then we wouldnt be able to see the actual value in the center of the gauge. with a divisor we would be able to scale the results, as long as the starting point is 0 the divisor would be the maximum value.
i have done this manually in the code and it didnt effect the functionality it actually does it quite well however i cant figure out how to use different instances of the script either or i would have just hardcoded 4 different versions of the script.
then again this feature could be the feature that sets yours apart from the rest. i was drawn to this because of the simplicity and with a simple command i could make it work with php.
example:
<?php echo "<ng-gauge type=\"{{'arch'}}\" divisor=\"100\" size=\"{{'150'}}\" thick=\"{{'3'}}\" label=\"{{'Alt. 1'}}\" append=\"{{''}}\" prepend=\"{{''}}\" cap=\"{{'round'}}\" foreground-color=\"{{'rgba(147, 0, 14, 1)'}}\" background-color=\"{{'rgba(89, 89, 89, 1)'}}\" value=\"".$row['ATach1']."\"></ng-gauge>"; ?>