@teachinglab/omd 0.7.29 → 0.7.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teachinglab/omd",
-  "version": "0.7.29",
+  "version": "0.7.30",
   "description": "omd",
   "main": "./index.js",
   "module": "./index.js",

package/src/omdShapes.js

@@ -264,6 +264,7 @@ export class omdEllipse extends jsvgGroup
         this.rectWidth = 10;
         this.rectHeight = 5;
         this.unitScale = 10;
+        this.showLabels = false;
 
         this.shapePath = new jsvgEllipse();
         this.shapePath.setWidthAndHeight( this.rectWidth*this.unitScale, this.rectHeight*this.unitScale );
@@ -272,6 +273,9 @@ export class omdEllipse extends jsvgGroup
         this.shapePath.setFillColor( omdColor.lightGray );
         this.addChild( this.shapePath );
 
+        this.labelsHolder = new jsvgGroup();
+        this.addChild( this.labelsHolder );
+
         this.updateLayout();
     }
 
@@ -286,6 +290,9 @@ export class omdEllipse extends jsvgGroup
         if ( typeof data.unitScale != "undefined" )
             this.unitScale = data.unitScale;
 
+        if ( typeof data.showLabels != "undefined" )
+            this.showLabels = data.showLabels;
+
         this.updateLayout();
     }
 
@@ -297,6 +304,19 @@ export class omdEllipse extends jsvgGroup
         this.shapePath.setWidthAndHeight( ellipseWidth, ellipseHeight );
         this.shapePath.setPosition( ellipseWidth * 0.5 + 10, ellipseHeight * 0.5 + 10 );
 
+        this.labelsHolder.removeAllChildren();
+        if ( this.showLabels )
+        {
+            const label = new jsvgTextLine();
+            label.setAlignment("center");
+            label.setFontFamily( "Albert Sans" );
+            label.setFontColor( "black" );
+            label.setFontSize( 12 );
+            label.setPosition( ellipseWidth * 0.5 + 10, ellipseHeight * 0.5 + 14 );
+            label.setText( `${this.rectWidth} × ${this.rectHeight}` );
+            this.labelsHolder.addChild( label );
+        }
+
         // Set dimensions and viewBox for API compatibility
         this.width = this.rectWidth * this.unitScale + 20;
         this.height = this.rectHeight * this.unitScale + 20;
@@ -315,6 +335,7 @@ export class omdCircle extends jsvgGroup
 
         this.radius = 5;
         this.unitScale = 10;
+        this.showLabels = false;
 
         this.shapePath = new jsvgEllipse();
         this.shapePath.setWidthAndHeight( this.radius*this.unitScale, this.radius*this.unitScale );
@@ -323,6 +344,9 @@ export class omdCircle extends jsvgGroup
         this.shapePath.setFillColor( omdColor.lightGray );
         this.addChild( this.shapePath );
 
+        this.labelsHolder = new jsvgGroup();
+        this.addChild( this.labelsHolder );
+
         this.updateLayout();
     }
 
@@ -334,6 +358,9 @@ export class omdCircle extends jsvgGroup
         if ( typeof data.unitScale != "undefined" )
             this.unitScale = data.unitScale;
 
+        if ( typeof data.showLabels != "undefined" )
+            this.showLabels = data.showLabels;
+
         this.updateLayout();
     }
 
@@ -344,6 +371,19 @@ export class omdCircle extends jsvgGroup
         this.shapePath.setWidthAndHeight( diameter, diameter );
         this.shapePath.setPosition( this.radius * this.unitScale + 10, this.radius * this.unitScale + 10 );
 
+        this.labelsHolder.removeAllChildren();
+        if ( this.showLabels )
+        {
+            const label = new jsvgTextLine();
+            label.setAlignment("center");
+            label.setFontFamily( "Albert Sans" );
+            label.setFontColor( "black" );
+            label.setFontSize( 12 );
+            label.setPosition( this.radius * this.unitScale + 10, this.radius * this.unitScale + 14 );
+            label.setText( `r=${this.radius}` );
+            this.labelsHolder.addChild( label );
+        }
+
         // Set dimensions and viewBox for API compatibility
         this.width = 2.0 * this.radius * this.unitScale + 20;
         this.height = 2.0 * this.radius * this.unitScale + 20;