updated user guide

jupysketch-doc/docs/reference.md

@@ -11,8 +11,9 @@
 - [Cross](#cross): defines a cross positionned at the provided point
 - [Axis](#axis): defines an axis at the given point with a given label
 - [Arc](#arc): defines an Arc providing a center point, a radius, a starting angle and an angle (rotates clock-wise)
-- [](#)
-- [](#)
+- [Arc_wText](#arc_wtext): defines an arc with text positionned left (moving clock-wise) of arc half-way
+- [Arrow1](#arrow1): defines a line with arrow(s) given starting and ending point and arrow termination(s) ->, \<->, \<-
+- [Force](#force): defines an Indication of a force by an arrow and a text (symbol)
 - [](#)
 
 ## Line
@@ -143,7 +144,66 @@ start_angle = 180-angle
 arc_angle = angle
 arc = Arc(center, radius, start_angle, arc_angle)
 ```
-![Axis](reference/axis.svg)
+![Arc](reference/arc.svg)
+
+## Arc_wText
+[home](#list-of-shapes) Defines an arc with text positionned left (moving clock-wise) of arc half-way
+### Yaml
+```yaml
+center: point(0,0)
+radius: 1
+angle: 120
+start_angle: 180-angle
+arc_angle: angle
+arc_wtxt: "Arc_wText(r'$<bslash>theta$', center, radius, start_angle, arc_angle)"
+```
+### Python
+```python
+center = point(0,0)
+radius = 1
+angle = 120
+start_angle = 180-angle
+arc_angle = angle
+arc_wtxt = Arc_wText(r'$\theta$', center, radius, start_angle, arc_angle)
+```
+![Arc with Text](reference/arcwtext.svg)
+
+## Arrow1
+[home](#list-of-shapes) defines a line with arrow(s) given starting and ending point and arrow termination(s) ->, \<->, \<-
+### Yaml
+```yaml
+start: point(0,0)
+end: point(5,5)
+arrow1: Arrow1(start, end, style='<->')
+```
+### Python
+```python
+start = point(0,0)
+end = point(5,5)
+arrow1 = Arrow1(start, end, style='<->')
+```
+![Arrow1](reference/arrow1.svg)
+
+## Force
+[home](#list-of-shapes) defines an Indication of a force by an arrow and a text (symbol)
+
+### Yaml
+```yaml
+x: 0
+y: 0
+contact: point(x, y)
+vector: point(-3,-5)
+force: Force(contact - vector, contact, r'$Force$', text_pos='start')
+```
+### Python
+```python
+x = 0
+y = 0
+contact = point(x, y)
+vector = point(-3,-5)
+force = Force(contact - vector, contact, r'$Force$', text_pos='start')
+```
+![Force](reference/force.svg)
 
 ## Code to display the above defined shapes
 

jupysketch-doc/site/reference/index.html

@@ -49,7 +49,7 @@
     <div data-md-component="skip">
       
         
-        <a href="#line" class="md-skip">
+        <a href="#list-of-shapes" class="md-skip">
           Skip to content
         </a>
       
@@ -217,6 +217,13 @@
     </label>
     <ul class="md-nav__list" data-md-scrollfix>
       
+        <li class="md-nav__item">
+  <a href="#list-of-shapes" class="md-nav__link">
+    List of Shapes
+  </a>
+  
+</li>
+      
         <li class="md-nav__item">
   <a href="#line" class="md-nav__link">
     Line
@@ -380,11 +387,11 @@
 </li>
       
         <li class="md-nav__item">
-  <a href="#cross-self-designed" class="md-nav__link">
-    Cross (self designed)
+  <a href="#cross" class="md-nav__link">
+    Cross
   </a>
   
-    <nav class="md-nav" aria-label="Cross (self designed)">
+    <nav class="md-nav" aria-label="Cross">
       <ul class="md-nav__list">
         
           <li class="md-nav__item">
@@ -407,11 +414,11 @@
 </li>
       
         <li class="md-nav__item">
-  <a href="#cross-from-shapes" class="md-nav__link">
-    Cross (from shapes)
+  <a href="#axis" class="md-nav__link">
+    Axis
   </a>
   
-    <nav class="md-nav" aria-label="Cross (from shapes)">
+    <nav class="md-nav" aria-label="Axis">
       <ul class="md-nav__list">
         
           <li class="md-nav__item">
@@ -434,11 +441,11 @@
 </li>
       
         <li class="md-nav__item">
-  <a href="#code-initialization" class="md-nav__link">
-    Code initialization
+  <a href="#arc" class="md-nav__link">
+    Arc
   </a>
   
-    <nav class="md-nav" aria-label="Code initialization">
+    <nav class="md-nav" aria-label="Arc">
       <ul class="md-nav__list">
         
           <li class="md-nav__item">
@@ -458,6 +465,114 @@
       </ul>
     </nav>
   
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#arc_wtext" class="md-nav__link">
+    Arc_wText
+  </a>
+  
+    <nav class="md-nav" aria-label="Arc_wText">
+      <ul class="md-nav__list">
+        
+          <li class="md-nav__item">
+  <a href="#yaml_9" class="md-nav__link">
+    Yaml
+  </a>
+  
+</li>
+        
+          <li class="md-nav__item">
+  <a href="#python_9" class="md-nav__link">
+    Python
+  </a>
+  
+</li>
+        
+      </ul>
+    </nav>
+  
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#arrow1" class="md-nav__link">
+    Arrow1
+  </a>
+  
+    <nav class="md-nav" aria-label="Arrow1">
+      <ul class="md-nav__list">
+        
+          <li class="md-nav__item">
+  <a href="#yaml_10" class="md-nav__link">
+    Yaml
+  </a>
+  
+</li>
+        
+          <li class="md-nav__item">
+  <a href="#python_10" class="md-nav__link">
+    Python
+  </a>
+  
+</li>
+        
+      </ul>
+    </nav>
+  
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#force" class="md-nav__link">
+    Force
+  </a>
+  
+    <nav class="md-nav" aria-label="Force">
+      <ul class="md-nav__list">
+        
+          <li class="md-nav__item">
+  <a href="#yaml_11" class="md-nav__link">
+    Yaml
+  </a>
+  
+</li>
+        
+          <li class="md-nav__item">
+  <a href="#python_11" class="md-nav__link">
+    Python
+  </a>
+  
+</li>
+        
+      </ul>
+    </nav>
+  
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#code-to-display-the-above-defined-shapes" class="md-nav__link">
+    Code to display the above defined shapes
+  </a>
+  
+    <nav class="md-nav" aria-label="Code to display the above defined shapes">
+      <ul class="md-nav__list">
+        
+          <li class="md-nav__item">
+  <a href="#yaml_12" class="md-nav__link">
+    Yaml
+  </a>
+  
+</li>
+        
+          <li class="md-nav__item">
+  <a href="#python_12" class="md-nav__link">
+    Python
+  </a>
+  
+</li>
+        
+      </ul>
+    </nav>
+  
 </li>
       
     </ul>
@@ -490,6 +605,13 @@
     </label>
     <ul class="md-nav__list" data-md-scrollfix>
       
+        <li class="md-nav__item">
+  <a href="#list-of-shapes" class="md-nav__link">
+    List of Shapes
+  </a>
+  
+</li>
+      
         <li class="md-nav__item">
   <a href="#line" class="md-nav__link">
     Line
@@ -653,11 +775,11 @@
 </li>
       
         <li class="md-nav__item">
-  <a href="#cross-self-designed" class="md-nav__link">
-    Cross (self designed)
+  <a href="#cross" class="md-nav__link">
+    Cross
   </a>
   
-    <nav class="md-nav" aria-label="Cross (self designed)">
+    <nav class="md-nav" aria-label="Cross">
       <ul class="md-nav__list">
         
           <li class="md-nav__item">
@@ -680,11 +802,11 @@
 </li>
       
         <li class="md-nav__item">
-  <a href="#cross-from-shapes" class="md-nav__link">
-    Cross (from shapes)
+  <a href="#axis" class="md-nav__link">
+    Axis
   </a>
   
-    <nav class="md-nav" aria-label="Cross (from shapes)">
+    <nav class="md-nav" aria-label="Axis">
       <ul class="md-nav__list">
         
           <li class="md-nav__item">
@@ -707,11 +829,11 @@
 </li>
       
         <li class="md-nav__item">
-  <a href="#code-initialization" class="md-nav__link">
-    Code initialization
+  <a href="#arc" class="md-nav__link">
+    Arc
   </a>
   
-    <nav class="md-nav" aria-label="Code initialization">
+    <nav class="md-nav" aria-label="Arc">
       <ul class="md-nav__list">
         
           <li class="md-nav__item">
@@ -731,6 +853,114 @@
       </ul>
     </nav>
   
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#arc_wtext" class="md-nav__link">
+    Arc_wText
+  </a>
+  
+    <nav class="md-nav" aria-label="Arc_wText">
+      <ul class="md-nav__list">
+        
+          <li class="md-nav__item">
+  <a href="#yaml_9" class="md-nav__link">
+    Yaml
+  </a>
+  
+</li>
+        
+          <li class="md-nav__item">
+  <a href="#python_9" class="md-nav__link">
+    Python
+  </a>
+  
+</li>
+        
+      </ul>
+    </nav>
+  
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#arrow1" class="md-nav__link">
+    Arrow1
+  </a>
+  
+    <nav class="md-nav" aria-label="Arrow1">
+      <ul class="md-nav__list">
+        
+          <li class="md-nav__item">
+  <a href="#yaml_10" class="md-nav__link">
+    Yaml
+  </a>
+  
+</li>
+        
+          <li class="md-nav__item">
+  <a href="#python_10" class="md-nav__link">
+    Python
+  </a>
+  
+</li>
+        
+      </ul>
+    </nav>
+  
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#force" class="md-nav__link">
+    Force
+  </a>
+  
+    <nav class="md-nav" aria-label="Force">
+      <ul class="md-nav__list">
+        
+          <li class="md-nav__item">
+  <a href="#yaml_11" class="md-nav__link">
+    Yaml
+  </a>
+  
+</li>
+        
+          <li class="md-nav__item">
+  <a href="#python_11" class="md-nav__link">
+    Python
+  </a>
+  
+</li>
+        
+      </ul>
+    </nav>
+  
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#code-to-display-the-above-defined-shapes" class="md-nav__link">
+    Code to display the above defined shapes
+  </a>
+  
+    <nav class="md-nav" aria-label="Code to display the above defined shapes">
+      <ul class="md-nav__list">
+        
+          <li class="md-nav__item">
+  <a href="#yaml_12" class="md-nav__link">
+    Yaml
+  </a>
+  
+</li>
+        
+          <li class="md-nav__item">
+  <a href="#python_12" class="md-nav__link">
+    Python
+  </a>
+  
+</li>
+        
+      </ul>
+    </nav>
+  
 </li>
       
     </ul>
@@ -751,7 +981,25 @@
                 
                   <h1>Reference</h1>
                 
-                <h2 id="line">Line</h2>
+                <h2 id="list-of-shapes">List of Shapes</h2>
+<p><a href="#code-to-display-the-above-defined-shapes">Code to display shapes</a></p>
+<ul>
+<li><a href="#line">Line</a>: defines a line providing start and end point</li>
+<li><a href="#rectangle">Rectangle</a>: defines a rectangle providing bottom left corner, x dimension, y dimension</li>
+<li><a href="#triangle">Triangle</a>: defines a triangle providing three corner</li>
+<li><a href="#circle">Circle</a>: defines a circle proving center and radius</li>
+<li><a href="#distance-with-text">Distance with text</a>: defines a sizing mark with a label </li>
+<li><a href="#text">Text</a>: defines a given text positionned at the provided point</li>
+<li><a href="#cross">Cross</a>: defines a cross positionned at the provided point</li>
+<li><a href="#axis">Axis</a>: defines an axis at the given point with a given label</li>
+<li><a href="#arc">Arc</a>: defines an Arc providing a center point, a radius, a starting angle and an angle (rotates clock-wise)</li>
+<li><a href="#arc_wtext">Arc_wText</a>: defines an arc with text positionned left (moving clock-wise) of arc half-way</li>
+<li><a href="#arrow1">Arrow1</a>: defines a line with arrow(s) given starting and ending point and arrow termination(s) -&gt;, \&lt;-&gt;, \&lt;-</li>
+<li><a href="#force">Force</a>: defines an Indication of a force by an arrow and a text (symbol)</li>
+<li><a href="#"></a></li>
+</ul>
+<h2 id="line">Line</h2>
+<p><a href="#list-of-shapes">home</a> Defines a line providing start and end point</p>
 <h3 id="yaml">Yaml</h3>
 <pre><code class="yaml">A: point(-5,-5)
 B: point(5,5)
@@ -766,6 +1014,7 @@ line = Line(A,B)
 
 <p><img alt="line" src="line.svg" /></p>
 <h2 id="rectangle">Rectangle</h2>
+<p><a href="#list-of-shapes">home</a> Defines a rectangle providing bottom left corner, x dimension, y dimension</p>
 <h3 id="yaml_1">Yaml</h3>
 <pre><code class="yaml">L: 8
 h: 5
@@ -782,6 +1031,7 @@ rectangle = Rectangle(p,L,h)
 
 <p><img alt="rectangle" src="rectangle.svg" /></p>
 <h2 id="circle">Circle</h2>
+<p><a href="#list-of-shapes">home</a> Defines a circle proving center and radius</p>
 <h3 id="yaml_2">Yaml</h3>
 <pre><code class="yaml">circle: Circle(point(0,0),5)
 </code></pre>
@@ -792,6 +1042,7 @@ rectangle = Rectangle(p,L,h)
 
 <p><img alt="circle" src="circle.svg" /></p>
 <h2 id="triangle">Triangle</h2>
+<p><a href="#list-of-shapes">home</a> Defines a triangle providing three corner</p>
 <h3 id="yaml_3">Yaml</h3>
 <pre><code class="yaml">L: 3.0
 W: 4.0
@@ -806,6 +1057,7 @@ triangle = Triangle(p1=(W/2,0), p2=(3*W/2,W/2), p3=(4*W/5.,L))
 
 <p><img alt="triangle" src="triangle.svg" /></p>
 <h2 id="distance-with-text">Distance with text</h2>
+<p><a href="#list-of-shapes">home</a> Defines a sizing mark with a label </p>
 <h3 id="yaml_4">Yaml</h3>
 <pre><code class="yaml">fontsize: 14
 t: r'$ 2\pi R^2 $'  # sample text
@@ -820,6 +1072,7 @@ dwt = Distance_wText((-4,0), (8, 5), t, fontsize)
 
 <p><img alt="Distance with text" src="distancewithtext.svg" /></p>
 <h2 id="text">Text</h2>
+<p><a href="#list-of-shapes">home</a> Defines a given text positionned at the provided point</p>
 <h3 id="yaml_5">Yaml</h3>
 <pre><code class="yaml">text: Text(r'$c$', point(0,0))
 </code></pre>
@@ -829,57 +1082,121 @@ dwt = Distance_wText((-4,0), (8, 5), t, fontsize)
 </code></pre>
 
 <p><img alt="Text" src="text.svg" /></p>
-<h2 id="cross-self-designed">Cross (self designed)</h2>
+<h2 id="cross">Cross</h2>
+<p><a href="#list-of-shapes">home</a> Defines a cross positionned at the provided point</p>
 <h3 id="yaml_6">Yaml</h3>
-<pre><code class="yaml">c: point(0,0)
-l: 0.1
-line1: Line(c+point(-l,l),c+point(l,-l))
-line2: Line(c+point(l,l), c+point(-l,-l))
-cross: 
-    formula: &quot;Composition({'line1': line1, 'line2': line2})&quot;
-    style:
-        linecolor: black
-        linewidth: 1
+<pre><code class="yaml">cross: Cross(point(0,0))
 </code></pre>
 
 <h3 id="python_6">Python</h3>
-<pre><code class="python">c = point(0,0)
-l = 0.1
-line1 = Line(c+point(-l,l),c+point(l,-l))
-line2 = Line(c+point(l,l), c+point(-l,-l))
-cross = Composition({'line1': line1, 'line2': line2})
-cross.set_linecolor('black')
-cross.set_linewidth(1)
+<pre><code class="python">cross = Cross(point(1,0))
 </code></pre>
 
 <p><img alt="Cross" src="cross.svg" /></p>
-<h2 id="cross-from-shapes">Cross (from shapes)</h2>
+<h2 id="axis">Axis</h2>
+<p><a href="#list-of-shapes">home</a> Defines an axis at the given point with a given label</p>
 <h3 id="yaml_7">Yaml</h3>
-<pre><code class="yaml">cross1: Cross(point(0,0))
+<pre><code class="yaml">axis: Axis((0,0), 5, 'x', rotation_angle=0)
 </code></pre>
 
 <h3 id="python_7">Python</h3>
-<pre><code class="python">cross = Cross(point(1,0))
+<pre><code class="python">axis = Axis((0,0), 5, 'x', rotation_angle=0)
 </code></pre>
 
-<p><img alt="Cross" src="cross.svg" /></p>
-<h2 id="code-initialization">Code initialization</h2>
-<p>Using the following framework in a jupyter notebook</p>
+<p><img alt="Axis" src="axis.svg" /></p>
+<h2 id="arc">Arc</h2>
+<p><a href="#list-of-shapes">home</a> Defines an Arc providing a center point, a radius, a starting angle and an angle (rotates clock-wise)</p>
+<h3 id="yaml_8">Yaml</h3>
+<pre><code class="yaml">center: point(0,0)
+radius: 1
+angle: 120
+start_angle: 180-angle
+arc_angle: angle
+arc: Arc(center, radius, start_angle, arc_angle)
+</code></pre>
+
+<h3 id="python_8">Python</h3>
+<pre><code class="python">center = point(0,0)
+radius = 1
+angle = 120
+start_angle = 180-angle
+arc_angle = angle
+arc = Arc(center, radius, start_angle, arc_angle)
+</code></pre>
+
+<p><img alt="Arc" src="arc.svg" /></p>
+<h2 id="arc_wtext">Arc_wText</h2>
+<p><a href="#list-of-shapes">home</a> Defines an arc with text positionned left (moving clock-wise) of arc half-way</p>
+<h3 id="yaml_9">Yaml</h3>
+<pre><code class="yaml">center: point(0,0)
+radius: 1
+angle: 120
+start_angle: 180-angle
+arc_angle: angle
+arc_wtxt: &quot;Arc_wText(r'$&lt;bslash&gt;theta$', center, radius, start_angle, arc_angle)&quot;
+</code></pre>
+
+<h3 id="python_9">Python</h3>
+<pre><code class="python">center = point(0,0)
+radius = 1
+angle = 120
+start_angle = 180-angle
+arc_angle = angle
+arc_wtxt = Arc_wText(r'$\theta$', center, radius, start_angle, arc_angle)
+</code></pre>
+
+<p><img alt="Arc with Text" src="arcwtext.svg" /></p>
+<h2 id="arrow1">Arrow1</h2>
+<p><a href="#list-of-shapes">home</a> defines a line with arrow(s) given starting and ending point and arrow termination(s) -&gt;, \&lt;-&gt;, \&lt;-</p>
+<h3 id="yaml_10">Yaml</h3>
+<pre><code class="yaml">start: point(0,0)
+end: point(5,5)
+arrow1: Arrow1(start, end, style='&lt;-&gt;')
+</code></pre>
+
+<h3 id="python_10">Python</h3>
+<pre><code class="python">start = point(0,0)
+end = point(5,5)
+arrow1 = Arrow1(start, end, style='&lt;-&gt;')
+</code></pre>
+
+<p><img alt="Arrow1" src="arrow1.svg" /></p>
+<h2 id="force">Force</h2>
+<p><a href="#list-of-shapes">home</a> defines an Indication of a force by an arrow and a text (symbol)</p>
+<h3 id="yaml_11">Yaml</h3>
+<pre><code class="yaml">x: 0
+y: 0
+contact: point(x, y)
+vector: point(-3,-5)
+force: Force(contact - vector, contact, r'$Force$', text_pos='start')
+</code></pre>
+
+<h3 id="python_11">Python</h3>
+<pre><code class="python">x = 0
+y = 0
+contact = point(x, y)
+vector = point(-3,-5)
+force = Force(contact - vector, contact, r'$Force$', text_pos='start')
+</code></pre>
+
+<p><img alt="Force" src="force.svg" /></p>
+<h2 id="code-to-display-the-above-defined-shapes">Code to display the above defined shapes</h2>
+<p><a href="#list-of-shapes">home</a> In order to display the various shapes, use the following code in a jupyter notebook</p>
 <pre><code class="python">[1]: %matplotlib widget
 [2]: from pysketcher import *
 [3]: drawing_tool.set_coordinate_system(xmin=-10, xmax=10,ymin=-10, ymax=10,axis=True)
 [4]: drawing_tool.mpl.gcf().canvas
 </code></pre>
 
-<p>for Yaml, you need the added steps</p>
+<p>for Yaml, you need to add those extra steps</p>
 <pre><code class="python">head = &quot;&quot;&quot;\
 libraries: [&quot;from math import tan, radians, sin, cos&quot;,&quot;from pysketcher import *&quot;]
-&quot;&quot;&quot;
 myfig={}
 sketchParse(head,myfig)
 </code></pre>
 
-<h3 id="yaml_8">Yaml</h3>
+<p>The above code initialize myfig sketch space loading into it libraries references so samples can use tan, radians, si, cos and all the objects defined in pysketcher (the module name of jupytersketcher)</p>
+<h3 id="yaml_12">Yaml</h3>
 <pre><code class="python">myfig={}
 sketch=&quot;&quot;&quot;
 # put here the yaml 'object' definition
@@ -891,7 +1208,7 @@ d = myfig['object'].draw()
 drawing_tool.display()
 </code></pre>
 
-<h3 id="python_8">Python</h3>
+<h3 id="python_12">Python</h3>
 <pre><code class="python">drawing_tool.erase()
 # put the code of the object case here
 # replace object by the actual name line, rectangle, circle...

pysketcher/shapes.py

@@ -1340,7 +1340,7 @@ class VelocityProfile(Shape):
 
 
 class Arrow1(Shape):
-    """Draw an arrow as Line with arrow."""
+    """Draw a Line with arrow(s)."""
     def __init__(self, start, end, style='->'):
         arrow = Line(start, end)
         arrow.set_arrow(style)
@@ -1654,7 +1654,7 @@ class Distance_wText(Shape):
 
 class Arc_wText(Shape):
     """
-    Arc with text positionned arc half-way
+    Arc with text positionned at the left of arc half-way
     """
     def __init__(self, text, center, radius,
                  start_angle, arc_angle, fontsize=0,