Comments (5)
Hi @StefanoBettega, thanks for the feedback. I'll see if I can work on these. Meanwhile, please feel free to submit a merge request if you can :)
from svg-gauge.
Hi @StefanoBettega,
The first two points can be solved using following workarounds:
- Set a fixed width and height to gauge container and wrap it inside another smaller container with overflow as hidden
- To show floating point values provide a label render using
label
function option. It gets the raw value. The default implementation rounds the value.
The third is a bit more involving and would also make the gauge overly complicated. With a lot more options. This gauge's objective is to remain compact and simple. Feel free to fork and implement it :)
Cheers!
from svg-gauge.
Hi @StefanoBettega
I've updated the demo reflecting some of the changes you wanted.
from svg-gauge.
Hi,
How would one greate a gauge like number 4 in the demo, but with the possibility of the gauge value to exceed the maximium (represented by the 'dial' in css)? I mean that the underlaying border will still be a 1/4 circle while the gauge value can exceed to be a 1/2 circle.
Thanks for a really great project!
from svg-gauge.
Hi @schlunsen,
Unfortunately, that's not possible in this gauge. But a "poor man" solution would be to have dial color same as background color and have a full circle gauge dial.
The gauge options once set don't change (except value). I'll look into this if possible. Meanwhile, you are free to fork and make the changes ;)
from svg-gauge.
Related Issues (20)
- Experiencing a ReferenceError: k is not defined (gauge.js) HOT 5
- Animations not working in React HOT 3
- Gauge label transform not working on Safari HOT 3
- CSS for value-text not working HOT 1
- Use in a vue component? HOT 6
- Is it possible to display decimals in labels HOT 1
- Error: <path> attribute d: Expected number, "β¦0 A 40 40 0 1 1 NaN NaN". HOT 5
- Color Text Value
- Add Min/Max labels? HOT 1
- Dynamic setMaxValue HOT 2
- In the old webview, the number display position is wrong HOT 2
- -
- Add TypeScript types HOT 5
- SetMaxValue does not update the label if "this.max" is used in the label HOT 2
- Floating Point Number HOT 1
- function getGauge(myHtmlElement) like. HOT 1
- Gauge is not defined HOT 4
- Changing the direction of animation HOT 4
- Ticks support
- Decimal places and ΒΊC symbol HOT 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 svg-gauge.