-
Notifications
You must be signed in to change notification settings - Fork 266
/
layers.html
73 lines (52 loc) · 2.19 KB
/
layers.html
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
---
title: Layers
---
<p>
Layers are a way of logically grouping your paths or models as you see fit. Simply add a <code>layer</code> property to any path or model object, with the name of the layer.
Every path within a model will automatically inherit its parent model's layer, unless it has its own layer property. As you can see in this example, a layer can transcend the logical grouping boundaries of models:
</p>
{% highlight javascript %}
//render a round rectangle with arcs in their own layer
var makerjs = require('makerjs');
var roundRect = new makerjs.models.RoundRectangle(100, 50, 10);
roundRect.layer = "layer1";
roundRect.paths.BottomLeft.layer = "layer2";
roundRect.paths.BottomRight.layer = "layer2";
roundRect.paths.TopRight.layer = "layer2";
roundRect.paths.TopLeft.layer = "layer2";
var svg = makerjs.exporter.toSVG(roundRect);
document.write(svg);
{% endhighlight %}
<script>
LiveDoc.evalLastCode();
</script>
<i>Layers are not visible in this example but they logically exist to separate arcs from straight lines.</i>
<p>
A layer name can be any string. Furthermore, you can use a reserved color name from this list to get an automatic stroke color when your model is exported in DXF or SVG:
<br/>
aqua, black, blue, fuchsia, green, gray, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, yellow
</p>
{% highlight javascript %}
//render a round rectangle with arcs in their own color layer
var makerjs = require('makerjs');
var roundRect = new makerjs.models.RoundRectangle(100, 50, 10);
roundRect.layer = "layer1";
roundRect.paths.BottomLeft.layer = "red";
roundRect.paths.BottomRight.layer = "red";
roundRect.paths.TopRight.layer = "blue";
roundRect.paths.TopLeft.layer = "blue";
var svg = makerjs.exporter.toSVG(roundRect);
document.write(svg);
{% endhighlight %}
<script>
LiveDoc.evalLastCode();
</script>
<hr />
<p>
Layers will be output during the export process in these formats:
<ul>
<li>DXF - paths will be assigned to a DXF layer.</li>
<li>SVG - in continuous mode, a new <path> element will be created for each layer.</li>
<!--li>OpenJsCad - extrusion depth can be specified by layer.</li-->
</ul>
</p>