Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NVD3 line chart tooltip stuck at old position on re-scale of chart #769

Open
vikasKacholia opened this issue Jun 27, 2019 · 0 comments
Open

Comments

@vikasKacholia
Copy link

Hello ,

I am using nvd3 line graph in angular js and initially i have 5 ticks . so after adding 6th tick value in chart dynamically on textbox enter event , thegraph resales .everything shows fina but the tooltip shows at its previous value .

adding below line
scope.svg.datum(scope.data).transition().duration(500).call(scope.chart) in angular-nvd3.js
works for me but how do i acheve the same functionality in my js file.

i tried adding below line after i update the chart data

d3.select('#bar1 svg')
.datum(scope.chartData).transition().duration(500)
.call(chart);
but how do i get chart object in my js file ?
but this does not work . below is my chart configuration

var updateChartAttributes = function () {
scope.options = {
chart: {
type: scope.directiveValue.declaredVariables.chartType,
margin: {
top: 30,
right: 60,
bottom: 35,
left: 60
}, showControls: false, duration: 5,
//yDomain: (new Function("return [" + scope.directiveValue.declaredVariables.yAxisRangeMinimum + "," + scope.directiveValue.declaredVariables.yAxisRangeMaximum + "];")()),
x: function (d) { return d[0]; },
y: function (d) { return d[1]; },
useInteractiveGuideline: true,
dispatch: {
//stateChange: function (e) { console.log("stateChange"); },
//changeState: function (e) { console.log("changeState"); },
//tooltipShow: function (e) { console.log("tooltipShow"); },
//tooltipHide: function (e) { console.log("tooltipHide"); }
},
xAxis: {
axisLabel: scope.directiveValue.declaredVariables.xAxisTitle,
//rotateLabels: -70,
//tickPadding: -3, // - rotation needs this to shift back into place
ticks: 5,
tickFormat: function (d) {
return d3.format('f')(d);
}, axisLabelDistance: -10
},
yAxis: {
axisLabel: scope.directiveValue.declaredVariables.yAxisTitle,
ticks: 5,
tickFormat: function (d) {
return d3.format('f')(d);
}, axisLabelDistance: -10
},
};

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant