Giter Site home page Giter Site logo

microsoft / powerbi-visuals-gantt Goto Github PK

View Code? Open in Web Editor NEW
111.0 36.0 102.0 1.78 MB

A Gantt chart is a type of bar chart which illustrates a project timeline or schedule. The Gantt Chart visual shows the Tasks, Start Dates, Durations, % Complete, and Resources for a project. The Gantt Chart visual can be used to show current schedule status using percent-complete shadings and a vertical "TODAY" line. The Legend may be used to group or filter tasks based upon data values.

License: Other

JavaScript 0.57% TypeScript 98.31% Less 1.13%

powerbi-visuals-gantt's Introduction

powerbi-visuals-gantt

Build Status Coverage Status

A Gantt chart is a type of bar chart which illustrates a project timeline or schedule. The Gantt Chart visual shows the Tasks, Start Dates, Durations, % Complete, and Resources for a project. The Gantt Chart visual can be used to show current schedule status using percent-complete shadings and a vertical "TODAY" line. The Legend may be used to group or filter tasks based upon data values.

Gantt chart screenshot

Overview

Gantt chart is a type of bar chart to illustrate a schedule with time axis. When you put Gantt chart along with other insightful charts in an interactive canvas, you can manage your project in whole new way. In Power BI as visuals interact with each other, you can look at your resource allocation, task completion, remaining tasks in different perspective and get a firm handle on the future. Gantt charts are indispensable part of project management portfolio. Project Managers and executives love Gantt charts, since they visually show in a very effective at-a-glance way, the overall time line of the project, the current status & progress (or lack thereof) along with the assignment at considerable details. With this custom visual, you can specify the Tasks, Start Date, Duration and %Completion for rendering them as Gantt. Please note that the %Completion expects a decimal value ( for example 0.85 means 85%) and Start Date , a date field and not a date hierarchy. You can also control the color of the bar with a Legend. You can use any relevant field from your project as Legend for example task type for this purpose. Additionally, you can also specify the resource field, which would be listed next the bar in the Gantt.

See also Gantt chart at Microsoft Office store

powerbi-visuals-gantt's People

Contributors

avisander avatar eugeneelkin avatar ignatvilesov avatar microsoft-github-policy-service[bot] avatar mrmeison avatar mulyukovaidar avatar mvgaliev avatar pbicvbot avatar savvinsergey avatar uve avatar vtkalek avatar zbritva avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

powerbi-visuals-gantt's Issues

Feature Request

Labels for task/parent should be introduced - the task/parent relation could then be done using a key but showing a label

Users to be able to control the time scale

Please add a possibility for the report user to adjust the time-scale. This can either be by having the time-scale adjusted by a parameter to the visual, or if possible, adding graphical controls within the visual. If implemented, I would suggest that all current scale-settings shall be available: Second, Minute, Hour, Day, Week, Month, Quarter, Year, but also a + and - setting to increase/decrease the scale. I would also suggest an auto scale setting

Justification:
As a report developer you can set the time scale by adjusting the "Type" attribute in the "Date type" setting to Second, Minute, Hour, Day, Week, Month, Quarter, Year. Letting the report user adjusting the filters, the report developer does not know what time-scale would be the best. The "Type" attribute is not accepted as an input variable so there's no way for the report developer to enable this for the user

This feature request is somewhat aligned with the Stretch feature that HairyDrumroll suggested, but has a different angel

How to modify DATE to COUNT?

Hello,
Thank you for this awesome visual! Will you give me some direction on how I can edit the source to change the X axis from a DATE to a COUNT?

I want to show basic spatial overlaps / alignments, rather than time-based. Literally EVERYTHING stays the same, just instead of dates across the top, I need counts.

Example:

  • Construction: Start: 1.3, End: 7.8, Duration: 6.5
  • QA: Start: 2.5, End: 3.5, Duration: 1.0
  • Compaction: Start: 1.3, End: 5.3, Duration: 2.0
  • Etc.

I don't know where to start in the source code to make these changes myself. Any guidance?

Thanks again!

Tooltip doesn't work in Power BI Service

Tooltips work well in Power BI Desktop however when publishing the report the tooltips stop working as they should. To be clear attached an image in which is observed as the content of the tooltip does not change when moving the cursor to another task of the graph.

Please help us understand and discover why this error is due.
issue pbi

unable to make a package

i m unable to make package when i modified the code . It becomes the same old code while running "pbiviz package" command.

Typo in const selectionBuider

In gantt.ts there is a const with the name selectionBuider

not important, but it would be appreciated if it was spelled correctly :-)

selectionBuilder

Feature Request(s)

When using the Parent-feature it should be possible to specify collapse (or expand) as default - consider using +/- in stead of the arrow - might be more common and aligned with what will hopefully come in the matrix-table

The time-axis should have an option to enable automatic adjustment between earliest start and latest end (and scale the Date Type appropriately.

Fractions of a day

As I can see, the Bar will start at not only the Year/Month/Day, but also the hour/minute/second defined with the value in StartDate.
But the duration is always truncated to down to a integer (Whole Number)

Due to this, the bars are sometimes left empty as seen below
capture

My data looks something like below:
capture
My suggestion is to allow and correctly handle fractions of a day, also for the Duration.
I understand that in case of durations of just some minutes or seconds, it will be hard to see that time-slot, but that is the same problem as we have with other diarams, e.g. the Pie diagram

Changing Color for the legend

Hi,
It seems impossible to change the color and it really damaged the visual which is great btw. Would it be possible to add a feature to change that ?
gg
And also concerning the timeline would it be possible to have the number of the week above the timeline when we choose the week scale ? It would be a great feature too.
Thx in advance

custom visual stays blank after 'PBIVIZ start' (gantt chart)

Hi All,
I am trying to clone the gantt chart from github, after I clone it to my VS Code, I ran the 'npm install' and also installed the [email protected]. when I try the 'pbiviz start', everything seems fine but the visual stays blank even I put data in.

Being very new to the custom visual and wonder which step I did was wrong. I would really appreciate if anyone give me any advice on how to clone the project to local and run it.

image
image

Feature Request

When using the Parent-functionality, the expansion arrow is added to he right-hand side of the task-text - in case of long texts the expand/collapse arrow is not visible. Could be solved by moving it to the left-hand side or by always showing it at the right hand side (adding the arrow after substringing the text)

Stop date as an alternative to duration

Sometimes it's more convenient to specify a stop date-time instead of a duration. This stop date shall as the start date-time have a resolution of at least seconds. The code change is self is quite easy, and I have done it my self, but the trick is to define how this should be implemented in the GUI. Shall it be 1) a property setting defining if a value represents duration or stop time, or shall it be 2) two different fields where you can choose one (and only one) of them. Or 3) shall the current duration field be changed to Duration/StopTime and then the code determines if it's a duration or StopTime

My suggestion is (3) but I need some comments and maybe some code help for that since I'm far from native in java script

top timeline position

How can i set a left margin for the upper timeline? Is there any possible way to reposition the timeline from the labels? Thank you for your answer.

Roadmap

thank you for the recent updates! I really like them :-)

I have made some updates to the source files and the capabilities.json (drawing the X-axis, the labels, wordbreaking category labels, relative dates and timeframe for the X-axis, etc.)

Do you expect to launch new versions in the coming days? Or can I integrate my suggestions into the published file ? :-)

Legend changes color after loading to Power BI report service

Hi there
Having created a report using slicers and the gantt charts (great visual btw) - the legends on the gantt chart changes color when loaded onto power BI report service.

How can I make the legend colors 'stick'?

In the following screenshot showing the two reports - the top area is from the Desktop version which shows Tauranga in red.
In the bottom (in Service), you can see it has changed to aqua.
image

On the format of the visual on the desktop it is set as follows:
image

However after being published when I edit in there it shows up as the following:
image

Is there a way I can ensure my legends stay the same color as what is in the desktop report.
Appreciate any help. Thanks

Enhancement Request

Can you add a setting the the formatting for Resource Settings or simply a toggle switch for cutting off characters? I would like to be able to display the full field and not only 13 characters. This would be monumentally helpful. Thank you.

CRITICAL: Gantt chart not filtering based on slicer

I have found an issue with the Gantt chart visualization. When I have a slicer where one element on the slicer has data that is shown in the Gantt chart, but when I change for another element on the slicer with no data for the Gantt chart, then the Gantt chart will not be shown blank, but instead it will show the data from the previous element that had data inside.

Please see attached picture for further description.
2017-10-31_15-01-38
2017-10-31_15-03-45

Duration seems wrong

I used the visual with Aug 1, 2017 as start date with 60 days Duration (I am assuming that these are workdays??) ... I expanded the visual out and the bar stops on Dec 09, 2017

Consider start date Aug 1, 2017 and end date 9 December, 2017,
Using excel function networkdays() tells me that there is 84 work days between, and there is 130 days between including weekends.

I noticed that this is wrong because %Complete is always behind today ...
i.e Say a task takes 10 days ... and I am 5 days complete and mark %Completion at .5 (50%) then it still doesnt reach today

Modify Gantt Date type

I would like to modify the Gantt chart to allow for Gantt Date types Hour and 15minutes.

Can you point me in the right direction on what I would need to update to allow this functionality?

Start Date as date/time as a hierarchy

This might be a very specific request to reduce the data model size. But if the Start Date (and End Date) accepted a date/time hierarchy with a separate date and separate time columns, the carnality of the data in the data model could be reduces. In my case I have a +30 Million row dataset where the dateTime column takes most of the space

If this is not possible in the visual, please close this

Cannot sort data anymore

Since some time, it's not possible to order data in the Gantt visual.
It used to be possible by clicking on the options menu (this one:)
immagine

But this option is no longer available.
Unfortunately, the Gantt visual component ignores any order set on the data.

Chart doesn't stretch to fill window - a problem for multiple activities within a day

Hi, Thanks for continuing your work on this!
I'm looking at a 1 to 14 day horizon of events with up to 20 events per day.
Unfortunately, even if I make the visualisation frame as wide as the report page, if there is only a few days of activity in my data set it all gets squished in to the top left corner.
Is there any possibility for the distribution of days across the top to be scaled to fill the width of the frame?
image
Thanks again for your work.

HD.

Modify Gantt Font family

I would like to be able to change the font family from Gantt, so it can match my whole report. Can you please help me?

Start date doesn't accounted.

Hi, i'm using the gantt visualization to manage the vacations periods in days, but when i visualize in Power BI, End Date doesn't represent the real date wich the vacation must end, analizing looks like the Start Date doesn't accounted for the task duration, wich make the vacation have one more day. Is possible to make the Start Date be day one(not Zero) for task durantion? Images for example.
The language in some parts is Brazilian Portuguese.

How show in the Gantt chart:
taskgantt
The date the vacation must end according with HR table:
taskgantt1

IE11 category sizing issue

In a visual with relatively wide category column (350 px) there's a sizing issue - it displays ok in modern browsers but in IE11 horizontal scrollbar appears underneath although both category and the timescale fit on the screen. This doesn't seem to happen if category width is reset to default value of 95px but once it passes ~200px threshold it becomes visible again.

Day line for today

It could be great to have a vertical line to show in witch date we are today regarding the total planning

Gantt doesn't support Duration of hours/minutes/seconds/miliseconds

Hi,

It seems that Gantt doesn't support a less than a day duration, although it enables to change to 'Date Type' to: Second, Minute, Hour, etc.

image

I wish to create a Gantt chart with start date (DateTime format) and a duration of (seconds/ minutes/ hours) in Duration type (as in Power BI).

I have this columns of Start Time (DateTime) and Duration (Diff):

image

Gantt's chart looks like that:

image

I can't see the bars in Minutes/Seconds resolution. Only If the duration is more the 1 day.

Can someone tell me if it is possible with Gantt's version in Power BI nowadays and if not how can I do this other way? and if it will be fixed in the future?

Thanks.

Multiple Fields in Task

I want to be able to add more specific information to the Gantt chart visual to look more like this:

**Cluster ABC** 

    Country A 
         Project A
              Business critical Milestone A  -  Start/end  (this is where the bars would be displayed)
              Business critical Milestone B  -  Start/end
              Business critical Milestone C  -  Start/end
         Project B
              Business critical Milestone A  -  Start/end
              Business critical Milestone B  -  Start/end
              Business critical Milestone C  -  Start/end

    Country B
         Project A
              Business critical Milestone A  -  Start/end
              Business critical Milestone B  -  Start/end
              Business critical Milestone C  -  Start/end
         Project B
              Business critical Milestone A  -  Start/end
              Business critical Milestone B  -  Start/end
              Business critical Milestone C  -  Start/end

Currently I'm unable to do that--I can only show a general task-based version of the gantt chart. I was able to just concatenate the names together through PowerBI, but that looks incredibly sloppy. Would love to have it built into the current visual.

I want to dig into the code to figure out how to do so, however I'm fairly new at customizing Power BI visuals and still a little rough with TypeScript. Would it be possible to add this functionality to the Gantt chart visual in the future?

Feature Request: Grouping of tasks

We have a client that likes to group his tasks by Levels (eg. Functional / Non-Functional / Administrative Tasks)

That would be a very nice addition to the Gantt Chart :)

Resource lables and legend color when using the "Resource" parameter and grouping tasks

If I choose to add Resource labels when I also group the tasks, the visual does not work as expected

Resource Labels:

I can configure the "Full text" as well as the "Width by task" settings in the "Data Labels" menu. But if I enable both these settings, the "Full text" setting are overriding the "Width by task" setting as seen below.
image
Not using the "Full task" setting will truncate even the last occurrence of the text as seen below
image
My suggestion is that the "Width by task" setting will override the "Full task" setting so that the first labels can be truncated, but not the last one

Legend colors:

When I add data to the Resource parameter, the Legend color disappears, i.e. only one single color is used. As seen in the picture below, only one color are used and that can also bee seen in the control.
In my case, I used the same data for "Resource" as I used for "Legend", but I don't know if this effects the behavior. The reason for adding Legend data also as Resource was to make the visualization more verbose (not having to hover to see the data). But as the colors now are the same, I didn't get the expected result
image
As also can be seen in the picture above, the Legend list at the right are now empty, just containing a green dot. I guess this is somehow connected to that there is only one color

Maybe a solution is to enable the possibility to have Legend data shown as Data labels. In that case I would not have to add anything in the Resource parameter and that would probably let me keep the legend colors. If this is a solution, please add a checkbox in the "Data Labels" menu for choosing if Legend data or Resource data shall be used as Data labels.

Additionally

The "Date type" menu item is kind of hard to understand. It's more of a scale and axis setting. My recommendation is to rename it to "Scale" and also rename the "Type" attribute to "Time scale" or something equal
image

Time Scale

It would be great to have the number of the week in the time scale as an option.

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.