Menu
Trying to create a wind rose in Plotly; the actual chart displays fine, but I don't want either of the hover tooltips. hoverinfo:none doesn't seem to work; what am I doing wrong?
var json =
{"RequestID":null,"AppCode":"0","AppMessage":"OK","Meta":null,"Data":{"Series":[{"r":[23.658536585365852,19.878048780487806,7.8048780487804876,5.8536585365853666,13.292682926829269,6.463414634146341,4.024390243902439,19.024390243902438],"t":["0","45","90","135","180","225","270","315"],"name":"\u003e 25","marker":{"color":"#FF0000"},"type":"area","hoverinfo":"none"},{"r":[23.658536585365852,19.878048780487806,7.8048780487804876,5.8536585365853666,13.292682926829269,6.463414634146341,4.024390243902439,19.024390243902438],"t":["0","45","90","135","180","225","270","315"],"name":"10 - 25","marker":{"color":"#ED850C"},"type":"area","hoverinfo":"none"},{"r":[21.707317073170728,18.414634146341463,7.0731707317073171,5.7317073170731714,12.804878048780488,5.975609756097561,3.7804878048780486,17.926829268292682],"t":["0","45","90","135","180","225","270","315"],"name":"5 - 10","marker":{"color":"#3F3F3F"},"type":"area","hoverinfo":"none"},{"r":[19.756097560975608,17.4390243902439,6.4634146341463419,5.1219512195121961,11.585365853658537,5.1219512195121952,3.4146341463414633,15.487804878048781],"t":["0","45","90","135","180","225","270","315"],"name":"2 - 5","marker":{"color":"#2A4354"},"type":"area","hoverinfo":"none"},{"r":[17.073170731707314,13.780487804878048,5.3658536585365857,4.6341463414634152,10,3.9024390243902443,3.0487804878048781,12.073170731707318],"t":["0","45","90","135","180","225","270","315"],"name":"1 - 2","marker":{"color":"#5486A9"},"type":"area","hoverinfo":"none"},{"r":[11.829268292682926,9.2682926829268286,3.2926829268292686,2.8048780487804881,7.4390243902439019,3.1707317073170733,2.1951219512195119,8.536585365853659],"t":["0","45","90","135","180","225","270","315"],"name":"\u003c 1","marker":{"color":"#68A7D3"},"type":"area","hoverinfo":"none"}]}};
var data = json.Data.Series;
var layout = {
title: 'Wind Speed Distribution in Laurel, NE',
font: {size: 11},
legend: {font: {size: 16}},
radialaxis: {ticksuffix: '%'},
orientation: 270,
hovermode: 'none',
yaxis: {
}
};
Plotly.newPlot('myDiv', data, layout);
Working example: https://jsfiddle.net/whelkaholism/yyfoyd9h/4/
635
Luckily for you (and me), today, we can pass a single config parameter to disable it once and forever. In your Plotly (JavaScript, Python, R, whatever version), you should have the config object that you pass into your plot or graph. Just add displayModeBar: false to the config object and it will disable the floating toolbar in Plotly.
I'm aware that there is staticPlot option for disabling these features but it actually disables all interactive operations including tooltips and legends. For charts that don't have much data points, these features unnecessary so it would be great if you guys add an option to disable zooming, panning and dragging.
When users hover over a figure generated with plotly.js, a modebar appears in the top-right of the figure. This presents users with several options for interacting with the figure. By default, the modebar is only visible while the user is hovering over the chart.
New to Plotly? Plotly is a free and open-source graphing library for JavaScript. We recommend you read our Getting Started guide for the latest installation or upgrade instructions, then move on to our Plotly Fundamentals tutorials or dive straight in to some Basic Charts tutorials.
You have to add hovermode: !1 to disable hover.
Try:
var layout = {
title: 'Wind Speed Distribution in Laurel, NE',
font: {size: 11},
legend: {font: {size: 16}},
radialaxis: {ticksuffix: '%'},
orientation: 270,
hovermode: false,
yaxis: {
}
};
The accepted values for hovermode are "x", "y", "closest", false
91
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
