SciChart® the market leader in Fast WPF Charts, WPF 3D Charts, iOS Chart, Android Chart and JavaScript Chart Components

1
0

Hi,

Is it possible to either rotate a TextAnnotation, not necessarily by user interaction but even just in code to have text going vertically?

Cheers,

Version
2.1.2301
  • You must to post comments
1
0

Unfortunately TextAnnotation doesn’t currently support rotation directly, and the part that creates the svg itself is not simple to override. For the moment it would actually be easiest to use CustomAnnotation to do this.

const rotatedText = new CustomAnnotation({ x1: 0, y1: 7});
rotatedText.svgString = `<svg class="scichart__text-annotation">
    <text x="1" y="1" fill="red" font-size="18" font-family="Arial" transform="rotate(45)">This Text is Rotated</text>
</svg>`;

SVG itself has very good rotation support, via the transform property which can include rotations and translations. The significantly tricky bit is getting the centre of rotation correct so that you can place the text where you expect. This SO thread describes a few different strategies https://stackoverflow.com/questions/16713096/svg-text-rotation

Regards
David

  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.