1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
|
#!/usr/bin/python
# -*- coding: utf-8 -*-
"""
Python-nvd3 is a Python wrapper for NVD3 graph library.
NVD3 is an attempt to build re-usable charts and chart components
for d3.js without taking away the power that d3.js gives you.
Project location : https://github.com/areski/python-nvd3
"""
from .NVD3Chart import NVD3Chart, stab
class pieChart(NVD3Chart):
"""
A pie chart (or a circle graph) is a circular chart divided into sectors,
illustrating numerical proportion. In chart, the arc length of each sector
is proportional to the quantity it represents.
.. image:: ../_static/screenshot/pieChart.png
Python example::
from nvd3 import pieChart
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)
chart.buildhtml()
Javascript generated::
data = [{ key: "Cumulative Return",
values: [
{
"label": "One",
"value" : 29.765957771107
},
{
"label": "Two",
"value" : 0
},
{
"label": "Three",
"value" : 32.807804682612
},
]
}]
nv.addGraph(function() {
var chart = nv.models.pieChart()
.x(function(d) { return d.label })
.y(function(d) { return d.value })
.showLabels(true);
chart.color(d3.scale.category20c().range());
chart.tooltipContent(function(key, y, e, graph) {
var x = String(key);
var y = String(y) + ' cal';
tooltip_str = '<center><b>'+x+'</b></center>' + y;
return tooltip_str;
});
d3.select("#div_id")
.datum(data)
.transition()
.duration(1200)
.call(chart);
return chart;
});
"""
def __init__(self, **kwargs):
NVD3Chart.__init__(self, **kwargs)
height = kwargs.get('height', 450)
width = kwargs.get('width', None)
self.create_x_axis('xAxis', format=None)
self.create_y_axis('yAxis', format=None)
# must have a specified height, otherwise it superimposes both chars
if height:
self.set_graph_height(height)
if width:
self.set_graph_width(width)
def buildjschart(self):
NVD3Chart.buildjschart(self)
color_js = ''
if self.color_list:
color_js += "var mycolor = new Array();\n"
color_count = 0
for i in self.color_list:
color_js += stab(2) + "mycolor[" + str(color_count) + "] = '" + i + "';\n"
color_count = int(color_count) + 1
# add mycolor var in js before nv.addGraph starts
if self.color_list:
start_js = self.jschart.find('nv.addGraph')
#start_js_len = len('nv.addGraph')
replace_index = start_js
if start_js > 0:
self.jschart = self.jschart[:replace_index] + color_js + self.jschart[replace_index:]
pie_jschart = '\n' + stab(2) + 'chart.x(function(d) { return d.label })\n' + \
stab(3) + '.y(function(d) { return d.value });\n'
if self.width:
pie_jschart += stab(2) + 'chart.width(%s);\n' % self.width
if self.height:
pie_jschart += stab(2) + 'chart.height(%s);\n' % self.height
# add custom colors for pieChart
if self.color_list and color_js:
pie_jschart += stab(2) + 'chart.color(mycolor);\n'
start_index = self.jschart.find('.pieChart();')
string_len = len('.pieChart();')
replace_index = start_index + string_len
if start_index > 0:
self.jschart = self.jschart[:replace_index] + pie_jschart + self.jschart[replace_index:]
|