/Chartbuilder

Primary LanguageJavaScriptMIT LicenseMIT

Chartbuilder / Gneisschart

Chartbuilder / Gneisschart is a D3.js based front-end charting application that facilitates easy creation of simple beautiful charts.

Chartbuilder is the user and export interface. Gneisschart is the charting framework.

What Chartbuilder is not

  • A replacement for Excel
  • A replacement for Google Spreadsheet
  • A data analysis tool
  • A data transformation tool

What Chartbuilder is

Chartbuilder is the final step in charting. Paste data into it and export an svg or png chart.

How to use Chartbuilder

###Getting started

  1. Download source (and unzip)
  2. from the terminal navigate to the source folder (on a Mac: cd ~/Downloads/Chartbuilder-master/)
  3. run python -m SimpleHTTPServer
  4. Open Google Chrome, Apple Safari, or Opera and navigate to http://localhost:8000/

####Charting time Series Data

  1. Find some time series data (may I suggest this)
  2. Make sure the first column is your dates, and the heading on the first column is "date"
  3. Copy and paste into chart builder

####Charting ordinal series data

  1. Find some ordinal series data (may I suggest this)
  2. Make sure the first column are your categories, and the heading on the first column isn't "date"
  3. Copy and paste into chartbuilder

####Finishing up steps 2-4 are optional

  1. Pick your series types
  2. Set a title
  3. Set your units using the axis prefix and suffix field
  4. Adjust your max and min (if you so choose)
  5. Add a credit line and/or a source line
  6. Click create chart
  7. Select to download an svg or png

###Examples of charts made with Chartbuilder ####Line charts

####Column charts

####Bar grids

####Mixed

Why Chartbuilder / Gneisschart

  • You're a writer, blogger, reporter who hates the way screenshotted research reports and excel charts look in your stories
  • You're a graphic designer or graphics editor spending too much time making simple charts in the same style
  • You're a developer at an organization looking to add consistency to employee generated charts

Chartbuilder was created to speed workflow in a newsroom and give reporters more responsibility over their content. It allows someone to create simple graphics quickly within a pre-specified style guide without needing specialized design software.

The output formats are can be used anywhere images and svgs are accepted. There's no need for CMS integration or complex back end systems.

There are fewer excuses to use screenshots from analyst reports or charts in Excel.

More about that here http://yanofsky.info/demos/chartbuilder/slides/

Gneisschart was created to assist in the above as well as establish the starting point for a touch focused responsive charting library.

###Styling the chart Chart styles are contained in css/gneisschart.css. The color palette is defined in config/default_config.js