Black Lives Matter. Please consider donating to Black Girls Code today.

Plotly.js showing only on mouse hover!

Hello all,

I’m trying to create a graph with plot.ly js library, but this graph is not showing up. I noticed that actually the points exist in the graph, because on mouse hover appear the labels. See the picture below!

What could the problem be? Thank you!

It was a CSS problem. I will post an update when I’ll find the real incompatibility!

I would be very interested by the answer as I have the same issue…and I can’t figure out why. I notice that one of my data point is way out of scale… when I do not specify the range, I see the data… but it’s only when I narrow the y range that I have the same issue as you.

Hi guys!

Did you find a solution for this problem?

I have the same issue.

Best Regards

I solved my issue by this code below:

var trace1 = {
x: array1,
y: array2,
mode: ‘lines+markers+text’,
name: ‘Legend1’,
text: array2,
textposition: ‘top left’,
textfont: {
family: ‘sans serif’,
size: 13
},
type: ‘scatter’
};

               var trace2 = {
                  x: array3,
                  y: array4,
                  mode: 'lines+markers+text',
                  name: 'Legend2',
                  text: array4,
                  textposition: 'bottom left',
                  textfont: {
                    family: 'sans serif',
                    size: 13
                  },
                  type: 'scatter'
                };

                var data = [trace1, trace2];

                var layout = {
                    legend: {"orientation": "h"},
                    hovermode: !1
                };

                Plotly.newPlot('mydiv', data, layout,{displayModeBar: false});
                //hide 'Aa' in the legend
                $(".pointtext text").text('');