search

swimlane / ngx-charts

:bar_chart: Declarative Charting Framework for Angular
https://swimlane.github.io/ngx-charts/
MIT License
4.3k stars 1.15k forks source link

Combo-chart with multiple bargraphs #533

Open harald opened 7 years ago

harald commented 7 years ago

I'm submitting a ... (check one with "x")

[ ] bug report => search github for a similar issue or PR before submitting
[x] feature request
[ ] support request => Please do not submit support request here

I have found the combo-chart in your demo section helpful in understanding your concepts. However, I have not been able to figure out yet how to extend the sample combo-chart such that it supports multiple bargraphs.

I assume it's a fairly simple change. I'd be very grateful if somebody could help me with this. Thanks.

marjan-georgiev commented 7 years ago

Can you explain what you mean by multiple bargraphs please?

seekheart commented 7 years ago

I think @harald means he would like to have multiple bar charts on the same page? something like (dummy code here)

<ngx-charts-bar-vertical></ngx-charts-bar-vertical>
<ngx-charts-bar-vertical></ngx-charts-bar-vertical>

where each ngx-charts-bar-vertical has different data?

JoshSchoen commented 7 years ago

@harald I'm guessing you are looking for something like the below image? If so I am finalizing one that I need for a project and I can create a PR to place it in the demo section "soonish". Need to work out a few more issues with the line position relative to the bars. That said, it's actually pretty straight forward if you use the combo chart example https://swimlane.github.io/ngx-charts/#/ngx-charts/combo-chart and replace the bar chart code with the grouped vertical bar chart. Of course there's a little more to it but it's all there to be had. It's really great they expose all of the components needed to create complex charts such as this.

I will try and create a PR for this in the next week for so when I can get to it.

screen shot 2017-09-19 at 10 24 59 pm
anishgomez commented 7 years ago

Please provide an example for implementing Combo Charts. You have a demo for this. But how to implement this is no where provided in any documentation. Please dont mislead the developers. If you cant provide any doc remove it from your demo.

burzum619 commented 6 years ago

@JoshSchoen Did you ever create a PR or do you happen to have an example of how you made the grouped bar chart work with a line graph combined?

I've had a ton of trouble getting this to work. I even created an issue for it a few months ago for which I still have not received any response for: https://github.com/swimlane/ngx-charts/issues/694

Specifically, none of the HTML that's inside of my element is being rendered (specifically, the line chart). I do see my bar charts appear, but no line-chart series. If you can provide an example of how you got it to work, that would be immensely helpful!

jeniferseb commented 6 years ago

@burzum619 did you get this to work? Im trying to create a stacked bar chart with line chart.. but not sure how I switch out the bar chart provided in the demo with the stacked bar

amejiarosario commented 4 years ago

@JoshSchoen @marjan-georgiev @Hypercubed any update on this? I'm also looking for a way to create multiple bar charts with two y-axes like the image below: image

kinjalpgor commented 4 years ago

@harald I'm guessing you are looking for something like the below image? If so I am finalizing one that I need for a project and I can create a PR to place it in the demo section "soonish". Need to work out a few more issues with the line position relative to the bars. That said, it's actually pretty straight forward if you use the combo chart example https://swimlane.github.io/ngx-charts/#/ngx-charts/combo-chart and replace the bar chart code with the grouped vertical bar chart. Of course there's a little more to it but it's all there to be had. It's really great they expose all of the components needed to create complex charts such as this.

I will try and create a PR for this in the next week for so when I can get to it.

screen shot 2017-09-19 at 10 24 59 pm

have you had any luck with resolving your issue? I'm having a similar problem with creating a grouped vertical bar/line combo chart.

davidenriquez commented 4 years ago

@harald I'm guessing you are looking for something like the below image? If so I am finalizing one that I need for a project and I can create a PR to place it in the demo section "soonish". Need to work out a few more issues with the line position relative to the bars. That said, it's actually pretty straight forward if you use the combo chart example https://swimlane.github.io/ngx-charts/#/ngx-charts/combo-chart and replace the bar chart code with the grouped vertical bar chart. Of course there's a little more to it but it's all there to be had. It's really great they expose all of the components needed to create complex charts such as this.

I will try and create a PR for this in the next week for so when I can get to it.

screen shot 2017-09-19 at 10 24 59 pm

Hi @JoshSchoen , I need to implement the combo with group bar vertical + line. Do you have any repo / sample please ?

atj393 commented 4 years ago

@harald I'm guessing you are looking for something like the below image? If so I am finalizing one that I need for a project and I can create a PR to place it in the demo section "soonish". Need to work out a few more issues with the line position relative to the bars. That said, it's actually pretty straight forward if you use the combo chart example https://swimlane.github.io/ngx-charts/#/ngx-charts/combo-chart and replace the bar chart code with the grouped vertical bar chart. Of course there's a little more to it but it's all there to be had. It's really great they expose all of the components needed to create complex charts such as this. I will try and create a PR for this in the next week for so when I can get to it.

screen shot 2017-09-19 at 10 24 59 pm

Hi @JoshSchoen , I need to implement the combo with group bar vertical + line. Do you have any repo / sample please ?

Hello @davidenriquez , Have you create the Stacked Bar+Line combo chart?

Nurech commented 3 years ago

@harald I'm guessing you are looking for something like the below image? If so I am finalizing one that I need for a project and I can create a PR to place it in the demo section "soonish". Need to work out a few more issues with the line position relative to the bars. That said, it's actually pretty straight forward if you use the combo chart example https://swimlane.github.io/ngx-charts/#/ngx-charts/combo-chart and replace the bar chart code with the grouped vertical bar chart. Of course there's a little more to it but it's all there to be had. It's really great they expose all of the components needed to create complex charts such as this.

I will try and create a PR for this in the next week for so when I can get to it.

screen shot 2017-09-19 at 10 24 59 pm

Hello! Did you ever get making the combo grouped bar chart with lines?

RicardoVaranda commented 2 years ago

Any updates on this? @JoshSchoen I'm also trying to achieve something similar to what @harald is describing. A stacked vertical chart with a line chart on top sadly with no luck. I've looked at the combo chart example but seeing as it's a one off example it doesn't give a good indication of what needs to be changed if we want to swap the conventional bar chart into a different one and vice versa.