---
title: Point.translate()
---

The `Point.translate()` method returns a new `Point` with a [translate
transform](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translate)
applied.

## Signature

```js
Point point.translate(float deltaX, float deltaY)
```

In other words, this will:

- Add `deltaX` to the point's X-coordinate
- Add `deltaY` to the point's Y-coordinate

Positive values for `deltaX` will move the point to the right.
Positive values for `deltaY` will move the point downwards.

## Example

<Example caption="An example of the Point.translate() method">
```js
({ Point, points, Path, paths, Snippet, snippets, macro, part }) => {

points.A = new Point(10, 10).setText("Point A", "text-sm")
points.B = points.A.translate(120, 60)
.setText(
"Point B is point A with a\ntranslate(120, 60)\ntransform applied",
"right text-sm"
)
.attr("data-text-dy", -6)
.attr("data-text-lineheight", 6)

snippets.A = new Snippet("x", points.A)
snippets.B = new Snippet("x", points.B)

macro("ld", {
from: points.A,
to: points.B,
text: "translate(120,60)",
noStartMarker: true,
force: true,
})

// Bounding box
paths.bbox = new Path()
.move(new Point(10, 10))
.move(new Point(130, 80))

return part
}

```
</Example>
```
