title: How can I calculate a border/stroke added to a triangle, given the triangles vectors and the stroke width?
body: <p>I have a single set of triangle coordinates. One vector for each three points. In the image bellow this triangle is the <code>thin yellow</code> one.  I need to add a <code>stroke</code> or <code>border</code> to this triangle that protrudes both inwards and outwards, centered to the original yellow triangle lines.</p>
  
  <p>Therefore, given the original set of three triangle <code>vector</code> coordinates and the stroke/border <code>width</code>, how can I calculate the <code>vector</code> coordinates for the outer and inner edges of the <code>black</code> (stroke/border) triangle?</p>
  
  <p>The <code>red</code> dots in the image indicate the points I need to calculate.</p>
  
  <p>The triangle can be scaled by either width or height and I need the black stroke/border to always remain at a constant given width.</p>
  
  <p>Although I need to implement this separately in both <code>C++</code> and <code>javascript</code> for <code>WebGL</code>, it is only really the mathematical formulas that I need.</p>
  
  <p>If we imagine the <code>variables</code> I have visualized in <code>javascript</code> with the top-left point of the original triangles bounding box being <code>(0,0)</code> then we get the following:</p>
  
  <pre><code>var width = 300;
  var height = 200;
  var strokeWidth = 20;
  var V1 = {x: 0, y: height};
  var V2 = {x: width, y: height};
  var V3 = {x: width / 2, y: 0);
  </code></pre>
  
  <p>From that, i need to calculate all six red points.  Thanks in advance for any help.</p>
  
  <p><a href="https://i.stack.imgur.com/V8YVx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/V8YVx.png" alt="enter image description here"></a></p>