Skip to main content

Notifications

Power Apps - Building Power Apps
Unanswered

What are some of the best ways to design charts in Power Apps?

Posted on by 4
Hi, 
 
I'm looking for some of the best approaches to building or designing charts in Power Apps. 
The out of box charts do not provide enough options and improvising using Power Apps' built in control can be clunky. 
What are some of the best ways to design charts in Power Apps?

While researching I came across this quickchart io site that came a bit close and was wondering what others recommend on here.

Thank you.

Sample code:
//The expense of the item/Total amount of the budget
With((Percentage: ThisItem.Expense/Sum(Filter(ExpenseByCategoryCollect, BudgetId =Gallery1.Selected.BudgetId),Expense)*100},
 
 
 
    "{ 
type: 'radialGauge',
data: {
datasets: [{
data: ["& Percentage &"],
backgroundColor: getGradientFillHelper( 'horizontal',[' red', 'blue']),
    }]
    },
)1
options:{
domain: [0, 100],
trackColor: '#f8f7f9',
centerPercentage: 80,
    centerArea: { 
text: (val) => val + '%',
  },
    }
   }"))
  • Mark Nanneman Profile Picture
    Mark Nanneman 329 on at
    What are some of the best ways to design charts in Power Apps?
    Using formulas like what you have in image controls is an interesting method--of course it all depends on the external service being available.

    Integrating PowerBI charts is a powerful option--there's a bit of a learning curve to figuring out.

    I've also sometimes just built my own charts, using galleries, containers and other controls and then adding formulas to the X and Y, dimension and color properties that change depending on the datapoints I want to display.

    It's not the most practical thing, but I once built a Gannt Chart from scratch in powerapps, using nested galleries and containers.

  • Suggested answer
    timl Profile Picture
    timl 32,024 on at
    What are some of the best ways to design charts in Power Apps?
    Hi  MelaninCoded 
     
    I would also recommend that you take a look at the Canviz chart components.
     
     
     
  • Suggested answer
    jpespena Profile Picture
    jpespena 287 on at
    What are some of the best ways to design charts in Power Apps?
    Hi MelaninCoded,
     
    I frequently use Quickcharts on creating visualizations for apps that I build. Just need some fixing on your existing code:
     
    - With() function should start with With({ not With((
    - Remove extra space in ' red' in backgroundColor
    - Remove )1 after the dataset which both cause error.
     
    It should be like this:
    With({Percentage: ThisItem.Expense/Sum(Filter(ExpenseByCategoryCollect, BudgetId =Gallery1.Selected.BudgetId),Expense)*100},
    "https://quickchart.io/chart?c=" & EncodeUrl(
     
        "{ 
    type: 'radialGauge',
    data: {
    datasets: [{
    data: ["& Percentage &"],
    backgroundColor: getGradientFillHelper( 'horizontal',['red', 'blue']),
        }]
        },
    options:{
    domain: [0, 100],
    trackColor: '#f8f7f9',
    centerPercentage: 80,
        centerArea: { 
    text: (val) => val + '%',
      },
        }
       }"))
     

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

November 2024 Newsletter…

November 2024 Community Newsletter…

Community Update Oct 28…

Power Platform Community Update…

Tuesday Tip #7 Community Profile Tips…

Welcome to a brand new series, Tuesday Tips…

Leaderboard

#1
WarrenBelz Profile Picture

WarrenBelz 143,532

#2
RandyHayes Profile Picture

RandyHayes 76,308

#3
Pstork1 Profile Picture

Pstork1 64,050

Leaderboard