Skip to main content

Simple Data Visualization—Charts (Part 1)

1. Overview

Cards are elements in pages (dashboards) and are the smallest analysis results. Cards can refer to a table, a simple chart, etc. Currently, Guandata supports nearly 50+ visualization types, and you can quickly create cards and perform analysis by dragging dimensions and values.

This article takes category analysis as an example and guides you through building intuitive visualization charts through the following steps:

The case dataset used in this tutorial is as follows: Product Practice Dataset.xlsx

The sales proportion of each category, SKU count of each category, national product sales ranking (default display 2021), and monthly gross profit trend analysis will be presented in the form of pie charts, bar charts, and clustered + line charts.

Through intuitive operations, you can easily build such visualization charts on the Guandata platform:

2. Implementation Approach

2.1. Prerequisites

  1. In Data Preparation > Datasets, create folders as needed for storing case datasets. For this specific case, you can name the folder Product Practice.

  2. In Data Preparation > Datasets under the corresponding folder, import the case dataset as the original dataset for making cards.

For more details, see Connect Local Files.

2.2. Formal Steps

  1. Create a new visualization chart card, select the product practice dataset, and jump to the chart visualization creation page.

  2. Present the sales proportion of each category, SKU count, product sales ranking, and monthly gross profit trend in the form of pie charts, bar charts, and clustered + line charts to form multi-angle visualization analysis charts.

  3. Reasonably arrange the various chart cards to achieve the final chart visualization effect.

3. Example Steps

3.1. Create New Card

  1. On the "Data Analysis > Dashboard" page, click New Card and select Visualization Chart.

  2. Search and select Product Practice Dataset, then click OK to jump to the chart card creation page.

    |550

Creating a new chart card is completed. Next, we will start making chart cards.

3.2. Make Chart Cards

Sales Proportion of Each Category (Pie Chart)

The sales proportion of each category is presented in the form of a pie chart, analyzing the proportion of sales amounts of various categories such as food, cosmetics, tobacco and alcohol, etc., in the total sales amount.

  1. First select the visualization type Pie Chart, then click the edit button above the card (as shown in area 2), and name the card Sales Proportion of Each Category.

  2. Drag the field Product Category into the Dimension column, and Sales Amount into the Value column.

Next, set the chart style, configure properties such as data labels and legends, and you can also choose fonts and change background colors as needed to make the chart look more beautiful and clean.

Data labels display the category names of each sector, such as food, cosmetics, tobacco and alcohol. To avoid repetition with the legend below, you can remove them from the chart.

  1. Click Data Labels and uncheck Category Name.

  2. Adjust the layout and display style of the pie chart, display the legend on the right side of the chart to improve the chart viewing experience. Click Legend and select the position as Right Center.

  3. Donut chart is a derivative of pie chart, which can be turned on as needed, and you can also customize the hollow proportion of the donut. Click Pie Chart Settings, turn on Ring Display, and Save the current card.

SKU Count of Each Category + Sales Ranking (Bar Chart)

The SKU count of each category and national product sales ranking are presented in the form of bar charts, showing the top 10 products in the product sales ranking.

A product barcode represents an SKU. By deduplicating and counting product barcodes, you can represent the SKU count under a certain category.

  1. Repeat 3.1. Create New Card to make the SKU count chart for each category, select visualization type Single Bar Chart, drag the field Product Barcode into the Value column and Sort column respectively, and click the field to make the following settings:
  • Aggregation method: Deduplicate count.

  • Sort: Descending.

To improve the chart viewing experience, adjust the display style of the bar chart. You can also make other settings as needed.

  1. In the right chart properties menu bar, make the following settings for the chart and Save the current card to complete the SKU count chart for each category:
  • Coordinate axis: Primary Value Y-axis not displayed

  • Data labels: Displayed

  1. Repeat 3.1. Create New Card to make the product sales ranking Top 10 chart, select visualization type Bar Chart, and name it Product Sales Ranking Top 10.

  2. To achieve product sales ranking, you need to drag the field Product Name into the Dimension column, Sales Quantity into the Value column and Sort column respectively, and make the following settings:

  • Dimension: Display quantity 10.

  • Sort: Descending.

Monthly Gross Profit Trend Analysis (Clustered + Line Chart)

The monthly gross profit trend analysis is presented in the form of clustered + line charts. Use "Clustered + Line Chart" to display the gross profit and year-over-year growth rate for each month together. Year-over-year means comparison with the same period, such as 2021-03 vs 2020-03.

  1. Repeat 3.1. Create New Card to make the monthly gross profit trend analysis chart, select visualization type Clustered + Line Chart, and name it Monthly Gross Profit Trend Analysis.

  2. Calculate the gross profit field required for monthly analysis from sales amount, sales quantity, and cost price. Click the plus button on the left (as shown in the figure), select New Calculated Field, add the "Gross Profit" field (Gross Profit = Sales Amount - Sales Quantity × Cost Price), select the field type as Numeric, and click OK.

  3. Display the gross profit trend of each province from January to December 2021 on the month dimension. Click the field Date, drag Month to the Dimension column and Filter column respectively, then click the field, check the range from 2021-01 to 2021-12, and click OK.

    |650

  4. First drag the field Gross Profit into the Value column, then click the field, select Data Format as Numeric, and click OK.

    |450

  5. Display the gross profit and year-over-year growth rate for each month. Year-over-year means comparison with the same period, such as 2021-03 vs 2020-03. Drag the field Gross Profit to the secondary axis again, click the field, set the alias as "Year-over-year", and click OK.

    |450

  6. Click the field Year-over-year, select advanced calculation, and set the year-over-year growth rate:

  7. Deduplicate and count product barcodes to display the SKU count of each category, and get the "SKU Count" indicator. Click the Add Summary Indicator button, add the "SKU Count" summary indicator, select the position as Right, Deduplicate Count for product barcode, select data format as Numeric, and click OK.

  8. Beautify the chart, set the Data Format of the secondary value axis (Y-axis) as Percentage in the right Coordinate Axis, and set Line as Curve in Graph Display.

    Making chart cards is completed. Next, you can manage the chart cards as needed.

3.3. Manage Chart Cards

  1. Click the edit button to enter the card editing page. Hover over the card to display relevant information (as shown in area 1), click the icon dropdown to show more operations (as shown in area 2). You can also hold down the left mouse button on the card's bottom-right corner button (as shown in area 3) to drag and resize the card as needed.

For more details, see Card Management.

4. More

You have learned the most core creation steps of chart visualization cards. Next, you can enter [Add Dashboard Interaction](5-Add Dashboard Interaction.md) to learn about the interaction functions between various cards in detail.