Skip to content

Commit e06c89f

Browse files
committed
Site updated at 2017-09-28 20:31:46 UTC
1 parent cb53d19 commit e06c89f

File tree

6 files changed

+7173
-3439
lines changed

6 files changed

+7173
-3439
lines changed

matlab/reference/index.html

Lines changed: 86 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -506,80 +506,93 @@ <h1 class="--name">plotly</h1>
506506
<section class="--page-body --tutorial-index">
507507
<!-- Start pulling content -->
508508
<h2><code>matlab</code> figure reference</h2>
509+
<details>
510+
<summary>How are Plotly attributes organized?</summary>
511+
<div class="row">
512+
<p>
513+
<code>fig2plotly</code> converts MATLAB figures to online Plotly graphs. MATLAB describes figures differently than Plotly. Plotly's MATLAB library crawls the MATLAB figure objects and translates the MATLAB attributes into the structure that Plotly uses to describe and draw data visualizations.<br><br>
514+
515+
You may wish to customize the figure <i>after</i> you have translated it but <i>before</i> you have sent it to Plotly. You can customize every attribute of a plotly graph: the hover text, the colorscales, the gridlines, the histogram binning, etc.<br><br>
516+
517+
<code>plotly</code> charts are described declaratively with <code>struct</code> and <code>cell array</code> objects. This page contains an extensive list of the keys used to describe plotly graphs inside these <code>struct</code> objects.
518+
519+
Here is a simple example of how to translate a MATLAB figure, modify some attributes, and then send it to Plotly.
520+
521+
<pre>&gt;&gt; x = linspace(-2*pi, 2*pi);
522+
&gt;&gt; y1 = sin(x);
523+
&gt;&gt; y2 = cos(x);
524+
&gt;&gt; plot(x, y1, x, y2);
525+
526+
%% Translate the figure from MATLAB to Plotly
527+
&gt;&gt; fig = plotlyfig(gcf);
528+
529+
&gt;&gt; fig.PlotOptions.Strip = 0; % If 0, don't strip MATLAB's styling in translation. If 1, strip MATLAB's styling.
530+
531+
&gt;&gt; fig.data
532+
ans =
533+
534+
[1x1 struct] [1x1 struct]
535+
536+
&gt;&gt; fig.data{1} % The 'type' of this trace is 'scatter'. scatter's reference: <a href="#scatter">#scatter</a>
537+
ans =
538+
539+
xaxis: 'x1' % more about scatter's 'xaxis': <a href="#scatter-xaxis">#scatter-xaxis</a>
540+
yaxis: 'y1' % scatter's 'yaxis' property: <a href="#scatter-yaxis">#scatter-yaxis</a>
541+
type: 'scatter'
542+
visible: 1 % scatter's 'visible' property: <a href="#scatter-visible">#scatter-visible</a>
543+
x: [1x100 double] % scatter's 'x' property: <a href="#scatter-x">#scatter-x</a>
544+
y: [1x100 double] % scatter's 'y' property: <a href="#scatter-y">#scatter-y</a>
545+
name: '' % scatter's 'name' property: <a href="#scatter-y">#scatter-name</a>
546+
mode: 'lines' % scatter's 'mode' property: <a href="#scatter-y">#scatter-mode</a>
547+
line: [1x1 struct] % scatter's 'line' property: <a href="#scatter-y">#scatter-line</a>
548+
marker: [1x1 struct] % scatter's 'marker' property: <a href="#scatter-y">#scatter-marker</a>
549+
showlegend: 1 % scatter's 'showlegend': <a href="#scatter-y">#scatter-marker</a>
550+
551+
%% Modify or add new properties to this trace
552+
&gt;&gt; fig.data{1}.name = 'Current'; % Update the legend name to 'Current'
553+
554+
&gt;&gt; fig.layout % layout reference: <a href="#layout">#layout</a>
555+
ans =
556+
557+
autosize: 0 % layout's 'autosize': <a href="#layout-autosize">#layout-autosize</a>
558+
margin: [1x1 struct] % layout's 'margin': <a href="#layout-margin">#layout-margin</a>
559+
showlegend: 0 % layout's 'showlegend': <a href="#layout-showlegend">#layout-showlegend</a>
560+
width: 840 % layout's 'width': <a href="#layout-width">#layout-width</a>
561+
height: 630 % layout's 'height': <a href="#layout-height">#layout-height</a>
562+
paper_bgcolor: 'rgb(255,255,255)' % layout's 'paper_bgcolor': <a href="#layout-paper_bgcolor">#layout-paper_bgcolor</a>
563+
hovermode: 'closest' % layout's 'hovermode': <a href="#layout-hovermode">#layout-hovermode</a>
564+
plot_bgcolor: 'rgba(0,0,0,0)' % layout's 'plot_bgcolor': <a href="#layout-plot_bgcolor">#layout-plot_bgcolor</a>
565+
xaxis1: [1x1 struct] % layout's 'xaxis': <a href="#layout-xaxis">#layout-xaxis</a>
566+
yaxis1: [1x1 struct] % layout's 'yaxis': <a href="#layout-yaxis">#layout-yaxis</a>
567+
annotations: {[1x1 struct]} % layout's 'annotations': <a href="#layout-annotations">#layout-annotations</a>
568+
569+
&gt;&gt; fig.layout.showlegend = true; % layout's 'showlegend': <a href="#layout-showlegend">#layout-showlegend</a>
570+
&gt;&gt; fig.layout.legend = struct('x', 1, 'y', 1); % Update the legend: <a href="#layout-legend">#layout-legend</a>
571+
&gt;&gt; fig.layout.title = 'Modified plot';
572+
573+
%% Set the filename, and overwrite the plot if it already exists
574+
&gt;&gt; fig.PlotOptions.FileName = 'Customized plot';
575+
&gt;&gt; fig.PlotOptions.FileOpt = 'overwrite';
576+
&gt;&gt; % using offline? Then set fig.PlotOptions.Offline = true;
577+
578+
%% Send to plotly
579+
&gt;&gt; fig.plotly
580+
581+
</pre>
582+
</p>
583+
<hr>
584+
</div>
585+
</details>
509586

510-
<div class="row">
511-
<p>
512-
<code>fig2plotly</code> converts MATLAB figures to online Plotly graphs. MATLAB describes figures differently than Plotly. Plotly's MATLAB library crawls the MATLAB figure objects and translates the MATLAB attributes into the structure that Plotly uses to describe and draw data visualizations.<br><br>
513-
514-
You may wish to customize the figure <i>after</i> you have translated it but <i>before</i> you have sent it to Plotly. You can customize every attribute of a plotly graph: the hover text, the colorscales, the gridlines, the histogram binning, etc.<br><br>
515-
516-
<code>plotly</code> charts are described declaratively with <code>struct</code> and <code>cell array</code> objects. This page contains an extensive list of the keys used to describe plotly graphs inside these <code>struct</code> objects.
517-
518-
Here is a simple example of how to translate a MATLAB figure, modify some attributes, and then send it to Plotly.
519-
520-
<pre>&gt;&gt; x = linspace(-2*pi, 2*pi);
521-
&gt;&gt; y1 = sin(x);
522-
&gt;&gt; y2 = cos(x);
523-
&gt;&gt; plot(x, y1, x, y2);
524-
525-
%% Translate the figure from MATLAB to Plotly
526-
&gt;&gt; fig = plotlyfig(gcf);
527-
528-
&gt;&gt; fig.PlotOptions.Strip = 0; % If 0, don't strip MATLAB's styling in translation. If 1, strip MATLAB's styling.
529-
530-
&gt;&gt; fig.data
531-
ans =
532-
533-
[1x1 struct] [1x1 struct]
534-
535-
&gt;&gt; fig.data{1} % The 'type' of this trace is 'scatter'. scatter's reference: <a href="#scatter">#scatter</a>
536-
ans =
537-
538-
xaxis: 'x1' % more about scatter's 'xaxis': <a href="#scatter-xaxis">#scatter-xaxis</a>
539-
yaxis: 'y1' % scatter's 'yaxis' property: <a href="#scatter-yaxis">#scatter-yaxis</a>
540-
type: 'scatter'
541-
visible: 1 % scatter's 'visible' property: <a href="#scatter-visible">#scatter-visible</a>
542-
x: [1x100 double] % scatter's 'x' property: <a href="#scatter-x">#scatter-x</a>
543-
y: [1x100 double] % scatter's 'y' property: <a href="#scatter-y">#scatter-y</a>
544-
name: '' % scatter's 'name' property: <a href="#scatter-y">#scatter-name</a>
545-
mode: 'lines' % scatter's 'mode' property: <a href="#scatter-y">#scatter-mode</a>
546-
line: [1x1 struct] % scatter's 'line' property: <a href="#scatter-y">#scatter-line</a>
547-
marker: [1x1 struct] % scatter's 'marker' property: <a href="#scatter-y">#scatter-marker</a>
548-
showlegend: 1 % scatter's 'showlegend': <a href="#scatter-y">#scatter-marker</a>
549-
550-
%% Modify or add new properties to this trace
551-
&gt;&gt; fig.data{1}.name = 'Current'; % Update the legend name to 'Current'
552-
553-
&gt;&gt; fig.layout % layout reference: <a href="#layout">#layout</a>
554-
ans =
555-
556-
autosize: 0 % layout's 'autosize': <a href="#layout-autosize">#layout-autosize</a>
557-
margin: [1x1 struct] % layout's 'margin': <a href="#layout-margin">#layout-margin</a>
558-
showlegend: 0 % layout's 'showlegend': <a href="#layout-showlegend">#layout-showlegend</a>
559-
width: 840 % layout's 'width': <a href="#layout-width">#layout-width</a>
560-
height: 630 % layout's 'height': <a href="#layout-height">#layout-height</a>
561-
paper_bgcolor: 'rgb(255,255,255)' % layout's 'paper_bgcolor': <a href="#layout-paper_bgcolor">#layout-paper_bgcolor</a>
562-
hovermode: 'closest' % layout's 'hovermode': <a href="#layout-hovermode">#layout-hovermode</a>
563-
plot_bgcolor: 'rgba(0,0,0,0)' % layout's 'plot_bgcolor': <a href="#layout-plot_bgcolor">#layout-plot_bgcolor</a>
564-
xaxis1: [1x1 struct] % layout's 'xaxis': <a href="#layout-xaxis">#layout-xaxis</a>
565-
yaxis1: [1x1 struct] % layout's 'yaxis': <a href="#layout-yaxis">#layout-yaxis</a>
566-
annotations: {[1x1 struct]} % layout's 'annotations': <a href="#layout-annotations">#layout-annotations</a>
567-
568-
&gt;&gt; fig.layout.showlegend = true; % layout's 'showlegend': <a href="#layout-showlegend">#layout-showlegend</a>
569-
&gt;&gt; fig.layout.legend = struct('x', 1, 'y', 1); % Update the legend: <a href="#layout-legend">#layout-legend</a>
570-
&gt;&gt; fig.layout.title = 'Modified plot';
571-
572-
%% Set the filename, and overwrite the plot if it already exists
573-
&gt;&gt; fig.PlotOptions.FileName = 'Customized plot';
574-
&gt;&gt; fig.PlotOptions.FileOpt = 'overwrite';
575-
&gt;&gt; % using offline? Then set fig.PlotOptions.Offline = true;
576-
577-
%% Send to plotly
578-
&gt;&gt; fig.plotly
579-
580-
</pre>
581-
</p>
582-
<hr>
587+
<!-- Search -->
588+
<div class="content container">
589+
<div class="search-header">Search</div>
590+
<input type="text" class="algolia__input js-algolia__input" autocomplete="off" name="query" placeholder="Search Plotly's Figure Reference" />
591+
<!-- <nav class="--sidebar-body watch" id="search"> -->
592+
593+
<div class="algolia__search-content js-algolia__search-content">
594+
<div class="posts algolia__results"></div>
595+
</div>
583596
</div>
584597

585598

0 commit comments

Comments
 (0)