Hovermode compare and scaleanchor

plotly.js
5

After many trial and error none seem to work. But I found an old link from your truly etienne and that makes everything working as expected. Here is what I was after. Thanks again.

old post: Get values on multiple axes
old link: https://github.com/plotly/plotly.js/pull/301

        var trace1 = {
            x:[4,5,6],
            y: [1,2,3]
        };

        var trace2 = {
            x:[4,5,6],
            y: [2.1,2,2.5],
            yaxis: 'y2'
        };

        var trace3 = {
            x:[4,5,6],
            y: [3,2,1],
            yaxis: 'y3'
        };

        var data = [trace1, trace2, trace3];

        var layout = {
            yaxis: {range: [-10,10],
                domain: [0,0.3],
            },
            yaxis2: {range: [-10,10],
                domain: [0.35, 0.65]
            },
            yaxis3: {range: [-10,10],
                domain: [0.7, 1]
            },
            hovermode: 'closest'
        };

        Plotly.newPlot('graph', data, layout);
        var myPlot = document.getElementById('graph');
        myPlot.on('plotly_hover', function (eventdata) {
            Plotly.Fx.hover('graph',
                    [
                        {curveNumber: 0, pointNumber: eventdata.points[0].pointNumber},
                        {curveNumber: 1, pointNumber: eventdata.points[0].pointNumber},
                        {curveNumber: 2, pointNumber: eventdata.points[0].pointNumber},
                    ],
                    ['xy', 'xy2', 'xy3']                        
                    );
        });
1 Like