E-book details

FusionCharts Beginner's Guide: The Official Guide for FusionCharts Suite. Create interactive charts in JavaScript (HTML5) and Flash for your web and enterprise applications with this book and

FusionCharts Beginner's Guide: The Official Guide for FusionCharts Suite. Create interactive charts in JavaScript (HTML5) and Flash for your web and enterprise applications with this book and

Sanket Nadhani, Pallav Nadhani, Shamasis Bhattacharya

Ebook
User experience can make or break any app these days, no matter whether it's a commercial product or an internal solution. While most web applications out there are boring and outdated when it comes to their charting, you can make yours both stunning and powerful using FusionCharts Suite. Once you have mastered it, you can give your users a delightful reporting experience in no time at all.
FusionCharts Beginner's Guide is a practical, step-by-step guide to using FusionCharts Suite for creating delightful web reports and dashboards. Getting you started quickly, you will learn advanced reporting capabilities like drill-down and JavaScript integration, and charting best practices to make the most out of it. Filled with examples, real-life tips and challenges, this book is the firstofitstype in the visualization industry.
The book teaches you to create delightful reports and dashboards for your web applications assuming no previous knowledge of FusionCharts Suite. It gets your first chart up in 15 minutes after which you can play around with different chart types and customize them. You will also learn how to create a powerful reporting experience using drill-down and advanced JavaScript capabilities. You will also connect your charts to server-side scripts pulling data from databases. Finally you round up the experience learning reporting best practices including right chart type selection and practical usability tips.
By the end of the book, you will have a solid foundation in FusionCharts Suite and data visualization itself. You will be able to give your users a delightful reporting experience, from developers to management alike.
  • FusionCharts
    • Table of Contents
    • FusionCharts
    • Credits
    • About the Authors
    • About the Reviewer
    • www.PacktPub.com
      • Support files, eBooks, discount offers and more
        • Why Subscribe?
        • Free Access for Packt account holders
    • Preface
      • What this book covers
      • What you need for this book
      • Who this book is for
      • Conventions
      • Time for action heading
        • What just happened?
        • Pop quiz heading
        • Have a go hero heading
      • Reader feedback
      • Customer support
        • Downloading the example code
        • Errata
        • Piracy
        • Questions
    • 1. Introducing FusionCharts
      • What is FusionCharts Suite?
      • Getting FusionCharts
      • Time for action downloading and extracting FusionCharts
        • What just happened?
      • Creating your first chart
        • Steps to create a chart using FusionCharts
      • Time for action set up FusionCharts for our first chart
        • What just happened?
      • Time for action creating XML data for our first chart
        • What just happened?
      • Time for action Writing the HTML and JavaScript code to embed the chart
        • What just happened?
          • What to look for if your chart is not rendered?
        • Converting the chart to a pure JavaScript chart
      • Time for action creating JavaScript only charts
        • What just happened?
        • Have a go hero build a dashboard for Harry
      • Using the Data String method to provide data
      • Time for action embedding XML in the web page and using the Data String method
        • What just happened?
      • Using JSON data with FusionCharts
      • Time for action converting FusionCharts XML format to JSON
        • What just happened?
      • Time for action powering a chart using JSON data stored in a file
        • What just happened?
      • Time for action powering a chart using JSON data embedded in the page
        • What just happened?
      • Creating charts with multiple series
      • Time for action creating a multi-series chart
        • What just happened?
        • Can the number of <set> and <category> elements mismatch?
          • Representing missing or non-existent data on the chart
      • Combination charts
      • Time for action the chart showing the actual versus the projected revenue
        • What just happened?
      • Time for action a chart showing revenue versus units sold
        • What just happened?
      • Summary
    • 2. Customizing your Chart
      • Know thy chart
      • Customizing the chart background
      • Time for action customizing the chart background
        • What just happened?
        • Have a go hero set a gradient fill for the canvas on a 2D Column chart
        • Image as chart background
      • Time for action setting currency notes as the chart background
        • What just happened?
      • Customizing the chart border
      • Customizing the data plot
        • Customizing the color of the data plot
        • Customizing the border of the data plot
        • Have a go hero highlight an anchor in a line chart
      • Customizing the font properties
      • Configuring the y-axis and divisional lines
      • Time for action customizing the chart limits and the number of divisional lines
        • What just happened?
      • Formatting the numbers on the chart
        • Adding a prefix or suffix to the numbers
        • Configuring decimal places on the chart
        • Setting up your own number scale
      • Time for action setting up a number scale to understand billions as well
        • What just happened?
        • Have a go hero create a number scale to convert seconds to minutes, hours, and days
      • Customizing data labels and values on the chart
        • Different modes to display data labels.
        • Different modes to display data values
      • Configuring the tooltips
      • Configuring the legend in multi-series charts
      • Adding a trendline to the chart
      • Time for action adding a trendline to show target revenue
        • What just happened?
        • Have a go hero add a trendzone to the chart
      • Personalizing the chart
      • Time for action adding a logo and link to the chart
        • What just happened?
      • Using multilingual characters on the chart
        • Adding the BOM stamp in the Data URL method
        • Adding the BOM stamp in the Data String method
      • Changing chart messages
      • Time for action changing the Invalid data message
        • What just happened?
      • Summary
    • 3. JavaScript Capabilities
      • Access your charts using JavaScript
      • Time for action setting up the audit report page
        • What just happened?
        • Pop quiz know your chart object
      • Listening to chart events
        • The simple event model
      • Time for action show chart controls when a chart is fully rendered
        • What just happened?
        • The advanced event model
      • Time for action replace simple events with the advanced event model
        • What just happened?
          • Event arguments in the advanced model
        • Pop quiz know when to use the advanced event model
      • Dynamically updating chart data
      • Time for action change chart data on the click of a button
        • What just happened?
      • Time for action update chart data from a drop-down list
        • What just happened?
      • Retrieve data from chart
      • Time for action retrieve data from the chart and sort them
        • What just happened?
        • Pop quiz do you recall the JSON data API?
        • Retrieving chart data as comma-separated values
      • Time for action retrieve CSV data from the chart and update a textarea
        • What just happened?
      • Manipulate chart cosmetics using JavaScript
      • Time for action hide data values of the columns
        • What just happened?
      • Debugging your charts
        • Using the JavaScript debug mode
      • Time for action set up the JavaScript debug mode to output in a browser console
        • What just happened?
        • Have a go hero
      • Summary
    • 4. Enabling Drill-down on Charts
      • How does drill-down work in FusionCharts?
      • Building our first drill-down chart
      • Time for action:building the parent chart
        • What just happened?
      • Time for action building the descendant chart
        • What just happened?
        • Opening descendant charts in a new window
        • Opening descendant charts in a pop-up window
        • Opening descendant charts in a frame
        • Invoking JavaScript functions on a link click event
      • LinkedCharts for simplified drill-downs
      • Time for action using LinkedCharts to eliminate multiple web pages for descendant charts
        • What just happened?
      • Time for action creating LinkedCharts using a single XML source
        • What just happened?
      • Summary
    • 5. Exporting Charts
      • A word on how the export process works
      • Export charts at client-side
      • Time for action enable exporting of charts using the context menu
        • What just happened?
        • Pop quiz know the possibilities
        • Customizing the export component
      • Time for action customize the export component attributes
        • What just happened?
      • Export charts using JavaScript API
      • Time for action create a button to export the chart
        • What just happened?
        • Configure charts export parameters using JavaScript
      • Time for action create separate buttons to export the chart as image and PDF
        • What just happened?
        • Pop quiz JavaScript Export API
      • Export charts directly to the server
      • Time for action configure the server-side export handler
        • What just happened?
      • Time for action create a button to perform server-side export of the chart
        • What just happened?
        • Have a go hero put the export features to use
      • Summary
    • 6. Integrating with Server-side Scripts
      • FusionCharts and server-side scripts
        • Setting FusionCharts for your dynamic web application
        • Embedding FusionCharts in a web page without using JavaScript
        • Dynamic data and FusionCharts
      • Scope of our dynamic charts and the basic setup
      • Time for action getting ready to build dynamic charts
      • Creating FusionCharts in PHP
      • Time for action creating a chart using data from array
        • What just happened?
      • Time for action creating a chart in PHP using data from MySQL
        • What just happened
      • Time for action adding drill-down to a database-driven chart
        • What just happened?
        • Have a go hero build a dashboard for Harry
      • Creating FusionCharts in ASP.NET using C#
      • Time for action using FusionCharts.dll in a new Visual Studio project
        • What just happened
      • Time for action create a chart in C# using data from an array
        • What just happened
      • Time for action creating a chart in ASP.NET using data from an SQL Server
        • What just happened
      • Time for action creating a drill-down chart in ASP.NET using data from an SQL Server
        • What just happened?
        • Have a go hero build a dashboard for Harry
      • Creating charts in Java using Eclipse
      • Time for action creating a new project in Eclipse and adding the tag library
        • What just happened?
      • Time for action creating a chart in Java using data from an array
        • What just happened?
      • Time for action creating a chart in Java using data from MySQL
        • What just happened?
      • Time for action creating a drill-down chart in Java using data from MySQL
        • What just happened?
        • Have a go hero build a dashboard for Harry
      • Summary
    • 7. Creating Maps for your Applications
      • Getting FusionMaps
      • Time for action downloading and extracting FusionMaps
        • What just happened?
      • Creating the first map
      • Time for action set up FusionMaps for our first map
        • What just happened?
      • Time for action creating the XML for our first map
        • What just happened?
      • Time for action writing the HTML and the JavaScript code to embed the map in a page
        • What just happened?
        • Have a go hero remove the "3D" effect of the map
        • Defining new IDs for the entities
      • Creating drill-down maps
      • Time for action drilling down from the US map to the individual states
        • What just happened?
        • Have a go hero drill-down from the map to a chart
      • Summary
    • 8. Selecting the Right Visualization for your Data
      • Understanding the audience
        • Pop quiz know your dashboard audience
      • Common types of data analysis
        • Comparison of data
        • Transition of data
        • Composition of data
        • Combination of multiple forms of analysis
          • Combination of comparison and transition charts
            • Case 1: Combination chart with a single numeric axis
            • Case 2: Combination chart with dual numeric axes
            • Case 3: Combination chart with dual numeric axes having the same units
          • Combination of comparison and composition charts
        • Pop quiz empowering your CEO
      • Specialized charts
        • Gauges
        • Bullet graphs
        • Funnel chart
        • Editable charts
        • Gantt chart
        • Heat map chart
        • Pop quiz know thy heat map
        • XY chart
      • Summary
    • 9. Increasing the Usability of your Charts
      • Use descriptive captions
      • Arrange data whenever possible
      • Delegate detailed info to tooltips
      • Mention the chart has drill-down
      • Add context to data using trendlines
      • Remove excess precision from data
      • Show predicted values using a dashed border
      • Start the y-axis at zero at all times
      • Use vertical separators when plotting data for irregular intervals
      • Summary
    • A. Pop quiz Answers
      • Chapter 3: JavaScript Capabilities
        • Know your chart object
        • Know when to use the advanced event model
        • Do you recall the JSON data API?
      • Chapter 5: Exporting Charts
        • Know the possibilities
        • JavaScript Export API
      • Chapter 8: Selecting the Right Visualization for your Data
        • Know your dashboard audience
        • Empowering your CEO
        • Know thy heat map
    • Index
  • Title: FusionCharts Beginner's Guide: The Official Guide for FusionCharts Suite. Create interactive charts in JavaScript (HTML5) and Flash for your web and enterprise applications with this book and
  • Author: Sanket Nadhani, Pallav Nadhani, Shamasis Bhattacharya
  • Original title: FusionCharts Beginner's Guide: The Official Guide for FusionCharts Suite. Create interactive charts in JavaScript (HTML5) and Flash for your web and enterprise applications with this book and ebook
  • ISBN: 9781849691772, 9781849691772
  • Date of issue: 2012-04-24
  • Format: Ebook
  • Item ID: e_3cm5
  • Publisher: Packt Publishing