|
|
SheerPower Charts: Transform Data into Stunning Visuals
SheerPower includes a powerful charting facility to visualize data in various formats such as bar charts, line charts, scatter plots, Pie, and doughnut charts. This tutorial will guide you through creating charts using SheerPower's simple and intuitive charting statements.
Main Features of SheerPower Charts
- Multiple Chart Types: Choose from bar, line, pie, donut, and scatter charts.
- Dynamic Configuration: Customize colors, labels, axes, and point radii.
- Simple Syntax: Intuitive chart creation with minimal effort.
- Responsive Output: Charts are optimized for display across devices and include built-in interactive tooltips for all data points.
- Embedding: The charts are easly to embed into other html files using the EMBED option.
- Data Mining:Any data point can be linked to a URL by clicking on it using the LINK option.
Basic Structure
Creating charts involves the following simple steps:
- START CHART: Define the chart type, title, and output file.
- ADD CHART: Add data points with x-axis and y-axis values, labels, and styles.
- SET CHART: dynamicaly adjust colors, point radius, and others on a per-data point basis.
- END CHART: Finalize and render the chart.
Step-by-Step Example: Creating a Bar Chart
Objective
Create a bar chart to display random number frequency distribution.
Code Example
dim freq(20) // Array to store frequency counts
! Generate 100 random numbers and count their frequencies
for i = 1 to 50
random_number = rnd(20)
freq(random_number) = freq(random_number) + 1 // Increment frequency
next i
! Start the chart
start chart: type "bar",
title "Random Number Distribution",
output "c:\sheerpower\bar_chart.html",
y_axis_label "Frequency"
! Add data points
for n = 1 to size(freq)
if freq(n) = 0 then freq(n) = 1
add chart: x_axis str$(n),
y_axis freq(n),
value freq(n),
label "Number " + str$(n),
background_Color "blue"
! Customize colors based on frequency
if freq(n) >= 5 then
set chart: background_Color "gold"
elseif freq(n) <= 2 then
set chart: background_Color "red"
end if
next n
! End the chart
end chart
Output
The code above generates a bar chart (bar_chart.html) that dynamically
adjusts bar colors:
- Gold: Frequency ≥ 5
- Red: Frequency ≤ 2
- Blue: Default
Objective
Create a line chart from a CSV file, using clusters .
Here is a sample program that uses two datasets to compare monthly daily average temperatures between Chicago and San Diego. Once you have installed Sheerpower you can copy/paste and try this program.
cluster mydata:month$, chicago, san_diego
cluster input name '@daily_temp_averages.csv', headers 1: mydata
outfile$ = filespec$('@temperature_line_chart.html')
start chart: type "line",
title "Monthly Average temperature Comparison",
output outfile$,
x_axis_label "Month",
y_axis_label "Daily Temperature"
collect cluster mydata
add chart: x_axis mydata->month$,
y_axis mydata->chicago,
background_Color "red",
border_Color "red",
dataset "Chicago Temperatures",
label "Chicago"
end collect
mylink$ = "https://en.wikipedia.org/wiki/San_Diego"
collect cluster mydata
add chart: x_axis mydata->month$,
y_axis mydata->san_diego,
background_Color "blue",
border_Color "blue",
dataset "San Diego Temperatures",
label "San Diego"
if mydata->month$ = "July"
set chart: background_color "green",
border_Color "green",
link mylink$
end if
end collect
end chart
pass nowait, url: outfile$
print 'Please close this window when done'
end
Here is the data for the program:
Month,Chicago,San Diego
January,26.4,57.4
February,30.6,58.1
March,39.4,59.4
April,50,61.5
May,60.4,63.6
June,70.1,67.5
July,75.9,71
August,74.6,72.4
September,67.8,71.6
October,55.7,68.6
November,43,62.8
December,30.9,57.8
Below are two interactive graphs. Hover over the plotted data for tooltips. The green data is clickable!
type "line" to type "bar" and we get this chart:Exploring Other Chart Types
Line Charts
start chart: type "line",
title "Monthly Sales Data",
output "c:\sheerpower\line_chart.html",
x_axis_label "Months",
y_axis_label "Sales ($)"
add chart: x_axis "January", y_axis 1200, label "Jan"
add chart: x_axis "February", y_axis 1500, label "Feb"
add chart: x_axis "March", y_axis 1300, label "Mar"
end chart
Scatter Plots
start chart: type "scatter",
title "Data Points",
output "c:\sheerpower\scatter_chart.html",
x_axis_label "X-Axis",
y_axis_label "Y-Axis"
for i = 1 to 10
x = rnd(100)
y = rnd(100)
add chart: x_axis str$(x), y_axis y, label "Point " + str$(i)
next i
end chart
Donut
dim numbers(5) // Array to store frequency counts
set seed 1718039297
! Generate 50 random numbers and count their occurrences
for i = 1 to 50
random_number = rnd(5)
numbers(random_number) = numbers(random_number) + 1
next i
start chart: type "donut",
title "Random Number Distribution",
output "c:\sheerpower\donut_chart.html",
size "600px",
legend_Position "right",
animation_Type "easeInOutBounce",
animation_Duration 2000
! Array of background colors for slices
dim colors$(5)
colors$(1) = "#FFD700" ! Gold
colors$(2) = "#FF4500" ! OrangeRed
colors$(3) = "#00CED1" ! DarkTurquoise
colors$(4) = "#ADFF2F" ! GreenYellow
colors$(5) = "#9370DB" ! MediumPurple
! Add data points to the chart
for n = 1 to size(numbers)
if numbers(n) = 0 then numbers(n) = 1 ! Ensure no zero values for the pie chart
add chart: x_axis str$(n),
y_axis numbers(n),
value numbers(n),
label "Number " + str$(n),
background_Color colors$(n)
next n
end chart
Advanced Features
- Dynamic Point Radii: Adjust
point_radiusfor scatter or line charts.set chart: point_radius 10 - Custom Colors: Set
background_Colorandborder_Colorfor individual points.set chart: background_Color "gold", border_Color "black", tooltip "click for more', link "https://www.wikipedia.org/" - Tooltips and Interactivity: Tooltips are automatically provided. They interactively display labels and values on hover. You can add your own tooltips as well.
Working with Large Data Sets in SheerPower
When dealing with large data sets, generating charts directly from the entire data set might be impractical due to size or performance constraints. Instead, sampling or summarizing the data before creating a chart is often a more efficient approach.SheerPower excels in these tasks with its ability to process large data sets rapidly. Incorporating sampling and summarization directly into your chart generation code can significantly enhance performance and usability.
START CHART Parameter Reference
The START CHART statement initializes the chart and sets global properties.
The following table lists the supported parameters and their purposes:
| Parameter Name | Purpose |
|---|---|
| title | Specifies the chart title displayed above the chart. |
| output | Defines the output file name for the generated chart HTML. |
| type | Specifies the type of chart (e.g., bar, line, scatter, pie, etc.). |
| size | Sets the chart size (width and height). |
| background_Color | Defines the overall background color of the chart. |
| font | Sets the default font for text in the chart. |
| legend_Position | Specifies the position of the legend (e.g., top, bottom). |
| default_Colors | Sets the default colors for datasets if not individually specified. |
| animation_Type | Defines the type of animation used when the chart is rendered. |
| animation_Duration | Specifies the duration of the animation in milliseconds. |
| x_Axis_Label | Sets the label for the X-axis. |
| y_Axis_Label | Sets the label for the Y-axis. |
start chart: type "bar",
title "Monthly Revenue",
output "revenue_chart.html",
size "800x600",
x_axis_label "Month",
y_axis_label "Revenue"
ADD CHART and SET CHART Parameter Reference
The ADD CHART statement defines a new data point or dataset.
The SET CHART statement modifies properties of an existing dataset or
data point.
The following table lists the supported parameters and their purposes:
| Parameter Name | Purpose |
|---|---|
| dataset | Datasets are used to separate data points into groupings. |
| label | Specifies the label for the dataset or data point, often displayed in the legend or tooltips. |
| x_axis | Defines the X-axis value for the data point. |
| y_axis | Defines the Y-axis value for the data point. |
| value | Specifies the value represented by the data point, often used for tooltips or labels. |
| percentage | Defines the percentage value for pie charts or similar visualizations. |
| background_Color | Sets the background color of the dataset or data point. |
| border_Color | Sets the border color of the dataset or data point. |
| width | Defines the width of the dataset element, such as bars in a bar chart. |
| height | Defines the height of the dataset element, applicable to certain chart types. |
| text_Color | Sets the text color for labels or tooltips associated with the dataset. |
| tooltip | Customizes the tooltip content for the dataset or data point. |
| highlight | Specifies whether the data point or dataset should be highlighted during interactions. |
| point_radius | Sets the radius of points in scatter or line charts. |
| link | Make the point clickable, linking to a URL |
Example 1: Adding New Data Points with Custom Properties
add chart: x_axis = "January",
y_axis = 1200,
label = "Revenue",
background_Color = "blue",
border_Color = "darkblue",
point_radius = 5
Example 2: Updating Data point Properties with SET CHART
set chart: background_Color = "gold",
border_Color = "darkgoldenrod",
point_radius = 8
Summary
SheerPower charts are a simple yet powerful way to visualize data. The
start chart, add chart, set chart, and
end chart statements provide a clear and intuitive workflow for quickly creating
visually compelling charts. Supported types of charts include:
- Bar Chart: Displays data points expressed by vertical bars (
type 'bar').
- Line Chart: Displays data points connected by lines (
type 'line').
- Pie Chart: Circular chart divided into slices to show proportions (
type 'pie').
- Doughnut Chart: Similar to a pie chart but with a hole in the center (
type 'doughnut').
- Scatter Chart: Displays data points on an x-y Cartesian plane without
connecting lines (
type 'scatter').
add chart: x_axis = "January",
y_axis = 1200,
label = "Revenue",
background_Color = "blue",
border_Color = "darkblue",
point_radius = 5
Example 2: Updating Data point Properties with SET CHART
set chart: background_Color = "gold",
border_Color = "darkgoldenrod",
point_radius = 8
Summary
SheerPower charts are a simple yet powerful way to visualize data. The
start chart, add chart, set chart, and
end chart statements provide a clear and intuitive workflow for quickly creating
visually compelling charts. Supported types of charts include:
- Bar Chart: Displays data points expressed by vertical bars (
type 'bar'). - Line Chart: Displays data points connected by lines (
type 'line'). - Pie Chart: Circular chart divided into slices to show proportions (
type 'pie'). - Doughnut Chart: Similar to a pie chart but with a hole in the center (
type 'doughnut'). - Scatter Chart: Displays data points on an x-y Cartesian plane without
connecting lines (
type 'scatter').
Install Sheerpower today and create your first chart. Experiment with the customization options to create visually appealing and informative charts.
|
Hide Description
|
|
|
Enter or modify the code below, and then click on RUN |
|
Looking for the full power of Sheerpower?
Check out the Sheerpower website. Free to download. Free to use. |
