=== Plugin Name === Contributors: thmufl Tags: chart, diagram, svg, csv, excel, numbers, bar chart, pie chart, line chart, donut chart, scatter chart, animation, quotes Requires at least: 3.0.1 Tested up to: 3.5.1 Stable tag: 0.4 License: GPLv2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Creates SVG based, animated bar, pie, donut, line and scatter charts out of your CSV data. A powerful, easy to use shortcode. == Description == IPU-Chart is an easy to use shortcode that creates SVG based bar, pie, donut, line and scatter charts out of your CSV data. The plugin takes a csv file (Texteditor, Excel, Numbers etc.) and displays it as a chart. IPU-Chart is based on [SVG](http://www.w3.org/TR/SVG/) and [D3](http://d3js.org/). It works perfectly on large computer screens as well as on tablets and smaller mobile screens. For browsers that do not support SVG an alternative image can be set. = Features = * Create bar, pie, donut, line and scatter charts * Enter the csv data directy in you blog or page * Or load the csv data from a remote location * Create multiple views of the csv data * Load csv data from a remote location * Tooltip for chart details (see screenshots) * Animated bar charts * Define colors and number formats of the chart * Create an additional table view of the csv data = Usage = First, define your data. You can create it immediately in WordPress or copy and paste it from an export of your favourite spreadsheet application. Example:
[csv id='data']Country,Population
China,1343.24
India,1205.07
USA,313.85
Indonesia,248.22
Brazil,205.72[/csv]
Second, define the chart. Reference the csv (don't forget the '#'). Set the chart type and the category and value column. Define the format (string, integer, float or date) of the category and value columns:
[chart csv='#data' 
       type='bar' 
       category='Country'
       value='Population' 
       format='string, float'
       title='Top five most populous countries of the world...' 
       description='The top five most populous countries of the world...'
       animate='medium']
= Usage Examples = Some examples for the different chart types (that you can copy and paste as is in your own example pages). Bar Chart
[chart csv='#data' type='bar' category='Country' value='Population' format='string, float' title='Top five most populous countries of the world...' description='The top five most populous countries of the world...' animate='medium']
Horizontal Bar Chart
[chart csv='#data' type='bar.horizontal' category='Country' value='Population' format='string, float' title='Top five most populous countries of the world...' description='The top five most populous countries of the world...' animate='medium']
Pie Chart
[chart csv='#data' type='pie' category='Country' value='Population' format='string, float' title='Top five most populous countries of the world...' description='The top five most populous countries of the world...' animate='medium']
Donut Chart
[chart csv='#data' type='donut' category='Country' value='Population' format='string, float' title='Top five most populous countries of the world...' description='The top five most populous countries of the world...' animate='medium' debug='true']
Line Chart For a line charts you need some data with integer, float or date values as category:
[csv id='aapl']Date,Open,High,Low,Close,Volume,Adj Close
2013-04-01,441.90,443.70,426.40,429.79,16407200,429.79
2013-03-25,464.69,469.95,441.62,442.66,14002700,442.66
2013-03-18,441.45,462.10,441.20,461.91,15840700,461.91
2013-03-11,429.75,444.23,425.14,443.66,16382300,443.66
2013-03-04,427.80,435.43,419.00,431.72,18152800,431.72
2013-02-25,453.85,455.12,429.98,430.47,16688500,430.47
2013-02-19,461.10,462.73,442.82,450.81,15088600,450.81
2013-02-11,476.50,484.94,459.92,460.16,16776900,460.16
2013-02-04,453.91,478.81,442.00,474.98,21299300,474.98[/csv]
To display the close prize as a line chart:
[chart csv='#aapl' type='line' category='Date' value='Close' format='yyyy-mm-dd, float' title='Apple close prize...' description='Apple close prize...']
You can also load the csv data remotly. Just enter the url of the csv in the 'csv' attribute:
[chart csv='https://www.ipublia.com/wp-content/uploads/GOOG.csv' type='line' category='Date' value='Close' format='yyyy-mm-dd, float' title='Google close prize...' description='Google close prize...' color="Crimson"]
The same for Apple would be:
[chart csv='https://www.ipublia.com/wp-content/uploads/AAPL.csv' type='line' category='Date' value='Close' format='yyyy-mm-dd, float' title='Apple close prize...' description='Apple close prize...' color="SlateBlue"]
Scatter Chart A scatter chart (or 'plot') displays the correlation between two data sets (if there exists one). Below an example of a scatter chart that shows the correlation between temperature and ice cream sales:
[csv id='icecreamsales']Period,Temperature (Celsius),Sales ($)
Day 1-12,14.2,215
Day 1-12,16.4,325
Day 1-12,11.9,185
Day 1-12,15.2,332
Day 1-12,18.5,406
Day 1-12,22.1,522
Day 1-12,19.4,412
Day 1-12,25.1,614
Day 1-12,23.4,544
Day 1-12,18.1,421
Day 1-12,22.6,445
Day 1-12,17.2,408[/csv]
Out of this raw data we can create a scatter chart that shows the correlation between the two data sets:
[chart csv='#icecreamsales' type='scatter' category='Period' value='Temperature (Celsius), Sales ($)' format='string, float, integer' color="Crimson" title='Ice Cream Sales vs Temperature. Source: www.mathsisfun.com' description='Scatter Chart displaying the relationship between Ice Cream Sales and Temperature. Source: www.mathsisfun.com']
Table View To define a table view just reference the csv with a 'table' shortcode (don't forget the '#'). Example:
[table csv='#icecreamsales' title='Ice Cream Sales vs Temperature. Source: www.mathsisfun.com']
The chart shortcode has many more attributes than shown here. Please refer to our [User Guide](https://www.ipublia.com/support/docs/ipu-chart-for-wordpress-user-guide/ "IPU-Chart User Guide"). Visit our [Support Forum](https://www.ipublia.com/support/forums/ "IPU-Chart Support Forum") for questions or suggestions. = Further Reading = * The IPU-Chart for WordPress [User Guide](https://www.ipublia.com/support/docs/ipu-chart-for-wordpress-user-guide/ "IPU-Chart User Guide"). * The IPU-Chart [Support Forum](https://www.ipublia.com/support/forums/ "IPU-Chart Support Forum"). * The IPU-Chart [Product Page](https://www.ipublia.com/products/ipu-chart-svg-chart-library/ "IPU-Chart Product Page"). Enjoy! == Installation == 1. Upload `ipu-chart` to the `/wp-content/plugins/` directory 1. Activate the plugin through the 'Plugins' menu in WordPress == Frequently Asked Questions == For questions or issues with IPU-Chart please use this support channels: 1. [Documentation](https://www.ipublia.com/ipu-chart/) 1. [FAQ](https://www.ipublia.com/support/faq/) 1. [Support Forum](https://www.ipublia.com/support/forums/) == Screenshots == 1. Bar chart (with a tooltip) 2. Horizontal bar chart 3. Pie Chart 4. Donut Chart 5. Line chart 6. Interpolated line chart 7. Scatter chart (simple) 8. Scatter chart (more complex) == Changelog == = 0.1 = * Initial version with horizontal bar charts = 0.2 = * Pie charts added * Line charts added * Vertical bar charts added * Support for remote cvs loading added * Attribute 'style' added * Attribute 'img' added * Changes in format definitions = 0.3 = * Donut charts added * Attribute 'interpolate' added * Attribute 'animate' added * Enhanced error handling when loading csv data = 0.3.1 = * Labels for x- and y-axis added * Some bugs fixes = 0.3.3 = * Bug fixes documentation = 0.4 = * Scatter charts added * Shortcodes inside [csv][/csv] are processed now * Minor bug fixes == Upgrade Notice == = 0.2 = This version adds support for pie and line charts. Furthermore formats for dates, integers and floats can be specified. = 0.3 = This version adds support for donut charts. Line chars can be interpolated. Bar charts can be animated (click or tap the bar charts to start the animation). = 0.3.1 = This version adds labels for x- and y-axis and some bug fixes. = 0.3.3 = This version adds bug fixes in the documentation. = 0.4 = Scatter charts added. Shortcodes inside [csv][/csv] are processed now. Minor bug fixes.