› Updates › CloudFronts develops Power BI ‘DialGauge’ Custom Visual

CloudFronts develops Power BI ‘DialGauge’ Custom Visual

 18 Comments

Introduction

Power BI is a cloud-based business analytics service that enables to visualize and analyze data. Using Power BI users can spot risk, find opportunities at a glance, create personalized reports and dashboard.

Data visualizations in Power BI will allow you to interact with your data to find business insights. We can create and modify visualizations in reports and then pin to the dashboard. A variety of different visualizations like bar chart, column chart, area chart, combo charts, doughnut charts, and funnel charts, etc. can be added to Power BI reports.

With the introduction of Power BI custom visuals, developers can easily add custom visuals into Power BI for use in dashboard, reports and content packs. Custom visuals can be created for yourself and later share it with the community or can be downloaded from Power BI Visual Gallery.

Case Study

Power BI has out of the box Gauge visual available as shown in the screenshot below. But this does not suffice the requirement for one of our client that needs to have a custom visual something similar to the Gauge with a Dial. This was a necessity to successfully drive the business by analyzing data on the dashboard with the help of this custom Gauge with a Dial.

 

1

 

So, our developers had a brainstorming session and figured out how we can approach this particular requirement and meet the needs of the client. It was also a challenge and something new as it was related to Power BI and newly developer tool available for development using TypeScript. So finally after development, debugging and testing the visual, we were successful in implementing our own custom visualization named as DialGauge shown in screenshot below.

 
2

 

We have submitted this custom visualization to Power BI team for publishing to Power BI visual gallery. After verifying the same, Power BI team have published our DialGauge custom visual and currently it is available for Power BI users to download.

Description for custom ‘DialGauge’ visualization is as below:

  1. Colour indicated by red displays actual value.
  2. Colour indicated by yellow displays target value.
  3. Pointer displays any value.
  4. Null/blank/max values will be indicated by colour green.
  5. Default minimum value is 0.
  6. Default maximum value is 100.
  7. Additional label to display value. It append % sign.
  8. Name of chart will be displayed on Center of Dial Gauge.

DialGauge visual can be downloaded here.

 
Check the DialGauge discussion at Power BI blog:


Liked it? Share it.

18 thoughts on “CloudFronts develops Power BI ‘DialGauge’ Custom Visual”

  1. This visual cannot be used multiple times in one report. it does not allow for a field to identify a specific data row. it will sum the data for all gauges created…unless there is something I am not getting…

    1. DialGuage custom visual supports multiple visuals in a single report, as we have already tested. We request you to share the issue in detail along with the screenshot, so that we can help you better.

  2. Hey all,

    Love the Dial, it makes visualizing things great. A few questions/comments:

    1) The “Pointer Value” field displays the actual value below the needle. The dials that I am creating are based on a percentage and not a decimal/whole number. So currently it displays a value of like .75, but I need to convert that to say 75%, mentally it can be done easily enough, but for senior management I’d like it to be as self explanatory as possible. Is there a way to do this?

    2) The “Percentage” field – This is great for showing percentages, but I need to report on a full dollar amount, is there a way to convert this?

    3) Our company uses target threshold, which the dial gauge works perfectly. However, I have only been able to make the “acceptable” threshold show up as yellow when putting my limits in the “Actual Start” and “Target Start” categories. Is there a way to display that target range as green and the outside threshold range as a warning?

    Thanks in advance, love the visualization!

    1. Hi Andrew,

      Thanks for appreciating our Custom Visual.

      We have checked your requirement. We are sorry to inform you that it is not possible in current version. To meet the mentioned requirement, we will have to customize the DialGuage. If you have want customization, please let us know.

  3. if i want a scale of -1 (min) to 0 (max), where -1 to -.5 is red, -.5 to -.25 is yellow, and -.25 to 0 is green, what do i have to input to make it work? nothing works….

  4. Dial Gauge stopped working since yesterday Oct/3. Nothing has been changed on my Computer. The PowerBI community Reports the same issues.

    The issues is independant from Version of PowerBI and current DialGauge Version 1.0.1

    1. Hi Claus,

      The issue is due to latest version of Microsoft Power BI. Microsoft team has resolved majority of issues and is working on remaining few small issues, which you expect to be resolved soon.

    1. Hello Carlos,

      The issue is due to latest version of Microsoft Power BI. Microsoft team has resolved majority of issues and is working on remaining few small issues, which you expect to be resolved soon.

    1. Hi Macoy,

      The issue is due to latest version of Microsoft Power BI. Microsoft team has resolved majority of issues and is working on remaining few small issues, which you expect to be resolved soon.

  5. Hi there,

    I’m looking for the owner of Dial Gauge custom visual to discuss the migration to the Office store. any help would be appreciated.

    Tzvi Keisar,

    Program Manager, Power BI custom visuals, Microsoft

    1. Hi Tzvi,

      Thanks for contacting us.

      We are in touch with you on email, and we hope that soon we will be able to migrate DialGuage custom visual to Office Store.

      In case of any issue, please contact us at support@cloudfronts.com and we will rectify it, on urgent basis.

  6. Hi there,

    I truly enjoy using your custom visual, however I have one problem. The pointer value shows the values without number formatting so that the number becomes extremely long decimals. Fx. the pointer value shows 0,229999999999999999998 instead of 0,23.

    Is there any way to fix this? I already tried to do a DAX number formatting but i didn’t seem to work.

    Best regards
    Mikkel

    1. Hi Mikkel,

      Can you please download the latest Custom Visual file from Visual Gallery and use the same. We have rectified the issue in latest update. If issue still persists, then please let us know.

  7. Hi Guys,

    Love the dial gauge you built!

    Just a quick question, is there any way I can add “$” sign in front of the pointer value?

    Thanks,
    Josh

    1. Thanks for appreciating our effort.

      We are sorry to inform you that it is not possible in current version. To meet the mentioned requirement, we will have to customize the DialGuage. If you have want customization, please let us know.

      Also, we are planning to implement this in our next DialGuage update.

Leave a Reply

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload the CAPTCHA.