You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@echarts.apache.org by Jon Bulalaque <jo...@apiarysolutions.com> on 2022/04/21 03:24:57 UTC

Bar Graph Question

Hi ECharts Team,

Would just like to ask if you have a sample or if the graph below is possible.

I was able to create this horizontal bar chart below. There are categories and each category has 2 tasks. If I pass a date value it will then fill the bar up to that date.

[cid:b52fc2fd-897b-45cb-94dd-28eb26f9d6d4]

Now let's say the task(s) has a start date and end date. I would like the bar to start and end on those dates. Please see the sample below.

[cid:075c4175-0908-4c8d-b246-22febc3ceed4]

Hoping to hear from your team.

Thank you,

Jon

Re: Bar Graph Question

Posted by Jon Bulalaque <jo...@apiarysolutions.com>.
Hi Steven,

Thank you for this as well. Will be looking at the code you provided.

Regards,

Jon
________________________________
From: Steven Cobb <sj...@gmail.com>
Sent: Saturday, April 23, 2022 9:34 AM
To: dev@echarts.apache.org <de...@echarts.apache.org>
Cc: Jon Bulalaque <jo...@apiarysolutions.com>
Subject: Re: Bar Graph Question

Hi! I happened to work on a similar chart awhile back and one edge case I've run into with the stacked bar transparent series approach is when a single bar needs to span from negative to positive (see discussion here<https://github.com/apache/echarts/issues/11885#issuecomment-917510076>).
That probably doesn't apply in this case, but if needed, you can use a custom series type and encode start and end values as shown here<https://github.com/sjcobb/echarts-waterfall/blob/master/waterfall.js#L82>. I could potentially update / clean up that version and submit a PR to echarts-examples if people think it's useful.

On Thu, Apr 21, 2022 at 2:34 AM Ovilia <ov...@gmail.com>> wrote:
Hi,

Here is an example: https://echarts.apache.org/examples/zh/editor.html?c=bar-waterfall
The main idea is to create a transparent series to take the empty space so that the bars can "float".

Thanks

Ovilia


On Thu, Apr 21, 2022 at 12:22 PM Jon Bulalaque <jo...@apiarysolutions.com>> wrote:
Hi ECharts Team,

Would just like to ask if you have a sample or if the graph below is possible.

I was able to create this horizontal bar chart below. There are categories and each category has 2 tasks. If I pass a date value it will then fill the bar up to that date.

[cid:1804ad2a81ecb971f161]

Now let's say the task(s) has a start date and end date. I would like the bar to start and end on those dates. Please see the sample below.

[cid:1804ad2a81ecb971f162]

Hoping to hear from your team.

Thank you,

Jon

Re: Bar Graph Question

Posted by Steven Cobb <sj...@gmail.com>.
Hi! I happened to work on a similar chart awhile back and one edge case
I've run into with the stacked bar transparent series approach is when a
single bar needs to span from negative to positive (see discussion here
<https://github.com/apache/echarts/issues/11885#issuecomment-917510076>).
That probably doesn't apply in this case, but if needed, you can use a
custom series type and encode start and end values as shown here
<https://github.com/sjcobb/echarts-waterfall/blob/master/waterfall.js#L82>.
I could potentially update / clean up that version and submit a PR to
echarts-examples if people think it's useful.

On Thu, Apr 21, 2022 at 2:34 AM Ovilia <ov...@gmail.com> wrote:

> Hi,
>
> Here is an example:
> https://echarts.apache.org/examples/zh/editor.html?c=bar-waterfall
> The main idea is to create a transparent series to take the empty space so
> that the bars can "float".
>
> Thanks
>
> *Ovilia*
>
>
> On Thu, Apr 21, 2022 at 12:22 PM Jon Bulalaque <
> jon.bulalaque@apiarysolutions.com> wrote:
>
>> Hi ECharts Team,
>>
>> Would just like to ask if you have a sample or if the graph below is
>> possible.
>>
>> I was able to create this horizontal bar chart below. There are
>> categories and each category has 2 tasks. If I pass a date value it will
>> then fill the bar up to that date.
>>
>>
>>
>> Now let's say the task(s) has a start date and end date. I would like the
>> bar to start and end on those dates. Please see the sample below.
>>
>>
>>
>> Hoping to hear from your team.
>>
>> Thank you,
>>
>> Jon
>>
>

Re: Bar Graph Question

Posted by Jon Bulalaque <jo...@apiarysolutions.com>.
Hi Olivia,

Thank you. I'll try this one.

Regards,

Jon
________________________________
From: Ovilia <ov...@gmail.com>
Sent: Thursday, April 21, 2022 2:33 PM
To: dev <de...@echarts.apache.org>; Jon Bulalaque <jo...@apiarysolutions.com>
Subject: Re: Bar Graph Question

Hi,

Here is an example: https://echarts.apache.org/examples/zh/editor.html?c=bar-waterfall
The main idea is to create a transparent series to take the empty space so that the bars can "float".

Thanks

Ovilia


On Thu, Apr 21, 2022 at 12:22 PM Jon Bulalaque <jo...@apiarysolutions.com>> wrote:
Hi ECharts Team,

Would just like to ask if you have a sample or if the graph below is possible.

I was able to create this horizontal bar chart below. There are categories and each category has 2 tasks. If I pass a date value it will then fill the bar up to that date.

[cid:1804ad2a81ecb971f161]

Now let's say the task(s) has a start date and end date. I would like the bar to start and end on those dates. Please see the sample below.

[cid:1804ad2a81ecb971f162]

Hoping to hear from your team.

Thank you,

Jon

Re: Bar Graph Question

Posted by Ovilia <ov...@gmail.com>.
Hi,

The doc is available at
https://echarts.apache.org/en/api.html#events.Mouse%20events.contextmenu

It should be called like
chart.on('contextmenu', function () { ... });

Thanks

*Ovilia*


On Thu, May 5, 2022 at 9:03 AM Jon Bulalaque <
jon.bulalaque@apiarysolutions.com> wrote:

> Hi Olivia,
>
> Would just like to ask if you have a sample of how to add context menu to
> the graph. Having a hard time finding one.
>
> Thank you,
>
> Jon
> ------------------------------
> *From:* Ovilia <ov...@gmail.com>
> *Sent:* Thursday, April 21, 2022 2:33 PM
> *To:* dev <de...@echarts.apache.org>; Jon Bulalaque <
> jon.bulalaque@apiarysolutions.com>
> *Subject:* Re: Bar Graph Question
>
> Hi,
>
> Here is an example:
> https://echarts.apache.org/examples/zh/editor.html?c=bar-waterfall
> The main idea is to create a transparent series to take the empty space so
> that the bars can "float".
>
> Thanks
>
> *Ovilia*
>
>
> On Thu, Apr 21, 2022 at 12:22 PM Jon Bulalaque <
> jon.bulalaque@apiarysolutions.com> wrote:
>
> Hi ECharts Team,
>
> Would just like to ask if you have a sample or if the graph below is
> possible.
>
> I was able to create this horizontal bar chart below. There are categories
> and each category has 2 tasks. If I pass a date value it will then fill the
> bar up to that date.
>
>
>
> Now let's say the task(s) has a start date and end date. I would like the
> bar to start and end on those dates. Please see the sample below.
>
>
>
> Hoping to hear from your team.
>
> Thank you,
>
> Jon
>
>

Re: Bar Graph Question

Posted by Ovilia <ov...@gmail.com>.
Hi,

Here is an example:
https://echarts.apache.org/examples/zh/editor.html?c=bar-waterfall
The main idea is to create a transparent series to take the empty space so
that the bars can "float".

Thanks

*Ovilia*


On Thu, Apr 21, 2022 at 12:22 PM Jon Bulalaque <
jon.bulalaque@apiarysolutions.com> wrote:

> Hi ECharts Team,
>
> Would just like to ask if you have a sample or if the graph below is
> possible.
>
> I was able to create this horizontal bar chart below. There are categories
> and each category has 2 tasks. If I pass a date value it will then fill the
> bar up to that date.
>
>
>
> Now let's say the task(s) has a start date and end date. I would like the
> bar to start and end on those dates. Please see the sample below.
>
>
>
> Hoping to hear from your team.
>
> Thank you,
>
> Jon
>