Main_Demo-Clipping_and_Offsetting_Text

Donate Javascript Clipper Project

Clipping and Offsetting Text

This page presents a complete line of operations that can be made with Clipper Library. The subject polygon has blue text "polygon" and clip polygon has red text "clipping".

Subject polygon is a set of 11 sub polygons and consist of 338 points.

Clip polygon is a set of 13 sub polygons and consist of 324 points.

As you may assume, the holes are represented using reverse direction, eg. outer contour (sub polygon) of glyph "p" is oriented clockwise and inner hole contour is oriented counterclockwise.

These examples are screen captures of Main Demo program.

Table of Contents

• Clipping and Offsetting Text
  • Table of Contents
  • NONE
  • SUBJECT POLYGON OFFSET
  • CLIP POLYGON OFFSET
  • INTERSECTION
  • UNION
  • DIFFERENCE
  • XOR

---

NONE

Polygon Clipping - None

Below we see Subject and Clipping polygons without any modifications.

---

SUBJECT POLYGON OFFSET

Polygon Clipping - Subject polygon

Below we see Subject polygon without geometry modifications, only bevel effect.

---

Polygon Clipping - Subject polygon eroded

Below we see Subject polygon eroded (offset by negative delta).

---

Polygon Clipping - Subject polygon dilated

Below we see Subject polygon dilated (offset by positive delta).

---

CLIP POLYGON OFFSET

Polygon Clipping - Clip polygon

Below we see Clip polygon without geometry modifications, only bevel effect.

---

Polygon Clipping - Clip polygon eroded

Below we see Clip polygon eroded (offset by negative delta).

---

Polygon Clipping - Clip polygon dilated

Below we see Clip polygon dilated (offset by positive delta).

---

INTERSECTION

Polygon Clipping - Intersection

Below we see Intersection of both polygons.

---

Polygon Clipping - Intersection eroded

Below we see Intersection of both polygons. The result is then eroded (offset by negative delta).

---

Polygon Clipping - Intersection dilated

Below we see Intersection of both polygons. The result is then dilated (offset by positive delta).

---

UNION

Polygon Clipping - Union

Below we see Union of both polygons.

---

Polygon Clipping - Union eroded

Below we see Union of both polygons. The result is then eroded (offset by negative delta).

---

Polygon Clipping - Union dilated

Below we see Union of both polygons. The result is then dilated (offset by positive delta).

---

DIFFERENCE

Polygon Clipping - Difference

Below we see Difference of both polygons.

---

Polygon Clipping - Difference eroded

Below we see Difference of both polygons. The result is then eroded (offset by negative delta).

---

Polygon Clipping - Difference dilated

Below we see Difference of both polygons. The result is then dilated (offset by positive delta).

---

XOR

Polygon Clipping - Xor

Below we see Xor of both polygons.

---

Polygon Clipping - Xor eroded

Below we see Xor of both polygons. The result is then eroded (offset by negative delta).

---

Polygon Clipping - Xor dilated

Below we see Xor of both polygons. The result is then dilated (offset by positive delta).

---