Plugin Directory

Test out the new Plugin Directory and let us know what you think.

NVD3 Visualisations

NVD3 visualisations give you tools on WordPress & Drupal 7 to generate impressive business quality charts based on the famous open NVD3 framework

I am not a tech guru & I hate to learn JavaScript API etc, is there any - just a simple way - to draw charts?

Shortcode [jsChart] is your easy solution then: first create charts gallery by [demosGallery] shortcode & then start cloning your own charts to the new page/post. Each cloning of new chart creates you full example call of [jsChart] shortcode with a lot of options for it that you can try to turn on and off. All this happens safely in preview mode of WordPress before you are happy & ready to publish it all.

How can I visualize my own data set?

  1. You just create your charts gallery by its shortcode [demosGallery] and pick up the right style of chart there for the task.
  2. Next, you choose if you want this new chart into page / post of WordPress.
  3. Before creating new chart by button you select from 8 different sources where your data is coming from.
  4. New chart button takes you to the 2nd step where you actually populate your own data in.
  5. You can copy & paste your own data set in & replace the data set that was coming from gallery's template.
  6. Rest of publishing follows normal standard work flow of WordPress: just edit whole page/post, preview & publish it out.

I just want quickly way to show my small data set on page/post (+ change it later there) and not to edit any external files. Can I do this?

Sure, go to the charts gallery and select data input method Direct Input, press new chart button, and follow its further online help.

Also, you might like to take a look at shortcode_direct_data.txt on examples folder with this case, please.

How can I change the margins around the chart bigger?

You have 2 choices here: outside of chart container (normally div/span element & container) or inside its svg element. Take a look at example shortcode_margins_demo.txt to learn more about these options, please.

How can I change the look of elements of chart from default (eq its lines, bars, etc)?

You can set palette of custom colors for each chart (bars, etc) separately with the following ways:

  1. If you wish to set own custom palette, use colors option. Example - options="{colors:'red,green,blue'}"
  2. If you wish to have fixed set of palettes, use colorbrewer option. Example - options="{colorbrewer:{palette:'Blues'}}"
  3. If you wish to build colors smooth gradients. Example - options="{ colors:{startbar:'red', endbar:'lime'} }"
  4. Finally, there is an option style that feeds in all legal values to the chart's svg in raw structure. A normal example - options="{ style:{'fill':'orange', 'stroke':'navy'} }"

Where are my data sets (of files) stored and what happens for them if I remove chart's page/post or (gasp!) this whole plugin?

Look at your blog's root and the folder called charts_nvd3. Data sets are stored there by random names and they stay there until you remove them by FTP client manually. If you create very many/big data sets it is a pretty good idea to clean this folder from time to time.

Is it possible to have multiple charts on the same WP post or page?

Good point & question here !

YES indeed, the software is design so that it transparently creates and draws many charts on the same page and gives you exact control where you like to show them.

Note: since ver.1.8.0 charts gallery is improved to new visual form. If you need/prefer the old (table) type of look, you just call it by [demosGallery_old] shortcode.

Also, peek into examples folder of plugin and start to test shortcodes demos there with your blog.

HELP!! There are SO namy options generated by gallery of chart picker: do I need to learn them all?

No, you just remove all the options that you do not like/need and shortcode sets them to sensible default values automatically on the background.

How do I know which options work together with the chart type that I use?

Look at inside chart_options.html file and its comparisons table, please.

Where is open source if I want to improve it?

Here: * http://github.com/wp-plugins/nvd3-visualisations

Requires: 3.3.2 or higher
Compatible up to: 4.5.5
Last Updated: 9 months ago
Active Installs: 100+


5 out of 5 stars


Got something to say? Need help?


Not enough data

0 people say it works.
0 people say it's broken.