8000 merge work to inline examples · plotly/documentation@9b79d98 · GitHub
[go: up one dir, main page]
Skip to content

Commit 9b79d98

Browse files
author
Joseph Damiba
committed
merge work to inline examples
1 parent 7aed4fb commit 9b79d98

File tree

4 files changed

+29
-43
lines changed

4 files changed

+29
-43
lines changed

‎_posts/plotly_js/fundamentals/config-options/2018-02-04-config-opt-modebarButtons.html

Lines changed: 0 additions & 20 deletions
This file was deleted.

‎_posts/plotly_js/fundamentals/config-options/2020-01-24-add-button-to-modebar.html

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,32 @@
11
---
22
name: Add Buttons to ModeBar
3-
plot_url: https://codepen.io/plotly/embed/gObEmLr/?height=450&theme-id=15263&default-tab=result
43
language: plotly_js
54
suite: configuration
65
order: 5.7
76
sitemap: false
87
arrangement: horizontal
98
markdown_content: |
10-
The following example shows how to add a button to your modebar, either using one of the [Plotly icons](https://github.com/plotly/plotly.js/blob/master/src/fonts/ploticon.js) or an [arbitrary icon](https://fontawesome.com/icons?d=gallery&m=free) with a custom behaviour.
9+
The following example shows how to add a button to your modebar, either by using one of the [Plotly icons](https://github.com/plotly/plotly.js/blob/master/src/fonts/ploticon.js) or an [arbitrary icon](https://fontawesome.com/icons?d=gallery&m=free) with a custom behaviour.
1110
---
1211
var icon1 = {
1312
'width': 500,
1413
'height': 600,
15-
'path':'M224 512c35.32 0 63.97-28.65 63.97-64H160.03c0 35.35 28.65 64 63.97 64zm215.39-149.71c-19.32-20.76-55.47-51.99-55.47-154.29 0-77.7-54.48-139.9-127.94-155.16V32c0-17.67-14.32-32-31.98-32s-31.98 14.33-31.98 32v20.84C118.56 68.1 64.08 130.3 64.08 208c0 102.3-36.15 133.53-55.47 154.29-6 6.45-8.66 14.16-8.61 21.71.11 16.4 12.98 32 32.1 32h383.8c19.12 0 32-15.6 32.1-32 .05-7.55-2.61-15.27-8.61-21.71z'}
14+
'path': 'M224 512c35.32 0 63.97-28.65 63.97-64H160.03c0 35.35 28.65 64 63.97 64zm215.39-149.71c-19.32-20.76-55.47-51.99-55.47-154.29 0-77.7-54.48-139.9-127.94-155.16V32c0-17.67-14.32-32-31.98-32s-31.98 14.33-31.98 32v20.84C118.56 68.1 64.08 130.3 64.08 208c0 102.3-36.15 133.53-55.47 154.29-6 6.45-8.66 14.16-8.61 21.71.11 16.4 12.98 32 32.1 32h383.8c19.12 0 32-15.6 32.1-32 .05-7.55-2.61-15.27-8.61-21.71z'
15+
}
16+
1617
var colors = ['green', 'red', 'blue'] 10000
18+
1719
var data = [{
1820
mode: 'lines',
1921
y: [2, 1, 2],
20-
line: {color: colors[0], width: 3, shape: 'spline'}}]
22+
line: {color: colors[0], width: 3, shape: 'spline'}
23+
}]
24+
2125
var layout = {
2226
title: 'add mode bar button with custom icon',
23-
modebardisplay: false}
27+
modebardisplay: false
28+
}
29+
2430
var config = {
2531
modeBarButtonsToAdd: [
2632
{
@@ -36,6 +42,7 @@
3642
direction: 'up',
3743
click: function(gd) {alert('button1')
3844
}}],
39-
modeBarButtonsToRemove: ['pan2d','select2d','lasso2d','resetScale2d','zoomOut2d']}
45+
modeBarButtonsToRemove: ['pan2d','select2d','lasso2d','resetScale2d','zoomOut2d']
46+
}
4047

41-
Plotly.newPlot('graph', data, layout, config)
48+
Plotly.newPlot('myDiv', data, layout, config)

‎_posts/plotly_js/fundamentals/config-options/2020-01-24-display-modebar.html

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
11
---
22
name: Display the Modebar
3-
plot_url: https://codepen.io/plotly/embed/jbMvLq/?height=450&theme-id=15263&default-tab=result
43
language: plotly_js
54
suite: configuration
65
order: 4
76
sitemap: false
87
arrangement: horizontal
98
markdown_content: |
10-
When you hover over the top right of a Plotly graph, a bar appears which we call it `modeBar`. To display or hide this modebar set `displayModeBar` in `config` to `true` or `false`.
9+
When you hover over the top right of a figure generated with `plotly.js`, a bar appears which we call a `modeBar`. To display or hide this modebar set the `displayModeBar` attribute in the `config` of your figure to `true` or `false`, respectively.
1110
---
1211
var data = {
1312
y:['Marc', 'Henrietta', 'Jean', 'Claude', 'Jeffrey', 'Jonathan', 'Jennifer', 'Zacharias'],
1413
x: [90, 40, 60, 80, 75, 92, 87, 73],
1514
type: 'bar',
1615
orientation: 'h'
17-
};
16+
}
1817

19-
var layout = {title: 'Always Display the Modebar', showlegend: false};
20-
Plotly.newPlot('myDiv', data, layout, {displayModeBar: true});
18+
var layout = {title: 'Always Display the Modebar', showlegend: false}
19+
20+
Plotly.newPlot('myDiv', data, layout, {displayModeBar: true})

‎_posts/plotly_js/fundamentals/config-options/2020-01-24-remove-modebarButtons.html

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,27 @@
11
---
2-
name: Remove ModeBar Button
3-
plot_url: https://codepen.io/plotly/embed/OQyEaP/?height=450&theme-id=15263&default-tab=result
2+
name: Remove ModeBar Buttons
43
language: plotly_js
54
suite: configuration
65
order: 5.5
76
sitemap: false
87
arrangement: horizontal
98
markdown_content: |
10-
To delete buttons from the modebar, put buttons name in an array of string and pass it to 'modeBarButtonsToRemove' in config. Here is all the buttons' names:
9+
To delete buttons from the modebar, pass an array of strings containing the names of the buttons you want to remove to the `modeBarButtonsToRemove` attribute in the figure's configuration object. Note that different chart types have different default modebars. The following is a list of all the modebar buttons and the chart types they are associated with:
1110
<ul>
12-
<li>- 2D: zoom2d, pan2d, select2d, lasso2d, zoomIn2d, zoomOut2d, autoScale2d, resetScale2d</li>
13-
<li>- 3D: zoom3d, pan3d, orbitRotation, tableRotation, handleDrag3d, resetCameraDefault3d, resetCameraLastSave3d, hoverClosest3d</li>
14-
<li>- Cartesian: hoverClosestCartesian, hoverCompareCartesian</li>
15-
<li>- Geo: zoomInGeo, zoomOutGeo, resetGeo, hoverClosestGeo</li>
16-
<li>- Other: hoverClosestGl2d, hoverClosestPie, toggleHover, resetViews, "toImage", "sendDataToCloud", "toggleSpikelines", “resetViewMapbox"</li>
11+
<li>- 2D: `zoom2d`, `pan2d`, `select2d`, `lasso2d`, `zoomIn2d`, `zoomOut2d`, `autoScale2d`, `resetScale2d`</li>
12+
<li>- 3D: `zoom3d, `pan3d`, `orbitRotation`, `tableRotation`, `handleDrag3d`, resetCameraDefault3d, `resetCameraLastSave3d`, `hoverClosest3d`</li>
13+
<li>- Cartesian: `hoverClosestCartesian, `hoverCompareCartesian`</li>
14+
<li>- Geo: `zoomInGeo, `zoomOutGeo`, `resetGeo`, `hoverClosestGeo`</li>
15+
<li>- Other: `hoverClosestGl2d`, `hoverClosestPie`, `toggleHover`, `resetViews`, toImage, `sendDataToCloud`, `toggleSpikelines`, `resetViewMapbox`</li>
1716
</ul>
1817
---
1918
var data = {
2019
x:['trees', 'flowers', 'hedges'],
2120
y: [90, 130, 40],
22-
type: 'bar'};
21+
type: 'bar'}
2322

2423
var layout = {
2524
title: 'Remove Modebar Buttons',
26-
showlegend: false};
25+
showlegend: false}
2726

28-
Plotly.newPlot('myDiv', data, layout, {modeBarButtonsToRemove: ['toImage']});
27+
Plotly.newPlot('myDiv', data, layout, {modeBarButtonsToRemove: ['toImage']})

0 commit comments

Comments
 (0)
0