django-nvd3 chart.tooltipContent is not a function
Question
I' trying to use the pie chart example here at django-nvd3-doc and I've included the js libraries proceeded with the tutorial but the chart wont be rendered and following js error is displayed
TypeError: chart.tooltipContent is not a function
<anonymous>
test:23
a.render/c()
HTML OUTPUT:
`
<head>
<link media="all" href="/static/nvd3/build/nv.d3.min.css" type="text/css" rel="stylesheet" />
<script src="/static/d3/d3.min.js" type="text/javascript" charset="utf-8"></script>
<script src="/static/nvd3/build/nv.d3.min.js" type="text/javascript" charset="utf-8"></script>
<script>
data_piechart_container=[{"values": [{"value": 52, "label": "Apple"}, {"value": 48, "label": "Apricot"}, {"value": 160, "label": "Avocado"}, {"value": 94, "label": "Banana"}, {"value": 75, "label": "Boysenberries"}, {"value": 71, "label": "Blueberries"}, {"value": 490, "label": "Dates"}, {"value": 82, "label": "Grapefruit"}, {"value": 46, "label": "Kiwi"}, {"value": 17, "label": "Lemon"}], "key": "Serie 1"}];
nv.addGraph(function() {
var chart = nv.models.pieChart();
chart.margin({top: 30, right: 60, bottom: 20, left: 60});
var datum = data_piechart_container[0].values;
chart.color(d3.scale.category20().range());
chart.tooltipContent(function(key, y, e, graph) {
var x = String(key);
var y = String(graph.point.y);
tooltip_str = '<center><b>'+x+'</b></center>' + y;
return tooltip_str;
});
chart.showLabels(true);
chart.donut(false);
chart.showLegend(true);
chart
.x(function(d) { return d.label })
.y(function(d) { return d.value });
chart.height(450);
d3.select('#piechart_container svg')
.datum(datum)
.transition().duration(500)
.attr('height', 450)
.call(chart);
});
</script>
</head>
<body>
<h1>tere</h1>
<div id="piechart_container"><svg style="width:600px;height:400px;"></svg></div>
</body>
`
I've encountered a error like this yesterday when I was trying to use the nvd3 js library without django-nvd , anyways this is the last shot I'm giving to this library
UPDATE : I've tried using the demo django project provided in github's repo and same error still exists
4 answers
solution1
3 2016-02-01 13:29:27
tooltipContent was deprecated, and tooltip was moved into it's own object.
Use chart.tooltip.contentGenerator() , and pass in a function that builds the content.
solution2
2 ACCPTED 2019-10-30 03:24:46
Until the developer merges the pull request with this fix , you may wish to update your requirements.txt to include this line:
-e git://github.com/aniketmaithani/python-nvd3#egg=python-nvd3
solution3
1 2016-03-07 08:07:55
I just fixed this issue. Because django-nvd3 calls the functions and templates of python-nvd3(also the wrapper for python nvd3 developed by the same person).
The answer of liquidpele is completely right. You just need to replace all the functions chart.tooltipContent to chart.tooltip.contentGenerator in your python-nvd3 templates file (update files that call that function). This dictionary may appear in your python library installed location just like /lib/python2.7/sites-packages.
solution4
1 2016-03-24 14:11:25
To add up on cakan's answer and also to be specific. You need to edit these files by replacing 'chart.tooltipContent' with 'chart.tooltip.contentGenerator' on the corresponding line on the 'nvd3' module at the python site-packages.
1.) pythonx.x/site-packages/nvd3/templates/content.html at line '54' and '63'
2.) pythonx.x/site-packages/nvd3/templates/piechart.html at line '18'
Then just refresh or hard refresh your browser then the chart will appear
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.