Skip to content
Navigation Menu
{{ message }}
-
Notifications
You must be signed in to change notification settings - Fork 27
Expand file tree
/
Copy pathcanvas.html
More file actions
257 lines (212 loc) · 16 KB
/
Copy pathcanvas.html
File metadata and controls
257 lines (212 loc) · 16 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><meta name="generator" content="Docutils 0.18.1: http://docutils.sourceforge.net/" />
<title>canvas — VPython 3.2 documentation</title>
<link rel="stylesheet" type="text/css" href="_static/pygments.css" />
<link rel="stylesheet" type="text/css" href="_static/alabaster.css" />
<script data-url_root="./" id="documentation_options" src="_static/documentation_options.js"></script>
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/_sphinx_javascript_frameworks_compat.js"></script>
<script src="_static/doctools.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Lighting and Viewing the Scene" href="cameraAndLights.html" />
<link rel="prev" title="Animations" href="rate.html" />
<link rel="stylesheet" href="_static/custom.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=0.9, maximum-scale=0.9" />
</head><body>
<div class="document">
<div class="documentwrapper">
<div class="bodywrapper">
<div class="body" role="main">
<section id="canvas">
<h1>canvas<a class="headerlink" href="#canvas" title="Permalink to this heading">¶</a></h1>
<p>A canvas is a region of the screen in which 3D objects are displayed. A canvas named <em>scene</em> is created automatically. By default, 3D objects will be assigned at creation to the most recently created canvas in a program. An object can be assigned to a specific canvas by setting the <em>canvas</em> attribute of the object: <code class="docutils literal notranslate"><span class="pre">mybox.canvas</span> <span class="pre">=</span> <span class="pre">scene2</span></code>. Every 3D canvas actually has a 2D overlay in which <em>label</em> objects are displayed.</p>
<dl class="py function">
<dt class="sig sig-object py" id="id0">
<span class="sig-name descname"><span class="pre">canvas</span></span><span class="sig-paren">(</span><em class="sig-param"><span class="n"><span class="pre">width</span></span><span class="o"><span class="pre">=</span></span><span class="default_value"><span class="pre">600</span></span></em>, <em class="sig-param"><span class="n"><span class="pre">height</span></span><span class="o"><span class="pre">=</span></span><span class="default_value"><span class="pre">300</span></span></em>, <em class="sig-param"><span class="n"><span class="pre">background</span></span><span class="o"><span class="pre">=</span></span><span class="default_value"><span class="pre">color.white</span></span></em><span class="sig-paren">)</span><a class="headerlink" href="#id0" title="Permalink to this definition">¶</a></dt>
<dd><dl class="field-list simple">
<dt class="field-odd">Parameters<span class="colon">:</span></dt>
<dd class="field-odd"><ul class="simple">
<li><p><strong>width</strong> (<em>scalar</em>) – Width of canvas in pixels. Default 640.</p></li>
<li><p><strong>height</strong> (<em>vector</em>) – Height of canvas in pixels. Default 400</p></li>
<li><p><strong>background</strong> (<em>vector</em>) – Color of background. Default <em>color.black</em></p></li>
</ul>
</dd>
</dl>
</dd></dl>
<p>Attributes used less often:</p>
<dl class="py function">
<dt class="sig sig-object py">
<span class="sig-name descname"><span class="pre">canvas</span></span><span class="sig-paren">(</span><em class="sig-param"><span class="n"><span class="pre">resizable</span></span><span class="o"><span class="pre">=</span></span><span class="default_value"><span class="pre">True</span></span></em>, <em class="sig-param"><span class="n"><span class="pre">visible</span></span><span class="o"><span class="pre">=</span></span><span class="default_value"><span class="pre">True</span></span></em>, <em class="sig-param"><span class="n"><span class="pre">align</span></span><span class="o"><span class="pre">=</span></span><span class="default_value"><span class="pre">'left'</span></span></em><span class="sig-paren">)</span></dt>
<dd><dl class="field-list simple">
<dt class="field-odd">Parameters<span class="colon">:</span></dt>
<dd class="field-odd"><ul class="simple">
<li><p><strong>visible</strong> (<em>boolean</em>) – If False, no objects are displayed in this canvas. Default is True.</p></li>
<li><p><strong>resizable</strong> (<em>boolean</em>) – If False, user cannot resize the canvas. Default is True.</p></li>
<li><p><strong>align</strong> (<em>string</em>) – Default is ‘none’. Options are ‘left’, ‘right’, ‘none’.</p></li>
<li><p><strong>pixel_to_world</strong> (<em>scalar</em>) – Width of a pixel in world coordinates. Read-only.</p></li>
</ul>
</dd>
</dl>
</dd></dl>
<p>Methods:</p>
<dl class="py method">
<dt class="sig sig-object py" id="mycanvas.select">
<span class="sig-prename descclassname"><span class="pre">mycanvas.</span></span><span class="sig-name descname"><span class="pre">select</span></span><span class="sig-paren">(</span><span class="sig-paren">)</span><a class="headerlink" href="#mycanvas.select" title="Permalink to this definition">¶</a></dt>
<dd></dd></dl>
<p>Makes <em>mycanvas</em> the active one (so objects created subsequently will go into it).</p>
<dl class="py method">
<dt class="sig sig-object py">
<span class="sig-name descname"><span class="pre">current</span> <span class="pre">=</span> <span class="pre">canvas.get_selected()</span></span></dt>
<dd></dd></dl>
<p>Returns the selected canvas.</p>
<p>A canvas can also be specified explicitly when creating an object.</p>
<section id="alignment">
<h2>Alignment<a class="headerlink" href="#alignment" title="Permalink to this heading">¶</a></h2>
<p>Setting <em>align</em> to ‘left’ forces a canvas to the left side of a window. To place a graph to the right of a canvas, set <em>align</em> to ‘left’ for the canvas, and set <em>align</em> to either ‘right’ or ‘left’ for the graph. (If your window isn’t wide enough to display both, the graph will appear under the canvas.)</p>
<figure class="align-default" id="id1">
<img alt="_images/canvas_graph.png" src="_images/canvas_graph.png" />
<figcaption>
<p><span class="caption-text">The canvas (aligned left) displays a bouncing ball. The graph (also aligned left) shows the y-component of the ball’s velocity as a function of time.</span><a class="headerlink" href="#id1" title="Permalink to this image">¶</a></p>
</figcaption>
</figure>
</section>
<section id="resizing">
<h2>Resizing<a class="headerlink" href="#resizing" title="Permalink to this heading">¶</a></h2>
<p>If <em>mycanvas</em> is a resizeable canvas, then <code class="docutils literal notranslate"><span class="pre">mycanvas.bind('resize',</span> <span class="pre">myfunction)</span></code> will execute the function <code class="docutils literal notranslate"><span class="pre">myfunction()</span></code> when the user resizes the canvas. If the function has the form <code class="docutils literal notranslate"><span class="pre">myfunction(myevent)</span></code>, then <code class="docutils literal notranslate"><span class="pre">myevent.type</span></code> will be ‘resize’ and <code class="docutils literal notranslate"><span class="pre">myevent.canvas</span></code> will be ‘mycanvas’.</p>
</section>
<section id="objects-in-a-canvas">
<h2>Objects in a Canvas<a class="headerlink" href="#objects-in-a-canvas" title="Permalink to this heading">¶</a></h2>
<p>For a canvas named <em>scene</em>:</p>
<p><strong>scene.camera</strong> is the camera in the canvas.</p>
<p><strong>scene.objects</strong> is a list of all the visible objects in the canvas.</p>
<p><strong>scene.lights</strong> is a list of all the lights in the scene.</p>
<p><strong>scene.delete()</strong> Deletes all objects in the canvas, then deletes the canvas itself.</p>
</section>
<section id="screen-capture">
<h2>Screen Capture<a class="headerlink" href="#screen-capture" title="Permalink to this heading">¶</a></h2>
<p><strong>scene.capture(myfilename)</strong> Sends a screen shot of the canvas to your Downloads folder as a file named <em>myfilename.png</em>. Subsequent captures will be named <em>myfilename(1).png</em> and so on.</p>
<p><strong>scene.capture(myfilename, False)</strong> Capture does not include <em>label</em> objects. Default is True.</p>
</section>
<section id="caption-and-title">
<h2>Caption and Title<a class="headerlink" href="#caption-and-title" title="Permalink to this heading">¶</a></h2>
<p>A canvas can have a title, which appears above the canvas, and a caption, which appears below the canvas. The text can include simple html elements.</p>
<figure class="align-default" id="id2">
<img alt="_images/canvas.png" src="_images/canvas.png" />
<figcaption>
<p><span class="caption-text">In this image, the title contains the text “This is a <i>sphere</i>” . The caption contains the text “White spheres are <b>boring</b>.”</span><a class="headerlink" href="#id2" title="Permalink to this image">¶</a></p>
</figcaption>
</figure>
<dl class="py function">
<dt class="sig sig-object py">
<span class="sig-name descname"><span class="pre">canvas</span></span><span class="sig-paren">(</span><em class="sig-param"><span class="n"><span class="pre">title</span></span><span class="o"><span class="pre">=</span></span><span class="default_value"><span class="pre">'This</span> <span class="pre">is</span> <span class="pre">the</span> <span class="pre"><i>Title</i>'</span></span></em>, <em class="sig-param"><span class="n"><span class="pre">caption</span></span><span class="o"><span class="pre">=</span></span><span class="default_value"><span class="pre">'This</span> <span class="pre">is</span> <span class="pre">the</span> <span class="pre"><b>caption</b>'</span></span></em><span class="sig-paren">)</span></dt>
<dd><dl class="field-list simple">
<dt class="field-odd">Parameters<span class="colon">:</span></dt>
<dd class="field-odd"><ul class="simple">
<li><p><strong>title</strong> (<em>string</em>) – A string that appears above the canvas.</p></li>
<li><p><strong>caption</strong> (<em>string</em>) – A string that appears below the canvas.</p></li>
</ul>
</dd>
</dl>
</dd></dl>
<p>To append text to a caption use:</p>
<p><strong>mycanvas.append_to_caption(“Some additional text.”)</strong></p>
<p>You can use standard Python formatting for numerical elements.</p>
<p>Widgets such as buttons, menus, and sliders can also be placed in either the title or the caption area. For dynamically modifiable text in a caption, use <em>wtext</em>.</p>
</section>
<section id="redraw-events">
<h2>Redraw Events<a class="headerlink" href="#redraw-events" title="Permalink to this heading">¶</a></h2>
<p>VPython redraws the entire canvas about 60 times per second. If for some reason you want to wait for the screen to start or finish a redraw you can use <a class="reference internal" href="mouse.html#waitfor"><span class="std std-ref">scene.waitfor()</span></a>.</p>
<section id="starting-a-redraw">
<h3>Starting a redraw<a class="headerlink" href="#starting-a-redraw" title="Permalink to this heading">¶</a></h3>
<dl class="py function">
<dt class="sig sig-object py">
<span class="sig-name descname"><span class="pre">evt</span> <span class="pre">=</span> <span class="pre">scene.waitfor('redraw')</span></span></dt>
<dd></dd></dl>
</section>
<section id="completing-a-redraw">
<h3>Completing a redraw<a class="headerlink" href="#completing-a-redraw" title="Permalink to this heading">¶</a></h3>
<dl class="py function">
<dt class="sig sig-object py">
<span class="sig-name descname"><span class="pre">evt</span> <span class="pre">=</span> <span class="pre">scene.waitfor('draw_complete')</span></span></dt>
<dd></dd></dl>
<div class="admonition seealso">
<p class="admonition-title">See also</p>
<p><a class="reference internal" href="camera.html"><span class="doc">Camera</span></a>; <a class="reference internal" href="light.html"><span class="doc">Lights</span></a>; <a class="reference internal" href="userinput.html"><span class="doc">User Input</span></a>; <a class="reference internal" href="textoutput.html"><span class="doc">Text Output</span></a></p>
</div>
</section>
</section>
</section>
</div>
</div>
</div>
<div class="sphinxsidebar" role="navigation" aria-label="main navigation">
<div class="sphinxsidebarwrapper">
<h1 class="logo"><a href="index.html">VPython</a></h1>
<h3>Navigation</h3>
<p class="caption" role="heading"><span class="caption-text">Contents:</span></p>
<ul class="current">
<li class="toctree-l1"><a class="reference internal" href="objects.html">3D Objects</a></li>
<li class="toctree-l1"><a class="reference internal" href="rate.html">Animations</a></li>
<li class="toctree-l1 current"><a class="current reference internal" href="#">Canvases</a><ul>
<li class="toctree-l2"><a class="reference internal" href="#alignment">Alignment</a></li>
<li class="toctree-l2"><a class="reference internal" href="#resizing">Resizing</a></li>
<li class="toctree-l2"><a class="reference internal" href="#objects-in-a-canvas">Objects in a Canvas</a></li>
<li class="toctree-l2"><a class="reference internal" href="#screen-capture">Screen Capture</a></li>
<li class="toctree-l2"><a class="reference internal" href="#caption-and-title">Caption and Title</a></li>
<li class="toctree-l2"><a class="reference internal" href="#redraw-events">Redraw Events</a></li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="cameraAndLights.html">Camera and Lighting</a></li>
<li class="toctree-l1"><a class="reference internal" href="colorOpacityGlow.html">Color/Opacity/Glow</a></li>
<li class="toctree-l1"><a class="reference internal" href="makeshapes.html">Design New Objects</a></li>
<li class="toctree-l1"><a class="reference internal" href="file.html">Files/Libraries</a></li>
<li class="toctree-l1"><a class="reference internal" href="graph.html">Graphs</a></li>
<li class="toctree-l1"><a class="reference internal" href="math.html">Math Functions</a></li>
<li class="toctree-l1"><a class="reference internal" href="workwithobjects.html">Object Attachments</a></li>
<li class="toctree-l1"><a class="reference internal" href="rotation.html">Rotation</a></li>
<li class="toctree-l1"><a class="reference internal" href="textoutput.html">Text output</a></li>
<li class="toctree-l1"><a class="reference internal" href="texture.html">Textures</a></li>
<li class="toctree-l1"><a class="reference internal" href="userinput.html">User Input</a></li>
<li class="toctree-l1"><a class="reference internal" href="webvs7.html">VPython/WebVpython</a></li>
<li class="toctree-l1"><a class="reference internal" href="license.html">VPython license</a></li>
<li class="toctree-l1"><a class="reference internal" href="resources.html">Additional Resources</a></li>
</ul>
<div class="relations">
<h3>Related Topics</h3>
<ul>
<li><a href="index.html">Documentation overview</a><ul>
<li>Previous: <a href="rate.html" title="previous chapter">Animations</a></li>
<li>Next: <a href="cameraAndLights.html" title="next chapter">Lighting and Viewing the Scene</a></li>
</ul></li>
</ul>
</div>
<div id="searchbox" style="display: none" role="search">
<h3 id="searchlabel">Quick search</h3>
<div class="searchformwrapper">
<form class="search" action="search.html" method="get">
<input type="text" name="q" aria-labelledby="searchlabel" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"/>
<input type="submit" value="Go" />
</form>
</div>
</div>
<script>document.getElementById('searchbox').style.display = "block"</script>
</div>
</div>
<div class="clearer"></div>
</div>
<div class="footer">
©2023, Ruth Chabay and Bruce Sherwood.
|
Powered by <a href="http://sphinx-doc.org/">Sphinx 5.0.2</a>
& <a href="https://github.com/bitprophet/alabaster">Alabaster 0.7.12</a>
|
<a href="_sources/canvas.rst.txt"
rel="nofollow">Page source</a>
</div>
</body>
</html>
You can’t perform that action at this time.