NVD3Chart
¶
-
class
nvd3.NVD3Chart.
NVD3Chart
(**kwargs)¶ NVD3Chart Base class.
-
__init__
(**kwargs)¶ This is the base class for all the charts. The following keywords are accepted:
Keyword: display_container - default:
True
Keyword: jquery_on_ready - default:
False
Keyword: charttooltip_dateformat - default:
'%d %b %Y'
Keyword: name - default: the class name
model
- set the model (e.g.pieChart
, `LineWithFocusChart
,MultiBarChart
).Keyword: color_category - default -
None
Keyword: color_list - default -
None
used by pieChart (e.g.['red', 'blue', 'orange']
)Keyword: margin_bottom - default -
20
Keyword: margin_left - default -
60
Keyword: margin_right - default -
60
Keyword: margin_top - default -
30
Keyword: height - default -
''
Keyword: width - default -
''
Keyword: stacked - default -
False
Keyword: focus_enable - default -
False
Keyword: resize - define -
False
Keyword: show_legend - default -
True
Keyword: show_labels - default -
True
Keyword: tag_script_js - default -
True
Keyword: use_interactive_guideline - default -
False
Keyword: chart_attr - default -
None
Keyword: extras - default -
None
Extra chart modifiers. Use this to modify different attributes of the chart.
Keyword: x_axis_date - default - False Signal that x axis is a date axis
Keyword: date_format - default -
%x
see https://github.com/mbostock/d3/wiki/Time-FormattingKeyword: x_axis_format - default -
''
.Keyword: y_axis_format - default -
''
.Keyword: style - default -
''
Style modifiers for the DIV container.Keyword: color_category - default -
category10
Acceptable values are nvd3 categories such as
category10
,category20
,category20c
.
-
CHART_FILENAME
= None¶
-
add_chart_extras
(extras)¶ Use this method to add extra d3 properties to your chart. For example, you want to change the text color of the graph:
chart = pieChart(name='pieChart', color_category='category20c', height=400, width=400) xdata = ["Orange", "Banana", "Pear", "Kiwi", "Apple", "Strawberry", "Pineapple"] ydata = [3, 4, 0, 1, 5, 7, 3] extra_serie = {"tooltip": {"y_start": "", "y_end": " cal"}} chart.add_serie(y=ydata, x=xdata, extra=extra_serie)
The above code will create graph with a black text, the following will change it:
text_white="d3.selectAll('#pieChart text').style('fill', 'white');" chart.add_chart_extras(text_white)
The above extras will be appended to the java script generated.
Alternatively, you can use the following initialization:
chart = pieChart(name='pieChart', color_category='category20c', height=400, width=400, extras=text_white)
-
add_serie
(y, x, name=None, extra=None, **kwargs)¶ add serie - Series are list of data that will be plotted y {1, 2, 3, 4, 5} / x {1, 2, 3, 4, 5}
Attributes:
name
- set Serie namex
- x-axis datay
- y-axis data
kwargs:
shape
- for scatterChart, you can set different shapes- (circle, triangle etc...)
size
- for scatterChart, you can set size of different shapestype
- for multiChart, type should be barbar
- to display bars in Chartcolor_list
- define list of colors which will be- used by pieChart
color
- set axis colordisabled
-
extra:
tooltip
- set tooltip flagdate_format
- set date_format for tooltip if x-axis is in date format
-
assets_directory
= u'./bower_components/'¶ - directory holding the assets (bower_components)
-
buildcontainer
()¶ generate HTML div
-
buildcontent
()¶ Build HTML content only, no header or body tags. To be useful this will usually require the attribute juqery_on_ready to be set which will wrap the js in $(function(){<regular_js>};)
-
buildhtml
()¶ Build the HTML page Create the htmlheader with css / js Create html page Add Js code for nvd3
-
buildhtmlheader
()¶ generate HTML header content
-
buildjschart
()¶ generate javascript code for the chart
-
container
= None¶ Place holder for the graph (the HTML div) Written by
buildcontainer
-
containerheader
= None¶ Header for javascript code
-
count
= 0¶ chart count
-
create_x_axis
(name, label=None, format=None, date=False, custom_format=False)¶ Create X-axis
-
create_y_axis
(name, label=None, format=None, custom_format=False)¶ Create Y-axis
-
date_flag
= None¶ x-axis contain date format or not
-
htmlcontent
= None¶ written by buildhtml
-
jschart
= None¶ Javascript code as string
-
model
= None¶ The chart model,
-
set_containerheader
(containerheader)¶ Set containerheader
-
set_custom_tooltip_flag
(custom_tooltip_flag)¶ Set custom_tooltip_flag & date_flag
-
set_date_flag
(date_flag=False)¶ Set date flag
-
set_graph_height
(height)¶ Set Graph height
-
set_graph_width
(width)¶ Set Graph width
-
template_environment
= <jinja2.environment.Environment object>¶
-
template_page_nvd3
= None¶ an Instance of Jinja2 template
-