Open jaredjj3 opened 1 month ago
This looks like an issue specifically with rect in svgcontext. Unlike line and path, svgcontext.rect is a single call - it doesn't build a path and then call stroke to close if off (even though all 3 shapes end up in a single svg element). There is a way to pass the line attributes into rect specifically, but no way to call it on the rendercontext interface.
It would be pretty simple to change svgcontext.rect to do something like:
rect(x: number, y: number, width: number, height: number, attributes?: Attributes): this {
// ...
attributes = attributes ?? { fill: 'none', 'stroke-width': this.lineWidth }; // don't assign stroke here
attributes.stroke = (typeof(attributes.stroke) === 'undefined' && typeof(this.attributes.stroke) === 'string') ?
this.attributes.stroke : 'black';
That shouldn't break anything, unless existing apps are used to leave the 'stroke' value as something strange, and then use rect.
I'm using
RenderContext
as a convenient way to render shapes on top of a vexflow music sheet. I'm drawing rectangles like this:When I draw with
SVGContext
, the stroke style is always black. When I draw withCanvasContext
, the stroke style is correct. FWIW,SVGContext.arc
seems to work correctly (which is evident by the red circles).SVG
Canvas