-
Notifications
You must be signed in to change notification settings - Fork 395
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
When using MinPath on RadialGauge jumps #190
Comments
I am also getting something like this. Some additional information: with useMinPath: true the needle seems to start off going quickly in the wrong direction when the value changes (i.e. longest path) before correcting itself and animating its way to the correct value via the short path. This does not happen with useMinPath: false. These are nice gauges, thank you. I hope this little glitch can be easily fixed. EDIT: Looking carefully I see the same effect on the use minimum path example page.
|
I expierence the same issues. Solved it for the time being writing some extra javascript.
Here is the compass at page loading
|
Have utilised the below code that adjusts the needle according to a value I parse to it with jquery however I would now like to utilise "useMinPath" so that the needle does not need to go the long way around the 360 radialGauge. The needle however now jumps to the value provided instead of providing a smooth transition.
Any suggestions?
<script> var gaugePS = new RadialGauge({ renderTo: 'gauge-ps', width: 210, height: 210, minValue: 0, maxValue: 360, majorTicks: [ "N", "NNE", "NE", "ENE", "E", "ESE", "SE", "SSE", "S", "SSW", "SW", "WSW", "W", "WNW", "NW", "NNW", "N" ], minorTicks: 22, ticksAngle: 360, startAngle: 180, strokeTicks: false, highlights: false, colorPlate: "#222", colorMajorTicks: "#f5f5f5", colorMinorTicks: "#ddd", colorNumbers: "#ccc", colorNeedle: "rgba(240, 128, 128, 1)", colorNeedleEnd: "rgba(255, 160, 122, .9)", valueBox: false, // valueInt: 3, // valueDec: 0, valueTextShadow: false, colorCircleInner: "#fff", colorNeedleCircleOuter: "#ccc", needleCircleSize: 15, needleCircleOuter: false, animationRule: "linear", animationValue: true, needleType: "arrow", needleWidth: 2, borders: true, borderInnerWidth: 0, borderMiddleWidth: 0, borderOuterWidth: 1, title: "DIRECTION", **useMinPath: true,** colorBorderOuter: "#ccc", colorBorderOuterEnd: "#ccc", colorNeedleShadowDown: "#222", borderShadowWidth: 0, animationTarget: "needle", animationDuration: 1500, }); gaugePS.draw(); </script>
The text was updated successfully, but these errors were encountered: