Giter Club home page Giter Club logo

Comments (16)

chunqiuyiyu avatar chunqiuyiyu commented on May 18, 2024

@jcubic I think you should add whitespace(' ') to single character when you want to render pie chart. Check the demo code: https://github.com/chunqiuyiyu/ervy/blob/master/demo/index.js#L23

from ervy.

jcubic avatar jcubic commented on May 18, 2024

The first is working but the second is still broken:

chart2

from ervy.

chunqiuyiyu avatar chunqiuyiyu commented on May 18, 2024

Because the ASCII characters are "rough", sometimes the size of each area cannot be calculated correctly. You must manually add a property: gapChar, for example:

const pieData = [
  { key: 'A', value: 10, style: bg('green', 2) },
  { key: 'B', value: 20, style: '$$' },
  { key: 'C', value: 30, style: bg('red', 2) },
  { key: 'D', value: 10, style: bg('blue', 2) }
]

console.log(pie(pieData, { gapChar: bg('blue', 2)  }))

Result:

image

For automatic processing programs, pie charts sometimes do not display correctly if there are too many blocks inside( your example above).

from ervy.

jcubic avatar jcubic commented on May 18, 2024

How do you know that gap need to be blue without looking the output?

from ervy.

chunqiuyiyu avatar chunqiuyiyu commented on May 18, 2024

No way to know that before the output. My suggestion is not to deal with this situation.

from ervy.

jcubic avatar jcubic commented on May 18, 2024

So you say, that it randomly create wrong results and to fix the issue, just don't create data that will create this random results?

This is definitely a bug in the library, that should handle edge cased and produce valid results, or if not it's of no use. You never know if pie chart will be correct.

from ervy.

chunqiuyiyu avatar chunqiuyiyu commented on May 18, 2024

You are right, I have fixed it in version 1.0.5. Now, gapChar would be the style of last value in renderer data.

from ervy.

jcubic avatar jcubic commented on May 18, 2024

But which entry need this, I can add option, it's no difference if I need to guess which item need this gap. This is just not consistent API. it give random values.

from ervy.

chunqiuyiyu avatar chunqiuyiyu commented on May 18, 2024

You don't need to guess it, now Ervy will auto generate the gapChar.

from ervy.

jcubic avatar jcubic commented on May 18, 2024

I've updated to 1.0.5 and it still, broken, no auto generate:
ervy2

from ervy.

chunqiuyiyu avatar chunqiuyiyu commented on May 18, 2024

How do you update the Ervy? My test for this error is passed.

from ervy.

jcubic avatar jcubic commented on May 18, 2024

I think I did, I've updated the npm package generated the file using browserfiy but it's hard to tell because you don't provide UMD so you can't use https://unpkg.com/ and you don't have version string in your code. So the file can be any version.

from ervy.

jcubic avatar jcubic commented on May 18, 2024

How to create pie correct chart with this data, can you provide the code? Do you need to pun anywhere gapChar? To be sure I've just installed gain the library and generated new file, it's the same. Are you sure that you've commited the changes it look like the diff commit is almost no different the previous code, it only get gapChar from options, there are no any auto generation.

from ervy.

chunqiuyiyu avatar chunqiuyiyu commented on May 18, 2024

Check this newest commit:b7d1bfd, I remove gapChar from options, and generate it from styles.

from ervy.

jcubic avatar jcubic commented on May 18, 2024

Sorry, I've build the file in wrong way, the pie chart is working also my demo show correct piechart.

from ervy.

jcubic avatar jcubic commented on May 18, 2024

You should update demo file since it's only documentation right now, it still have gapChar as option.

from ervy.

Related Issues (12)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.