JUMLY can change arrow style

September 21, 2013

A JavaScript library, JUMLY, is to render UML sequence diagrams. It can change styles whatever you want even arrows.

Here is a simple example.

On the other hand, here is a styled one.

Here is the style. Put this in your <style>

.sequence-diagram .message svg.arrow line {
  stroke-width: 3px;
  stroke: #8bc84b;
  stroke-dasharray: 8, 4;
}
.sequence-diagram .message svg.arrow polyline {
  stroke: #8bc84b;
  fill: #8bc84b;
}

As you can see, arrow is rendered with SVG. So many properties are prepared. In detail, please see here, http://www.w3.org/TR/SVG/styling.html#SVGStylingProperties.