c3js/c3

A D3-based reusable chart library

Yauheni

@muspelheim

how i can change color in bar label and relocate inside bar?

for example bar have #000 color, i want label color #fff

Gunnar Oledal

@Dealerpriest

Hello! Is it possible to have column set the color of a scatter point?
If I have:

data: {
                x: this.plotData[0][0],
                columns: [
                  this.plotData[0],
                  this.plotData[1],
                  this.plotData[2],
                ],
                type: 'scatter',

I want the first column to be x-axis (works fine). The second column is y-value. The third should be mapped to a color gradient that determines the color of the rendered scatter points. Is this possible?

Dennis Oosterling

@Dennisoost

@muspelheim you can change the c3.css

Gunnar Oledal

@Dealerpriest

Herro! How can I change the opacity of the points in scatter plot? They default to 0.5 in alpha and it's set inline...

VoidVolker

@VoidVolker

@Dealerpriest mb via stlyes?

hey, I released new tool to watch files/directories changes and execute commands: https://www.npmjs.com/package/nano-watcher - it is small and simple, can work on mounted FS and VBox share, can run numerous commands with any arguments in any directory

Marcin Lulek

@ergo

@Dennisoost yeah, unloading doesnt really help too much, seems something is not being reset correctly on unload. I ended up recreating the chart object completly for the time being.

Kenneth Bier

@kenbier

I am seeing some weird behavior when rendering pie charts (with other charts on the page in particular).

This message was deleted

stacktrace here: https://gist.github.com/TheSeldonPlan/3f009fd9d671b43b5fc0e6c402e8c23b

Kenneth Bier

@kenbier

it seems to be related to timing and only happens to chart types with arcs. when the page loads quickly (i.e. turning caching on exposes the bug) and a pie chart is on the page, this exception is thrown and all the charts are missing their data points. though the mouse over events and tooltips still work

Kenneth Bier

@kenbier

having loads to close to each other seemed to be causing the issue (even with unload set to true).

triesco

@triesco

My charts dont always render correctly. Sometimes its missing one bar and when refresh it works. Any ideas?? Thanks!

Brett Taylor

@Glutnix

Hi, I'm getting a really weird error: "$$.main.select is not a function"

I'm using c3 to generate a very small 20x20 pie chart

It's working in isolation, but within a Vue component, i'm getting "$$.main.select is not a function" when I call chart.load({columns: [...]})

it's happening inside

c3_chart_internal_fn.updateTargetsForText    @    main-99934de582.js:9507
c3_chart_internal_fn.updateTargets    @    main-99934de582.js:6541
c3_chart_internal_fn.load    @    main-99934de582.js:8383
c3_chart_internal_fn.loadFromArgs    @    main-99934de582.js:8407
c3_chart_fn.load    @    main-99934de582.js:12422

(excuse the source line numbers)

Christian Johns

@xtianjohns

Does anyone have experience configuring arc padding in C3 for donut charts? It looks like D3 defaults to zero, but C3 charts look like they have a little gap between slices in a pie chart and/or between the arcs in a donut.

I don’t see any special padAngle() methods in C3, but I’m a little out of my depth about whether that sort of thing can be modified by CSS.

VoidVolker

@VoidVolker

@xtianjohns open dev tools and check style

Christian Johns

@xtianjohns

@VoidVolker: is there a specific selector you know of that controls that arc padding? Like I said, I’m no expert on the selectors themselves, but my inspection didn’t turn up anything that seemed like it would control the relationships between the arcs.

Christian Johns

@xtianjohns

It looks like stroke-width is the selector to look for. If anyone else is interested in eliminating these, finding those elements in the SVG for your component and updating the width to 0 should do the trick.

Christian Johns

@xtianjohns

stroke-width is the property, rather. You can use whatever selectors you want to target your chart.

Juan Mejia

@nice00xt

hi everyone

i have a question about c3 options

¿is there any option to set the Axis X on top the graph, because I am currently setting this with a javascript line, but I'm looking for another form to do this

i tried with css first but, this is set with a transform attribute in the axix X element, and i cant not to set its position with css

Alex

@lifecoderua

@nice00xt I had issues with CSS translatenotations which uses only one dimension (x/y), but regular translate(x, y) works fine. Also inline svg styles are used as default, they don't overlap css-driven rules. The only drawback is the css translate doesn't add to the inline one, so you should provide a full translation, not a partial against current position.

Hanuma

@hanu412

Hey There

I need some help with the bar chart..Is anyone around online now?

Hanuma

@hanu412

I need to have some spaces in between the bars in the above chart..Is there a way to achieve this?

What property could get me that?

Joe Seifi

@joeseifi_twitter

Is there any way to set a custom legend without using the imperative approach shown here? http://c3js.org/samples/legend_custom.html I'm looking for perhaps setting up a reusable template etc?

Kenneth Bier

@kenbier

is there a simple way to sort tooltips alphabetically rather then by value?

Michael Watson

@node-monk

Tooltip Performance issues. Here is my setup. 2 pie charts and a bar chart — tooltips are really responsive when mouseover. Add a 3rd pie chart to the mix and the third pie chart has really slow lag time when showing tooltip, but other charts still are fast.

Remove one of the other pie charts, and the last chart is fast again. Chrome shows “forced reflow is like performance bottleneck”.

This sound like anything you guys have experienced before?

Tiago Costa

@mistic

Hi guys

do you know how to render point bullets on top of x-axis if every points have y=0?

currently the bullets are hidden for 50% by x-axis

as you can see on the screenshot

Jago Kosolosky

@Jago-Kosolosky

Hi everyone, I was wondering if someone knows how I can make a subchart disappear and appear again on a click event. Should be easy but I'm really having trouble figuring it out... http://c3js.org/samples/options_subchart.html

Jago Kosolosky

@Jago-Kosolosky

Managed to do it with jquery but I have to assume there is a better way

Kenneth Bier

@kenbier

i am trying to write my own tooltip, and i am having trouble getting the x offset of each tick

http://c3js.org/reference.html#tooltip-position

i grab the x attribute off the passed in element to the tooltip position, and i left to x

which should, in theory, align the left edge of the tooltip with the selected x tick

but it does not, and i seems the x value is not precise

is there a better way to get the x offset rather than calling $$.x(some-x-value) ?

Where communities thrive

People

Repo info

Activity