SVG Text Rotation Crop

by Rajesh Danabal

HTML

<svg>
  <g transform="translate(150, 0)">
    <text id='text'
      text-anchor="end"
      transform="rotate(-35)"
    >
      Lorem ipsum dolor sit amet
    </text>
  </g>
</svg>

JavaScript

//-- Truncate function
function truncate(string,limit){
  if(string.length > limit){
    return string.substring(0,limit)+"...";
  }
  else {
    return string;
  }
}

//-- Example
var text = "Lorem ipsum dolor sit amet";
console.log(truncate(text,15));

//-- Write in HTML
document.getElementById('text').innerHTML = truncate(text,15);