Looking to dynamically repeat values in the tooltip content of an nvd3 graph? Not sure how to achieve this using ng-repeat with JSON data? Seeking guidance on alternative methods? I can help!
$scope.options = {
chart: {
type: 'multiBarHorizontalChart',
height: 380,
width: 350,
x: function(d) {
return d.label;
},
y: function(d) {
return d.value;
},
showControls: false,
showValues: true,
showLegend: false,
duration: 1000,
xAxis: {
showMaxMin: false
},
yAxis: {
axisLabel: 'Values',
axisLabelDistance: 100,
tickFormat: function(d) {
return d3.format('.0f')(d);
}
},
"tooltip": {
"enabled": true,
"headerEnabled": true,
"valueFormatter": function(d, i) {
"use strict"
return;
},
"keyFormatter": function(d, i) {
var i = curr.split('$')
return i[1];
},
contentGenerator: function(key, x, y, e, graph) {
if (key.data.tooltip.length != 0) {
return html(key)
} else
return "No Data to Show";
}
}
},
title: {
enable: false,
},
};
Seeking to utilize ng-repeat within HTML for dynamic content?
function IpHtml(key) {
var head = $scope.iptraffic.category;
var html = '<div class="toolTipTraffic">' +
'<div class="head">' +
' <b>' + head + '</b>' +
'</div>' +
' <hr>' +
' <table class="table toottipTableTraffic">' +
' <tr ng-repeat=vals in key>' + // ng-repeat here
' <td>IP</td>' +
' <td>' + ': {{vals}}' + '</td>' +
' </tr>' +
' </table>' +
'</div>';
return html
}