Request details

Automatically generated charts and graphs

We often design Area Graphs, Doughnut Charts, Bars etc for Dashboards. Personally I switch between AI and PS to design this type of stuffs.

But it would be great to have an easier way design Charts and Graphs in Adobe XD.

For example, I would like the following method to design a Doughnut Chart:
Draw a circle
Select Doughnut Chart from Menu
Insert Percentages and colors
Hit OK and done!
Similar idea for other type of graphs.

Thanks for the Awesome work, XD Team!

78 votes
Sign in
(thinking…)
Sign in with: Facebook Google
Signed in as (Sign out)

We’ll send you updates on this idea

Khalid Hasan Zibon shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

10 comments

Sign in
(thinking…)
Sign in with: Facebook Google
Signed in as (Sign out)
Submitting...
  • Dhruvi commented  ·   ·  Flag as inappropriate

    Suggestion:- XD can have a feature where we can create a graph and charts like we create in PowerPoint.

    Use:- It will help to work/create a UI screens where we design Dashboard with graphs and charts which should be editable there itself like PowerPoint..

    Problem :- As when we have to create graphs or charts we have to make in another tools( eg:- PowerPoint) and save as image and then use in Adobe XD when we want to edit a graphs or chart as per information every time we have to go to a PowerPoint edit it and paste the image , it's not convenient to do every time as sometimes we have many graphs and charts to create. It takes a lot of time as well

  • Souheil commented  ·   ·  Flag as inappropriate

    I have created a plugin for that called VizzyCharts. Look for it in the Plugins menu ;)

  • Nobuhiro Matsuda commented  ·   ·  Flag as inappropriate

    日本語で失礼します。
    遷移図が欲しいというお客様のために、XDで作った遷移のものを遷移図として書き出したいです。

    For customers who want a transition chart, I want to write transition diagrams made with XD as transition diagrams.

  • Souheil commented  ·   ·  Flag as inappropriate

    I've discovered a several ways of implementing graphs in Xd, all of which use the Repeat Grid. Yes, the bars can be of different color and sizes that depend on comma delimited metrics; and the distance between them is dictated by the Repeat Grid gap.

    No tricks for piecharts yet; only bar, column, line, and line with series markers.

    I have been able to sketch up dashboards on the spot in no time. Very important when working with analysts.

    Thanks to Xd I've been easing away from wireframes altogether and going directly to prototyping. You just have to build a solid elements library.

  • Anonymous commented  ·   ·  Flag as inappropriate

    Just like in Adobe Illustrator, I should be able to create different types of Graphs. This feature is very important especially if you are working with dashboards and projects that involves reporting. As shown in the photo, the data of the graphs must be dependent on what you want. Moreover, I should be able to edit its UI properties. Thanks!

  • Souheil Mechlawi commented  ·   ·  Flag as inappropriate

    We have the same ask as well, especially for prototyping.
    I have a few implementation suggestions:

    1. For the bar graphs it'll be nice if it worked similar to Repeat Grid, where you create a bar then drag the bar to create as many bars as you desire. You can then drag and drop data on the graph, enter numbers manually, or auto-generate numbers for quick prototyping.

    1a. Right-click to switch to ring-chart, or stacked bar.

Feedback and Knowledge Base