poly-extrude

Extrude polygons/polylines. Born in maptalks.three project

Install

NPM

1npm i poly-extrude

CDN

1<script type="text/javascript" src="https://unpkg.com/poly-extrude/dist/poly-extrude.js"></script>

Use

1  import {
2      polygons,
3      extrudePolygons,
4      extrudePolygonsOnPath,
5      extrudePolylines,
6      cylinder,
7      expandPaths,
8      extrudeSlopes,
9      expandTubes,
10      plane
11  } from 'poly-extrude';
12
13  //if you use cdn,the namespace is polyextrude
14
15  //   const {
16  //       extrudePolygons,
17  //       extrudePolylines
18  //   } = window.polyextrude;
19
20  const polygons = [
21      //polygon
22      [
23          //outring
24          [
25              [x, y],
26              [x, y],
27              ...........
28          ],
29          //holes
30          [
31              [x, y],
32              [x, y], ...........
33          ],
34          ........
35
36      ],
37      //other polygons
38      ......
39  ];
40
41  const polylines = [
42      // polyline
43      [
44          [x, y],
45          [x, y],
46          ...........
47      ],
48      //polyline
49      [
50          [x, y],
51          [x, y],
52          ...........
53      ],
54  ];
55
56  const result = extrudePolygons(polygons, {
57      depth: 2
58  });
59  const {
60      positon,
61      normal,
62      uv,
63      indices
64  } = result;
65  //do something

API

extrudePolygons(polygons, options)

• polygons
• options.depth
• options.top Whether to display the top

1  const result = extrudePolygons(polygons, {
2      depth: 2
3  });
4  const {
5      positon,
6      normal,
7      uv,
8      indices
9  } = result;
10  //do something

building
buildings
china
muti polygon
ny buildings
custom shape

---

extrudePolygonsOnPath(polygons, options)

• polygons
• options.extrudePath is line
• options.openEnd
• options.openEndUV
• options.polygonRotation

1  const result = extrudePolygonsOnPath(polygons, {
2      extrudePath: [
3          [0, 0],
4          [100, 0]
5      ]
6  });
7  const {
8      positon,
9      normal,
10      uv,
11      indices
12  } = result;
13  //do something

base demo
with holes
with holes by custom shape
polygonRotation
extrude along spring
extrude taihu lake
extrude by curve

---

extrudePolylines(lines, options)

• lines
• options.depth
• options.lineWidth
• options.bottomStickGround Is the bottom attached to the ground
• options.pathUV generate Path UV

1   const result = extrudePolylines(polylines, {
2       depth: 2,
3       lineWidth: 2
4   });
5   const {
6       positon,
7       normal,
8       uv,
9       indices
10   } = result;
11   //do something

line
line uv
line pathUV
brige
brige bottomStickGround
extrude brige
spring
wall
street

---

cylinder(center, options)

• center
• options.radius
• options.height
• options.radialSegments

1const center = [0, 0];
2const result = cylinder(center, {
3
4    radius: 1,
5    height: 2,
6    radialSegments: 6
7
8});
9const {
10    positon,
11    normal,
12    uv,
13    indices
14
15} = result;
16//do something

cylinder

---

expandPaths(lines, options)

• lines
• options.lineWidth

1const result = expandPaths(polylines, {
2
3    cornerRadius: 0.5,
4    lineWidth: 2
5
6});
7const {
8
9    positon,
10    normal,
11    uv,
12    indices
13
14} = result;
15//do something

paths
street paths
brige paths

---

extrudeSlopes(lines, options)

• lines
• options.depth
• options.lineWidth
• options.side Which side serves as the slope, 'left' or 'right'
• options.sideDepth slope depth
• options.bottomStickGround Is the bottom attached to the ground
• options.pathUV generate Path UV

1const result = extrudeSlopes(polylines, {
2
3    depth: 1,
4    side: 'left',
5    sideDepth: 0,
6    lineWidth: 2
7
8});
9const {
10
11    positon,
12    normal,
13    uv,
14    indices
15
16} = result;
17//do something

slope
extrudeSlopes pathUV demo

---

expandTubes(lines, options)

• lines
• options.radius
• options.radialSegments

1const result = expandTubes(polylines, {
2
3    radius: 1,
4    radialSegments: 8
5
6});
7const {
8
9    positon,
10    normal,
11    uv,
12    indices
13
14} = result;
15//do something

tube

---

plane(width, height,devideW,devideH)

• width
• height
• devideW
• devideH

1const result = plane(100, 100, 10, 10);
2const {
3
4    positon,
5    normal,
6    uv,
7    indices
8
9} = result;
10//do something

plane demo
custom terrain demo

---

polygons(polygons, options)

• polygons

1  const result = polygons(polygons, {
2
3  });
4  const {
5      positon,
6      normal,
7      uv,
8      indices
9  } = result;
10  //do something

polygons demo