Data is only as good as it is accurately represented, understandable and valuable to people who are engaged in its purposes, which is why choosing the right visualization in creating a chart is essential. If data is misrepresented or presented ineffectively in the chart, key insights and understanding are lost. This guide is for people who want to design the most common chart, bar chart, using KoolChart, and will help them choose the right presentation for data.
A bar chart is a chart with rectangular bars with lengths proportional to the values that they represent, and a vertical bar chart is sometimes called a column chart. Bar charts are the most common charts and very versatile. They are best used to show change over time, compare different categories, or compare parts of a whole, so that the functional features for the representation of chronological data is very important to the charting library. Koolchart has very powerful features to display the time-series axis for representing chronological data. The <DateTimeAxis> element tag is used to create the time-series axis on the vertical axis for the bar chart and on the horizontal axis for the column chart. The one thing you keep in mind when creating a column chart with chronological data is the time-series labels on the axis should always run left to right. KoolChartâs default rendering of the horizontal time-series axis is left to right in the column chart, and of the vertical time-series axis is bottom to top in the bar chart, but the rendering direction of the axis can be changed at the userâs convenience as well.
If you have long category labels, then the horizontal rectangular bars (bar chart) with left-aligned labels are the best. KoolChartâs features for label rendering are very flexible and straightforward to implement. The labels can be displayed inside or outside the bar, and the display location can be adjusted by the pixel-level using the labelPosition, insideLabelXOffset, insideLabelYOffset and labelAlign attributes. The stacked chart oriented either vertically or horizontally is good to represent the need to multipart-to-whole relationships, and the 100% stacked chart is useful when the total value of each category is unimportant and percentage distribution of subcategories is the primary message. KoolChart provides the easy way to convert a multiple series to a (100%) stacked chart. You just need to set the value of the type attribute to stacked or 100%.
Other practical tips to design a rightly visualized bar chart are first, you should start the Y-axis value at 0. Starting at the value above zero truncates the bars and doesnât accurately reflect the full value. Second, use horizontal labels. Steep vertical or diagonal labels can be difficult to read. The third space between the bars should be half of the bar width. Forth, using consistent colors is always good. Use one color for bar charts, and you may use an accent color to highlight a significant data point. Fifth, you should order data appropriately. Order categories alphabetically, sequentially, or by value.