Comment puis-je forcer plusieurs axes Y dans Highcharts à avoir un zéro commun?

Voir ce JSFiddle. Comment puis-je obtenir de l'axe des y de zéro à aligner?

source d'informationauteur 

  1. 12

    La réponse courte est: vous ne pouvez pas.

    Vous pouvez modifier l'axe de mise à l'échelle, le remplissage et les tiques et des positions de la comme et, éventuellement, obtenir ce que vous voulez, mais il n'y a aucun réglage à faire cela.

    Il y a une demande de fonctionnalité que vous pouvez ajouter votre voix et/ou commentaires à:

    http://highcharts.uservoice.com/forums/55896-general/suggestions/2554384-multiple-axis-alignment-control

    EDIT:
    Otoh, que, je dois mentionner que les deux axes des graphiques comme celui-ci sont le plus souvent d'une très mauvaise façon de présenter les données, et invite l'utilisateur à faire des comparaisons qui ne sont pas valides.

    Alors que la plupart des gens essaient toujours de tout mettre dans un tableau, plusieurs graphiques sont très souvent la meilleure solution.

    FWIW

  2. 7

    Vous pouvez définir des min /max pour le premier axe des y et l'utilisation linkedTo à la deuxième axe, mais je ne sais pas si vous vous attendez à cet effet:

    http://jsfiddle.net/qkDXv/2/

    yAxis: [{ //Primary yAxis
            labels: {
                format: '{value}°C',
                style: {
                    color: '#89A54E'
                }
            },
            title: {
                text: 'Temperature',
                style: {
                    color: '#89A54E'
                }
            },
            min:-250,
            max:50
            //linkedTo:1
        }, { //Secondary yAxis
            title: {
                text: 'Rainfall',
                style: {
                    color: '#4572A7'
                }
            },
            labels: {
                format: '{value} mm',
                style: {
                    color: '#4572A7'
                }
            },
            opposite: true,
            linkedTo:0
        }],
  3. 5

    Une simple solution de contournement jusqu'à ce que cette fonctionnalité est ajoutée est de s'assurer que le ratio de max/min est la même pour les deux axes. Par exemple, est le min et max pour la primaire de l'axe y sont comprises entre -20 et 40 par exemple, alors le max/min ratio est de -2. Maintenant dire que nous avons une valeur maximale pour l'axe y secondaire de 25 ans. Si l'on met le min pour cet axe à 25/-2 (=-12.5), alors y=0 de la ligne seront alignés pour les deux axes.

    Serait beaucoup plus agréable d'avoir un drapeau pour définir automatiquement si 😉

    EDIT: Quelque chose comme ci-dessous a fonctionné pour moi:

    yAxis0Extremes = chart.yAxis[0].getExtremes();
yAxisMaxMinRatio = yAxis0Extremes.max /yAxis0Extremes.min;
yAxis1Extremes = chart.yAxis[1].getExtremes();
yAxis1Min = (yAxis1Extremes.max /yAxisMaxMinRatio).toFixed(0);
chart.yAxis[1].setExtremes(yAxis1Min, yAxis1Extremes.max);
  4. 1

    Je sais, ça fait deux ans. Cependant, j'ai trouvé une meilleure solution de comparer existe pas de solution qui a été donnée dans les réponses précédentes. Ma solution est encore à l'aide de setExtremes pour définir min, max pour ordonnée, mais avec une meilleure gestion des exceptions qui sont extrêmement bon pour show() et hide() toutes les parcelles.
    Solution: lien

    Github: lien

  5. 0

    La façon la plus simple est de simplement fournir le min/max pour chaque axe. Il serait assez simple de déterminer une bonne min/max sur la base des données avant de l'intrigue (appel de combiner les tableaux, prendre le min/max ronde/jusqu'à la plus proche int, serait mon approche).

    pretend this is code so I can link to jsFiddle

    Mis à jour violon.

  6. 0

    vous pouvez le faire facilement en suivant le code ci-dessous-

    vous avez juste besoin de trouver quel est le point de opposé de l'axe des y répond à zéro du premier axe y et de définir le min de l'opp de l'axe y (point * -1)

    Dans mon cas, ordonnée, [1] constitue le principal axe des y et l'axe des y[0] à l'opposé de l'axe des y

     }, function(chart) { //on complete
        var factor = chart.yAxis[1].min  /chart.yAxis[1].tickInterval
        var tick = chart.yAxis[0].tickInterval;
        var _min = chart.yAxis[0].tickInterval * factor 
        chart.yAxis[0].update({ min: _min });
        chart.yAxis[0].update({ tickInterval: tick });



    });