|
@ -211,11 +211,12 @@ function Network (container, data, options) { |
|
|
hideNodesOnDrag: false, |
|
|
hideNodesOnDrag: false, |
|
|
width : '100%', |
|
|
width : '100%', |
|
|
height : '100%', |
|
|
height : '100%', |
|
|
selectable: true, |
|
|
|
|
|
pixelRatio:1 |
|
|
|
|
|
|
|
|
selectable: true |
|
|
}; |
|
|
}; |
|
|
this.constants = util.extend({}, this.defaultOptions); |
|
|
this.constants = util.extend({}, this.defaultOptions); |
|
|
|
|
|
|
|
|
|
|
|
this.pixelRatio = 1; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.hoverObj = {nodes:{},edges:{}}; |
|
|
this.hoverObj = {nodes:{},edges:{}}; |
|
|
this.controlNodesActive = false; |
|
|
this.controlNodesActive = false; |
|
|
this.navigationHammers = {existing:[], new: []}; |
|
|
this.navigationHammers = {existing:[], new: []}; |
|
@ -744,7 +745,7 @@ Network.prototype._create = function () { |
|
|
|
|
|
|
|
|
var ctx = this.frame.canvas.getContext("2d"); |
|
|
var ctx = this.frame.canvas.getContext("2d"); |
|
|
|
|
|
|
|
|
this.constants.pixelRatio = (window.devicePixelRatio || 1) / (ctx.webkitBackingStorePixelRatio || |
|
|
|
|
|
|
|
|
this.pixelRatio = (window.devicePixelRatio || 1) / (ctx.webkitBackingStorePixelRatio || |
|
|
ctx.mozBackingStorePixelRatio || |
|
|
ctx.mozBackingStorePixelRatio || |
|
|
ctx.msBackingStorePixelRatio || |
|
|
ctx.msBackingStorePixelRatio || |
|
|
ctx.oBackingStorePixelRatio || |
|
|
ctx.oBackingStorePixelRatio || |
|
@ -752,7 +753,7 @@ Network.prototype._create = function () { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.frame.canvas.getContext("2d").setTransform(this.constants.pixelRatio, 0, 0, this.constants.pixelRatio, 0, 0); |
|
|
|
|
|
|
|
|
this.frame.canvas.getContext("2d").setTransform(this.pixelRatio, 0, 0, this.pixelRatio, 0, 0); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
//////////////////////////////////////////////////////////////////
|
|
|
//////////////////////////////////////////////////////////////////
|
|
@ -1351,8 +1352,8 @@ Network.prototype.setSize = function(width, height) { |
|
|
this.frame.canvas.style.width = '100%'; |
|
|
this.frame.canvas.style.width = '100%'; |
|
|
this.frame.canvas.style.height = '100%'; |
|
|
this.frame.canvas.style.height = '100%'; |
|
|
|
|
|
|
|
|
this.frame.canvas.width = this.frame.canvas.clientWidth * this.constants.pixelRatio; |
|
|
|
|
|
this.frame.canvas.height = this.frame.canvas.clientHeight * this.constants.pixelRatio; |
|
|
|
|
|
|
|
|
this.frame.canvas.width = this.frame.canvas.clientWidth * this.pixelRatio; |
|
|
|
|
|
this.frame.canvas.height = this.frame.canvas.clientHeight * this.pixelRatio; |
|
|
|
|
|
|
|
|
this.constants.width = width; |
|
|
this.constants.width = width; |
|
|
this.constants.height = height; |
|
|
this.constants.height = height; |
|
@ -1363,18 +1364,18 @@ Network.prototype.setSize = function(width, height) { |
|
|
// this would adapt the width of the canvas to the width from 100% if and only if
|
|
|
// this would adapt the width of the canvas to the width from 100% if and only if
|
|
|
// there is a change.
|
|
|
// there is a change.
|
|
|
|
|
|
|
|
|
if (this.frame.canvas.width != this.frame.canvas.clientWidth * this.constants.pixelRatio) { |
|
|
|
|
|
this.frame.canvas.width = this.frame.canvas.clientWidth * this.constants.pixelRatio; |
|
|
|
|
|
|
|
|
if (this.frame.canvas.width != this.frame.canvas.clientWidth * this.pixelRatio) { |
|
|
|
|
|
this.frame.canvas.width = this.frame.canvas.clientWidth * this.pixelRatio; |
|
|
emitEvent = true; |
|
|
emitEvent = true; |
|
|
} |
|
|
} |
|
|
if (this.frame.canvas.height != this.frame.canvas.clientHeight * this.constants.pixelRatio) { |
|
|
|
|
|
this.frame.canvas.height = this.frame.canvas.clientHeight * this.constants.pixelRatio; |
|
|
|
|
|
|
|
|
if (this.frame.canvas.height != this.frame.canvas.clientHeight * this.pixelRatio) { |
|
|
|
|
|
this.frame.canvas.height = this.frame.canvas.clientHeight * this.pixelRatio; |
|
|
emitEvent = true; |
|
|
emitEvent = true; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
if (emitEvent == true) { |
|
|
if (emitEvent == true) { |
|
|
this.emit('resize', {width:this.frame.canvas.width * this.constants.pixelRatio,height:this.frame.canvas.height * this.constants.pixelRatio, oldWidth: oldWidth * this.constants.pixelRatio, oldHeight: oldHeight * this.constants.pixelRatio}); |
|
|
|
|
|
|
|
|
this.emit('resize', {width:this.frame.canvas.width * this.pixelRatio,height:this.frame.canvas.height * this.pixelRatio, oldWidth: oldWidth * this.pixelRatio, oldHeight: oldHeight * this.pixelRatio}); |
|
|
} |
|
|
} |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
@ -1724,11 +1725,11 @@ Network.prototype.redraw = function() { |
|
|
Network.prototype._redraw = function() { |
|
|
Network.prototype._redraw = function() { |
|
|
var ctx = this.frame.canvas.getContext('2d'); |
|
|
var ctx = this.frame.canvas.getContext('2d'); |
|
|
|
|
|
|
|
|
ctx.setTransform(this.constants.pixelRatio, 0, 0, this.constants.pixelRatio, 0, 0); |
|
|
|
|
|
|
|
|
ctx.setTransform(this.pixelRatio, 0, 0, this.pixelRatio, 0, 0); |
|
|
|
|
|
|
|
|
// clear the canvas
|
|
|
// clear the canvas
|
|
|
var w = this.frame.canvas.width * this.constants.pixelRatio; |
|
|
|
|
|
var h = this.frame.canvas.height * this.constants.pixelRatio; |
|
|
|
|
|
|
|
|
var w = this.frame.canvas.width * this.pixelRatio; |
|
|
|
|
|
var h = this.frame.canvas.height * this.pixelRatio; |
|
|
ctx.clearRect(0, 0, w, h); |
|
|
ctx.clearRect(0, 0, w, h); |
|
|
|
|
|
|
|
|
// set scaling and translation
|
|
|
// set scaling and translation
|
|
@ -1741,8 +1742,8 @@ Network.prototype._redraw = function() { |
|
|
"y": this._YconvertDOMtoCanvas(0) |
|
|
"y": this._YconvertDOMtoCanvas(0) |
|
|
}; |
|
|
}; |
|
|
this.canvasBottomRight = { |
|
|
this.canvasBottomRight = { |
|
|
"x": this._XconvertDOMtoCanvas(this.frame.canvas.clientWidth * this.constants.pixelRatio), |
|
|
|
|
|
"y": this._YconvertDOMtoCanvas(this.frame.canvas.clientHeight * this.constants.pixelRatio) |
|
|
|
|
|
|
|
|
"x": this._XconvertDOMtoCanvas(this.frame.canvas.clientWidth * this.pixelRatio), |
|
|
|
|
|
"y": this._YconvertDOMtoCanvas(this.frame.canvas.clientHeight * this.pixelRatio) |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|