simeydotme / donutty Goto Github PK

You mention that the radius can be set to responsive using css. What value needs to be set to make this work?

Hi
amazing library. thanks for your work.

however i ran into an issue with ie11
classList.add is unsupported.

using the polyfill fixed it.

https://developer.mozilla.org/de/docs/Web/API/Element/classList

Would be nice to have this documented or added to the lib.

thanks again for your work.
alex

Hey, thanks for creating Donutty. Really helpful.

I just wanted to bring this to your attention. It would be great if SVGs were accessible. Here's a link to making inline SVGs accessible.

Basically, it would be helpful if there was another option "title" which would be added inside SVG as the first child of its parent as a <title> tag with a unique ID. Then, <svg> would also get aria-labelledby with the unique ID and also role="img".

Although not necessary, it would also be helpful if <desc> was added too. The article explains all of this.

Thanks a lot!

Just thought I'd document some strange display issues on Firefox I ran into. The SVG donut wasn't displaying properly (like it was not fully rendering or being clipped).

Screen recording:

Issue found in Firefox 91, worked ok in other browsers I tested.

It seems related to the transform attribute on the SVG element.

Overriding the transform attribute by setting transform: scale(1) on the svg (via my CSS) fixed the issue. Strangely setting transform: none didn't work.

P.s I was able to replicate the issue somewhat in the codepen demo (didn't occur as often or as badly):

in safari, svg's are rotated.
in chrome ok.

each is the latest version.

Hey there,

Can one chart have multiple values? Like this: screenshot

Thanks!

When I tried to concatenate the chart element as a string into a div element using innerHTML property, the chart doesn't renders. I initialized it using CDN.

if a chart is initiated without text set, then the _this.$text.style.transition line of code fails and causes unhandled exception

Is anyone working on adding an option to allow for anchoring the track at the top of the donut rather than the bottom?

... on ajax loaded page? I'm using it with data attributes.

clockwise direction option

right now the pie chart is start from left to right can you add the option to show circle from right to left please .

Is it possible to add gradient color support for the progress bar?

import 'donutty/dist/donutty';

and how to init?

donut display is chopped on left and right, in Firefox. I'm unable to see where this is controlled.

When using donutty.js (without jquery) any attempt to initialize donutty will throw an error:

Uncaught TypeError: Cannot read property 'style' of undefined
at win.Donutty.donutty.animate (donutty.js:235)
at win.Donutty.donutty.insertFragments (donutty.js:186)
at win.Donutty.donutty.init (donutty.js:78)
at new win.Donutty (donutty.js:59)
at donutty.js:348
at NodeList.forEach ()
at HTMLDocument.initialise (donutty.js:345)

Even very basic example <div data-donutty></div> will fail.

It's related to the text option, which is always false somehow in that script.
Could that be fixed? You may have a look at my fixed version of donutty.js here: https://www.diffchecker.com/gi42wjgz