2021-10-17 18:26:00 +02:00
|
|
|
---
|
|
|
|
title: buttonhole-end
|
|
|
|
---
|
2021-08-25 16:09:31 +02:00
|
|
|
|
2022-10-02 18:04:20 +02:00
|
|
|
The `buttonhole-end` snippet is used to mark buttonhole placement.
|
|
|
|
This particular snippet places the buttonhole's end on its
|
|
|
|
anchor point.
|
2021-08-25 16:09:31 +02:00
|
|
|
|
2023-10-29 17:20:35 +01:00
|
|
|
It is provided by [plugin-annotations](/reference/plugins/annotations/), which is
|
|
|
|
part of [core-plugins](/reference/plugins/core) (so it is available by default).
|
2022-10-02 18:04:20 +02:00
|
|
|
|
|
|
|
## Example
|
|
|
|
|
|
|
|
<Example caption="An example of the buttonhole-end snippet">
|
2021-08-25 16:09:31 +02:00
|
|
|
```js
|
2022-10-02 18:04:20 +02:00
|
|
|
({ Point, Path, paths, Snippet, snippets, part }) => {
|
2021-08-25 16:09:31 +02:00
|
|
|
|
2022-10-02 18:04:20 +02:00
|
|
|
snippets.demo = new Snippet('buttonhole-end', new Point(0,0))
|
2021-08-25 16:09:31 +02:00
|
|
|
|
2022-10-02 18:04:20 +02:00
|
|
|
// Show alignment
|
|
|
|
paths.anchor = new Path()
|
|
|
|
.move(new Point(-5, 0))
|
|
|
|
.line(new Point(5, 0))
|
|
|
|
.addClass('dotted note stroke-sm')
|
2021-08-25 16:09:31 +02:00
|
|
|
|
2022-10-02 18:04:20 +02:00
|
|
|
// Prevent clipping
|
|
|
|
paths.diag = new Path()
|
|
|
|
.move(new Point(-50,-4))
|
|
|
|
.move(new Point(50,4))
|
2021-08-25 16:09:31 +02:00
|
|
|
|
2022-10-02 18:04:20 +02:00
|
|
|
return part
|
|
|
|
}
|
|
|
|
```
|
|
|
|
</Example>
|
2021-08-25 16:09:31 +02:00
|
|
|
|
2022-10-02 18:04:20 +02:00
|
|
|
## Notes
|
|
|
|
|
|
|
|
We provide three buttonhole snippets with a different alignment:
|
2021-08-25 16:09:31 +02:00
|
|
|
|
2022-10-02 18:04:20 +02:00
|
|
|
- [buttonhole](/reference/snippets/buttonhole/): Anchor point is the middle of the buttonhole
|
|
|
|
- [buttonhole-start](/reference/snippets/buttonhole-start/): Anchor point is the start of the buttonhole
|
|
|
|
- [buttonhole-end](/reference/snippets/buttonhole-end/): Anchor point is the end of the buttonhole
|