spatialillusions / milsymbol

Military Symbols in JavaScript
www.spatialillusions.com/milsymbol
MIT License
544 stars 133 forks source link

The quantity and the symbol modifier 2 are overriding each other #210

Closed YahavTheKing123 closed 5 years ago

YahavTheKing123 commented 5 years ago

Hi Mans :),

First, thanks for your help. Second, I am trying to create a symbol which involving two rows on the upper side of the icon. One is created thru the sidc (for example sidc: SfGaUC-----i--g which gives me the 2 XX above the icon representing its a division). the problem is that i am trying to add one more row more mentioning other data related to the unit on the upper side of the icon. so, i am using the quantity field. but instead of the quantity text will be above the division (the XX) its overrwites it... How can i solve this issue?

Thanks in advance.

spatialillusions commented 5 years ago

This is by design, since according the to the standard they should not be use at the same time. For solving this I would suggest that you do something similar to how I helped you with the text at the bottom. You can contact me by email if you want, and I will calculate an offer of what I would charge to write the code that solves that.

YahavTheKing123 commented 5 years ago

Hi Mans,

I followed your instructions and copy the behavior you created in the bottom text to upper text, and its working!.

I just want you to approve its ok to change the this.bbox.y1, since if i am not channing it, the upper text is being cutted since the svg viewport values are to narrow...

export default function upperText(ms) { var drawArray1 = []; var drawArray2 = []; var gbbox = new ms.BBox();

if (!this.options.hasOwnProperty("upperText") || !this.options.upperText) { return { pre: drawArray1, post: drawArray2, bbox: gbbox }; }

var str = this.options.upperText;

var fontColor = (typeof this.style.infoColor === "object" ? this.style.infoColor[this.metadata.affiliation] : this.style.infoColor) || this.colors.iconColor[this.metadata.affiliation] || this.colors.iconColor["Friend"]; var fontFamily = this.style.fontfamily; var fontSize = this.style.infoSize;

var strWidth = str.length (fontSize / 30) 28.5 / 2; // var y = this.bbox.y1 - 100; var y = this.bbox.y1; this.bbox.y1 = this.bbox.y1 - 25;

gbbox.y1 = y; gbbox.x1 = 100 - strWidth; gbbox.x2 = 100 + strWidth;

drawArray2.push({ type: "text", text: str, x: 100, y: y, textanchor: "middle", fontsize: fontSize, fontfamily: fontFamily, fill: fontColor, stroke: false, fontweight: "bold" });

if (this.style.outlineWidth > 0) drawArray1.push( ms.outline( drawArray2, this.style.outlineWidth, this.style.strokeWidth, typeof this.style.outlineColor === "object" ? this.style.outlineColor[this.metadata.affiliation] : this.style.outlineColor ) ); return { pre: drawArray1, post: drawArray2, bbox: gbbox }; }