Highcharts - histogramme de redessiner l'animation

Je suis en train de mettre à jour une série de données existante avec un nouveau tableau de données et d'invoquer la redraw fonction lorsque vous avez terminé. Alors que cela fonctionne parfaitement, je ne suis pas satisfait car je voudrais avoir une sorte de " grandir/rétrécir la transition. J'ai vu un par exemple Highcharts (jouer avec le jeu de données, puis cliquez sur le bouton "Définir de nouvelles données sélectionnées de la série") mais je ne peux pas reproduire ce comportement.

C'est ce code que j'ai écrit:

  var series, newSeriesThreshold = this.chart.series.length * 2;

  for (var i = 0; i < data.length; i += 2) {
    series = {
      name:  this.data[i].title,
      data:  this.data[i].data,
      color: this.data[i].color
    };

    if (i >= newSeriesThreshold) {
      this.chart.addSeries(series, false);
    } else {
      var currentSeries = this.chart.series[i / 2];
      currentSeries.setData(series.data, false);
    }
  }

  this.chart.redraw();

Ce sont les options lors de la création de la carte:

  var config = {
    chart: {
      renderTo: $(this.container).attr('id'),
      type: this.settings.type,
      animation: {
        duration: 500,
        easing: 'swing'
      }
    },
    title: {
      text: null
    },
    legend: {
      enabled: this.settings.legend.show
    },
    tooltip: {
      formatter: function() {
        return this.x.toFixed(0) + ": <b>" + this.y.toString().toCurrency(0) + '</b>';
      }
    },
    xAxis: {
      title: {
        text: this.settings.xaxis.title,
        style: {
          color: '#666'
        }
      }
    },
    yAxis: {
      title: {
        text: this.settings.yaxis.title,
        style: {
          color: '#666'
        }
      }
    },
    series: series,
    plotOptions: {
      column: {
        color: '#FF7400'
      }
    },
    credits: {
      enabled: false
    }
  };

Cela donne une mise à jour immédiate sans transition effets. Les idées de ce que je fais de mal?

Quelle est l'erreur ? Pouvez-vous vous connecter vos données de réponse pour voir si c'est la valeur attendue ?
Il n'y a pas d'erreur. Le graphique est mis à jour avec les nouvelles valeurs, sans effets de transition. Pas à pas dans le code source, doAnimation = animation && series.animate rendements false comme series.animate est nul!
Je n'ai pas besoin de faire un rafraîchissement à voir les données mises à jour, mais moi aussi, je me demandais pourquoi il n'y a pas d'effet de transition sur les graphiques à colonnes.
voici la réponse: stackoverflow.com/a/16011343/1356019 c'est un travail pour moi...

OriginalL'auteur Leonard | 2012-06-25

  1. 2

    J'ai résolu ce problème en détruisant et en créant de nouveau le tableau.

    Voici le lien sur highcharts forum qui m'aide : http://forum.highcharts.com/highcharts-usage/animation-on-redraw-t8636/#p93199

    La réponse vient de la highcharts de l'équipe de soutien.

        $(document).ready(function() {
            var chartOptions = {
                    //Your chart options
                    series: [
                             {name: 'Serie 1' , color: '#303AFF', data: [1,1,1,1,1,1,1}
                            ]
                };

            var chart = new Highcharts.Chart(chartOptions);

        $("#my_button").click(function(){ 
            chart.destroy();
            chartOptions.series[0].data = [10,5,2,10,5,2,10];
            chart = new Highcharts.Chart(chartOptions);
        });
    });

    OriginalL'auteur kmas

  2. 0

    Cela reste un mystère. J'ai réussi à faire la mise à jour de l'axe qui suggère qu'il y a une sorte d'animation en cours, mais il est appliqué seulement à l'axe, et de ne pas les colonnes.

    En fin de compte, j'ai réglé avec ce comportement.

    Bonjour Zanathel, j'ai le même problème avec vous. Juste envie de l'animation lorsque les données à jour. Donc maintenant vous avez la bonne solution? Je cherche mais ne trouve pas la réponse

    OriginalL'auteur Leonard

  3. 0

    Ce qui pourrait aider:

    var mychart = $("#mychart").highcharts();     
var height = mychart.renderTo.clientHeight; 
var width = mychart.renderTo.clientWidth; 
mychart.setSize(width, height);

    de mettre à jour tous les tableaux de

    $(Highcharts.charts).each(function(i,chart){
    var height = chart.renderTo.clientHeight; 
    var width = chart.renderTo.clientWidth; 
    chart.setSize(width, height); 
  });

    OriginalL'auteur Tejpal Sharma