adapted y layout to render labels correctly.

Fixed a bug.

src/MusicalScore/Graphical/MusicSheetCalculator.ts

@@ -107,7 +107,7 @@ export abstract class MusicSheetCalculator {
         this.graphicalMusicSheet = graphicalMusicSheet;
         this.rules = graphicalMusicSheet.ParentMusicSheet.rules;
         this.prepareGraphicalMusicSheet();
-        this.calculate();
+        //this.calculate();
     }
 
     public prepareGraphicalMusicSheet(): void {
@@ -828,7 +828,7 @@ export abstract class MusicSheetCalculator {
     }
 
     protected calculatePageLabels(page: GraphicalMusicPage): void {
-        let relative: PointF2D = new PointF2D();
+
         let firstSystemAbsoluteTopMargin: number = 10;
         if (page.MusicSystems.length > 0) {
             let firstMusicSystem: MusicSystem = page.MusicSystems[0];
@@ -838,6 +838,7 @@ export abstract class MusicSheetCalculator {
             let title: GraphicalLabel = this.graphicalMusicSheet.Title;
             title.PositionAndShape.Parent = page.PositionAndShape;
             page.PositionAndShape.ChildElements.push(title.PositionAndShape);
+            let relative: PointF2D = new PointF2D();
             relative.x = this.graphicalMusicSheet.ParentMusicSheet.pageWidth / 2;
             relative.y = this.rules.TitleTopDistance + this.rules.SheetTitleHeight;
             title.PositionAndShape.RelativePosition = relative;
@@ -847,6 +848,7 @@ export abstract class MusicSheetCalculator {
             let subtitle: GraphicalLabel = this.graphicalMusicSheet.Subtitle;
             subtitle.PositionAndShape.Parent = page.PositionAndShape;
             page.PositionAndShape.ChildElements.push(subtitle.PositionAndShape);
+            let relative: PointF2D = new PointF2D();
             relative.x = this.graphicalMusicSheet.ParentMusicSheet.pageWidth / 2;
             relative.y = this.rules.TitleTopDistance + this.rules.SheetTitleHeight + this.rules.SheetMinimumDistanceBetweenTitleAndSubtitle;
             subtitle.PositionAndShape.RelativePosition = relative;
@@ -857,6 +859,7 @@ export abstract class MusicSheetCalculator {
             composer.PositionAndShape.Parent = page.PositionAndShape;
             page.PositionAndShape.ChildElements.push(composer.PositionAndShape);
             composer.setLabelPositionAndShapeBorders();
+            let relative: PointF2D = new PointF2D();
             relative.x = this.graphicalMusicSheet.ParentMusicSheet.pageWidth - this.rules.PageRightMargin;
             relative.y = firstSystemAbsoluteTopMargin - this.rules.SystemComposerDistance;
             composer.PositionAndShape.RelativePosition = relative;
@@ -867,6 +870,7 @@ export abstract class MusicSheetCalculator {
             lyricist.PositionAndShape.Parent = page.PositionAndShape;
             page.PositionAndShape.ChildElements.push(lyricist.PositionAndShape);
             lyricist.setLabelPositionAndShapeBorders();
+            let relative: PointF2D = new PointF2D();
             relative.x = this.rules.PageLeftMargin;
             relative.y = firstSystemAbsoluteTopMargin - this.rules.SystemComposerDistance;
             lyricist.PositionAndShape.RelativePosition = relative;

src/MusicalScore/Graphical/VexFlow/VexFlowMusicSheetCalculator.ts

@@ -137,11 +137,12 @@ export class VexFlowMusicSheetCalculator extends MusicSheetCalculator {
         for (let idx: number = 0, len: number = this.graphicalMusicSheet.MusicPages.length; idx < len; ++idx) {
             let graphicalMusicPage: GraphicalMusicPage = this.graphicalMusicSheet.MusicPages[idx];
             if (!this.leadSheet) {
-                let globalY: number = 0;
+                let globalY: number = this.rules.PageTopMargin + this.rules.TitleTopDistance + this.rules.SheetTitleHeight +
+                    this.rules.TitleBottomDistance;
                 for (let idx2: number = 0, len2: number = graphicalMusicPage.MusicSystems.length; idx2 < len2; ++idx2) {
                     let musicSystem: MusicSystem = graphicalMusicPage.MusicSystems[idx2];
                     // calculate y positions of stafflines within system
-                    let y: number = 10;
+                    let y: number = 0;
                     for (let line of musicSystem.StaffLines) {
                         line.PositionAndShape.RelativePosition.y = y;
                         y += 10;
@@ -149,7 +150,7 @@ export class VexFlowMusicSheetCalculator extends MusicSheetCalculator {
                     // set y positions of systems using the previous system and a fixed distance.
                     musicSystem.PositionAndShape.BorderBottom = y + 0;
                     musicSystem.PositionAndShape.RelativePosition.y = globalY;
-                    globalY += y + 0;
+                    globalY += y + 5;
                 }
             }
         }

src/MusicalScore/Graphical/VexFlow/VexFlowMusicSheetDrawer.ts

@@ -75,20 +75,20 @@ export class VexFlowMusicSheetDrawer extends MusicSheetDrawer {
      */
     protected renderLabel(graphicalLabel: GraphicalLabel, layer: number, bitmapWidth: number,
                           bitmapHeight: number, heightInPixel: number, screenPosition: PointF2D): void {
-        if (screenPosition.y < 0) {
-            // Temportary solution for title labels
-            let div: HTMLElement = document.createElement("div");
-            div.style.fontSize = (graphicalLabel.Label.fontHeight * this.zoom * 10.0) + "px";
-            //span.style.width = (bitmapWidth * this.zoom * 1.1) + "px";
-            //span.style.height = (bitmapHeight * this.zoom * 1.1) + "px";
-            //span.style.overflow = "hidden";
-            div.style.fontFamily = "Times New Roman";
-            //span.style.marginLeft = (screenPosition.x * this.zoom) + "px";
-            div.style.textAlign = "center";
-            div.appendChild(document.createTextNode(graphicalLabel.Label.text));
-            this.titles.appendChild(div);
-            return;
-        }
+        // if (screenPosition.y < 0) {
+        //     // Temportary solution for title labels
+        //     let div: HTMLElement = document.createElement("div");
+        //     div.style.fontSize = (graphicalLabel.Label.fontHeight * this.zoom * 10.0) + "px";
+        //     //span.style.width = (bitmapWidth * this.zoom * 1.1) + "px";
+        //     //span.style.height = (bitmapHeight * this.zoom * 1.1) + "px";
+        //     //span.style.overflow = "hidden";
+        //     div.style.fontFamily = "Times New Roman";
+        //     //span.style.marginLeft = (screenPosition.x * this.zoom) + "px";
+        //     div.style.textAlign = "center";
+        //     div.appendChild(document.createTextNode(graphicalLabel.Label.text));
+        //     this.titles.appendChild(div);
+        //     return;
+        // }
         let ctx: CanvasRenderingContext2D = (this.vfctx as any).vexFlowCanvasContext;
         let old: string = ctx.font;
         ctx.font = VexFlowConverter.font(