# How to add scale and color to the converted annotation

**URL:** <https://pdfjs.community/t/how-to-add-scale-and-color-to-the-converted-annotation/305>\
**Category:** Technical Support\
**Tags:** pdfjs-express\
**Created:** [September 29, 2020, 12:26pm UTC](https://pdfjs.community/t/how-to-add-scale-and-color-to-the-converted-annotation/305 "2020-09-29T12:26:31Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![kiran.patil](https://avatars.discourse-cdn.com/v4/letter/k/f08c70/32.png) [@kiran.patil](https://pdfjs.community/u/kiran.patil)\
**Post date:** [September 29, 2020, 12:26pm UTC](https://pdfjs.community/t/how-to-add-scale-and-color-to-the-converted-annotation/305/1 "2020-09-29T12:26:31Z")

</div>

Hi,  
As per the solution that you have provided to me for 3rd question from here - [[SOS] Unable to find some workings in Pdfjs-express](https://pdfjs.community/t/sos-unable-to-find-some-workings-in-pdfjs-express/248)

I am converting area measurement annotation to linear measurement annotation.  
Here I am getting values in inches, but I want it in meters with my custom scale, like 1m=100m.  
Also how can I set color to it.?  
How can I set scale before `annotManager.addAnnotation(newAnnot); annotManager.redrawAnnotation(newAnnot)`? I mean how can I set scale and color before exportAnnotations().  
How can I use `setStyles()` or `setAnnotationStyles()` in here?

Here is the code snippet which you have provided to me.

````javascript
  const annots = annotManager.getAnnotationsList();
  annots.forEach((annot) => {
    if (annot instanceof Annotations.PolygonAnnotation && annot.IT === "PolygonDimension") {
      const newAnnot = new Annotations.PolylineAnnotation();
      const paths = annot.getPath();
      paths.forEach(path => {
        newAnnot.addPathPoint(path.x, path.y);
      })
      newAnnot.Measure = annot.Measure;
      newAnnot.IT = 'PolyLineDimension';
      newAnnot.adjustRect();

      annotManager.deleteAnnotation(annot);
      annotManager.addAnnotation(newAnnot);
      annotManager.redrawAnnotation(newAnnot)
    }
  }) ```
````

---

<div class="post-metadata">

**Author:** ![Logan](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/logan/32/13_2.png) [@Logan](https://pdfjs.community/u/Logan)\
**Post date:** [September 29, 2020, 3:19pm UTC](https://pdfjs.community/t/how-to-add-scale-and-color-to-the-converted-annotation/305/2 "2020-09-29T15:19:24Z")

</div>

Hi!

To change the color of the annotation you can set the `FillColor` and/or the `StrokeColor` on the annotation.

```javascript
newAnnot.StrokeColor = new Annotations.Color(255, 0, 0, 1); // (rgba)
newAnnot.FillColor = new Annotations.Color(255, 0, 0, 1); // (rgba)

```

To change the scale you need to set the scale on the tool that is used to create the annot. In this case it’s `AnnotationCreatePerimeterMeasurement`.

You can find documentation [here](https://pdfjs.express/documentation/measurement/customize).

Thanks!  
Logan