admin管理员组文章数量:1429009
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
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
Reset to default 4tooltipContent
was deprecated, and tooltip
was moved into it's own object.
Use chart.tooltip.contentGenerator()
, and pass in a function that builds the content.
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./aniketmaithani/python-nvd3#egg=python-nvd3
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
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 pletely 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.
本文标签: javascriptdjangonvd3 charttooltipContent is not a functionStack Overflow
版权声明:本文标题:javascript - django-nvd3 chart.tooltipContent is not a function - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1745419838a2657852.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论