Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can't reset x-range with zoom enabled on dynamic data

See original GitHub issue

I’m using $http.get() to obtain timeseries data for a candlestick chart, and then using $scope.api.updateWithData() to populate the chart.

If I leave zoom disabled, all works well. However if I turn it on, I get two problems:

  • firstly - no zoom or pan actions actually work. The chart stubbornly stays at its normal zoom level, and instead the page (in Chrome) just tries to scroll
  • secondly - if I start off with no $ at all then I get an exception from line 571: cannot read property 'call' of undefined and still can’t move the graph, although the correct X range is used. If I start instead with an empty array (whether [] or [{values: []}] then the graph goes to the start of the unix epoch (1970/01/01) and then won’t pan.

I’m using 1.0.5, with code as follows:

    $scope.config = {
        refreshDataOnly: false

    $ = [{values: []}];

    $scope.options = { chart: {
        type: 'candlestickBarChart',
        x: function(d) { return; },
        y: function(d) { return d.close; },
        xScale: d3.time.scale(),
        height: 600,
        xAxis: { axisLabel: 'Date and Time', showMaxMin: false,
            tickFormat: function(x) { return dateFormat(new Date(x * 1000))
        yAxis: { axisLabel: 'QPS', showMaxMin: false,
            tickFormat: d3.format('.3r') },
        zoom: { enabled: true, horizontalOff: false, verticalOff: true },
        useInteractiveGuideline: false

    $http.get('....').then(function(res) {
        // mangle data into the required structure

Please advise…

Issue Analytics

  • State:open
  • Created 8 years ago
  • Reactions:3
  • Comments:8 (3 by maintainers)

github_iconTop GitHub Comments

allaneldercommented, Jul 21, 2016

Any update on a fix for this?

raybelliscommented, Dec 9, 2015

I seem to have resolved this by placing a call to $scope.api.refresh() immediately before the call to .updateWithData(). Putting it after (which seemed to be the intuitive thing to do) didn’t work - it left me with a blank “No data” graph.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Keep zoom while changing variables and allow reset - Panel
Hello,. I have an application where I would like to zoom in on time series data and then switch variables to see what...
Read more >
Highmaps limit zoom range breaks zooming out - Stack Overflow
If you zoom back now, the zooming stops when the maps x-range fills the window, although you would expect the map to zoom...
Read more >
Y-axis autoscaling with x-range sliders - Plotly Python
Afaik, y-axis cant be made to auto scale when using x-range sliders. ... y values of the whole x range and does not...
Read more >
Zooming - Highcharts
Zooming in Highcharts can be enabled on the X axes or Y axes separately. ... Otherwise, the user can't pan the zoomed area...
Read more >
Dynamic Contour Visualizations -
cplot = CONTOUR(equation, XRANGE=[0,7], YRANGE=[0,7], $ ... Next, create our contour visualization by first defining our user data and then passing in the ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found