cleaned up docs for network, added fontfill for nodes

examples/network/02_random_nodes.html

@@ -8,6 +8,8 @@
       font: 10pt sans;
     }
     #mynetwork {
+        width: 600px;
+        height: 600px;
       border: 1px solid lightgray;
     }
   </style>
@@ -74,9 +76,7 @@
         nodes: nodes,
         edges: edges
       };
-
-      var options = {
-      };
+      var options = {};
       network = new vis.Network(container, data, options);
 
       // add event listeners

lib/network/Edge.js

@@ -71,7 +71,7 @@ Edge.prototype.setProperties = function(properties) {
   }
 
   var fields = ['style','fontSize','fontFace','fontColor','fontFill','width',
-    'widthSelectionMultiplier','hoverWidth','arrowScaleFactor','dash'
+    'widthSelectionMultiplier','hoverWidth','arrowScaleFactor','dash','inheritColor'
   ];
   util.selectiveDeepExtend(fields, this.options, properties);
 
@@ -85,11 +85,6 @@ Edge.prototype.setProperties = function(properties) {
   if (properties.value !== undefined)        {this.value = properties.value;}
   if (properties.length !== undefined)       {this.physics.springLength = properties.length;}
 
-  // scale the arrow
-  if (properties.arrowScaleFactor !== undefined)       {this.options.arrowScaleFactor = properties.arrowScaleFactor;}
-
-  if (properties.inheritColor !== undefined)       {this.options.inheritColor = properties.inheritColor;}
-
   if (properties.color !== undefined) {
     this.options.inheritColor = false;
     if (util.isString(properties.color)) {

lib/network/Network.js

@@ -62,10 +62,10 @@ function Network (container, data, options) {
       image: undefined,
       widthMin: 16, // px
       widthMax: 64, // px
-      fixed: false,
       fontColor: 'black',
       fontSize: 14, // px
       fontFace: 'verdana',
+      fontFill: undefined,
       level: -1,
       color: {
           border: '#2B7CE9',
@@ -83,11 +83,12 @@ function Network (container, data, options) {
       backgroundColor: '#97C2FC',
       highlightColor: '#D2E5FF',
       group: undefined,
-      borderWidth: 1
+      borderWidth: 1,
+      borderWidthSelected: undefined
     },
     edges: {
-      widthMin: 1,
-      widthMax: 15,
+      widthMin: 1, //
+      widthMax: 15,//
       width: 1,
       widthSelectionMultiplier: 2,
       hoverWidth: 1.5,

lib/network/Node.js

@@ -136,7 +136,7 @@ Node.prototype.setProperties = function(properties, constants) {
   }
 
   var fields = ['borderWidth','borderWidthSelected','shape','image','radius','fontColor',
-    'fontSize','fontFace','group','mass'
+    'fontSize','fontFace','fontFill','group','mass'
   ];
   util.selectiveDeepExtend(fields, this.options, properties);
 
@@ -844,7 +844,6 @@ Node.prototype._drawText = function (ctx) {
 Node.prototype._label = function (ctx, text, x, y, align, baseline, labelUnderNode) {
   if (text && Number(this.options.fontSize) * this.networkScale > this.fontDrawThreshold) {
     ctx.font = (this.selected ? "bold " : "") + this.options.fontSize + "px " + this.options.fontFace;
-    ctx.fillStyle = this.options.fontColor || "black";
     ctx.textAlign = align || "center";
     ctx.textBaseline = baseline || "middle";
 
@@ -856,6 +855,18 @@ Node.prototype._label = function (ctx, text, x, y, align, baseline, labelUnderNo
       yLine = y + (1 - lineCount) / (2 * fontSize);
     }
 
+    // font fill from edges now for nodes!
+    if (this.options.fontFill !== undefined && this.options.fontFill !== null && this.options.fontFill !== "none") {
+      var width = ctx.measureText(text).width;
+      var height = this.options.fontSize;
+      var left = x - width / 2;
+      var top = y - height / 2;
+      ctx.fillStyle = this.options.fontFill;
+      ctx.fillRect(left, top, width, height);
+    }
+
+    // draw text
+    ctx.fillStyle = this.options.fontColor || "black";
     for (var i = 0; i < lineCount; i++) {
       ctx.fillText(lines[i], x, yLine);
       yLine += fontSize;