mirror of
https://github.com/UnickSoft/graphonline.git
synced 2025-07-01 23:36:00 +00:00
Fix drawing edges.
This commit is contained in:
parent
a40f927b66
commit
2172acb28f
@ -83,7 +83,7 @@ Application.prototype.redrawGraph = function()
|
|||||||
{
|
{
|
||||||
if (!this.isTimerRender)
|
if (!this.isTimerRender)
|
||||||
{
|
{
|
||||||
this._redrawGraph();
|
this._redrawGraphInWindow();
|
||||||
|
|
||||||
this.GraphTypeChanged();
|
this.GraphTypeChanged();
|
||||||
}
|
}
|
||||||
@ -93,7 +93,7 @@ Application.prototype.redrawGraphTimer = function()
|
|||||||
{
|
{
|
||||||
if (this.isTimerRender)
|
if (this.isTimerRender)
|
||||||
{
|
{
|
||||||
var context = this._redrawGraph();
|
var context = this._redrawGraphInWindow();
|
||||||
|
|
||||||
// Render path
|
// Render path
|
||||||
if (this.renderPath.length > 1)
|
if (this.renderPath.length > 1)
|
||||||
@ -173,7 +173,7 @@ Application.prototype.redrawGraphTimer = function()
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Application.prototype._redrawGraph = function()
|
Application.prototype._redrawGraphInWindow = function()
|
||||||
{
|
{
|
||||||
var context = this.canvas.getContext('2d');
|
var context = this.canvas.getContext('2d');
|
||||||
|
|
||||||
@ -182,14 +182,7 @@ Application.prototype._redrawGraph = function()
|
|||||||
context.scale(this.canvasScale, this.canvasScale);
|
context.scale(this.canvasScale, this.canvasScale);
|
||||||
context.translate(this.canvasPosition.x, this.canvasPosition.y);
|
context.translate(this.canvasPosition.x, this.canvasPosition.y);
|
||||||
|
|
||||||
var backgroundDrawer = new BaseBackgroundDrawer(context);
|
this._RedrawGraph(context, this.canvasPosition, this.backgroundCommonStyle, true);
|
||||||
|
|
||||||
backgroundDrawer.Draw(this.backgroundCommonStyle, Math.max(this.canvas.width, this.GetRealWidth()), Math.max(this.canvas.height, this.GetRealHeight()), this.canvasPosition, this.canvasScale);
|
|
||||||
|
|
||||||
this.RedrawEdges(context);
|
|
||||||
this.RedrawNodes(context);
|
|
||||||
if (this.selectionRect != null)
|
|
||||||
this.RedrawSelectionRect(context);
|
|
||||||
|
|
||||||
context.restore();
|
context.restore();
|
||||||
|
|
||||||
@ -208,12 +201,7 @@ Application.prototype._OffscreenRedrawGraph = function()
|
|||||||
|
|
||||||
context.translate(bbox.minPoint.inverse().x, bbox.minPoint.inverse().y);
|
context.translate(bbox.minPoint.inverse().x, bbox.minPoint.inverse().y);
|
||||||
|
|
||||||
var backgroundDrawer = new BaseBackgroundDrawer(context);
|
this._RedrawGraph(context, bbox.minPoint.inverse(), this.backgroundCommonStyle, false);
|
||||||
|
|
||||||
backgroundDrawer.Draw(this.backgroundCommonStyle, Math.max(this.canvas.width, this.GetRealWidth()), Math.max(this.canvas.height, this.GetRealHeight()), bbox.minPoint.inverse(), this.canvasScale);
|
|
||||||
|
|
||||||
this.RedrawEdges(context);
|
|
||||||
this.RedrawNodes(context);
|
|
||||||
|
|
||||||
context.restore();
|
context.restore();
|
||||||
|
|
||||||
@ -232,12 +220,9 @@ Application.prototype._PrintRedrawGraph = function()
|
|||||||
|
|
||||||
context.translate(bbox.minPoint.inverse().x, bbox.minPoint.inverse().y);
|
context.translate(bbox.minPoint.inverse().x, bbox.minPoint.inverse().y);
|
||||||
|
|
||||||
var backgroundDrawer = new BaseBackgroundDrawer(context);
|
this._RedrawGraph(context, bbox.minPoint.inverse(), this.backgroundCommonStyle, false,
|
||||||
|
this.vertexPrintCommonStyle, this.vertexPrintSelectedVertexStyles,
|
||||||
backgroundDrawer.Draw(this.backgroundPrintStyle, Math.max(this.canvas.width, this.GetRealWidth()), Math.max(this.canvas.height, this.GetRealHeight()), bbox.minPoint.inverse(), this.canvasScale);
|
this.edgePrintCommonStyle, this.edgePrintSelectedStyles);
|
||||||
|
|
||||||
this.RedrawEdges(context, this.edgePrintCommonStyle, this.edgePrintSelectedStyles);
|
|
||||||
this.RedrawNodes(context, this.vertexPrintCommonStyle, this.vertexPrintSelectedVertexStyles);
|
|
||||||
|
|
||||||
context.restore();
|
context.restore();
|
||||||
|
|
||||||
@ -339,24 +324,29 @@ Application.prototype.GetBaseArcDrawer = function(context, edge)
|
|||||||
return arcDrawer;
|
return arcDrawer;
|
||||||
}
|
}
|
||||||
|
|
||||||
Application.prototype.RedrawEdge = function(context, edge, ForceCommonStyle, ForceSelectedStyle)
|
Application.prototype.UpdateEdgeCurrentStyle = function(edge, ForceCommonStyle, ForceSelectedStyle)
|
||||||
|
{
|
||||||
|
var commonStyle = (ForceCommonStyle === undefined) ? this.edgeCommonStyle : ForceCommonStyle;
|
||||||
|
var selectedStyles = (ForceSelectedStyle === undefined) ? this.edgeSelectedStyles : ForceSelectedStyle;
|
||||||
|
|
||||||
|
var selectedGroup = this.handler.GetSelectedGroup(edge);
|
||||||
|
var currentStyle = selectedGroup > 0 ?
|
||||||
|
selectedStyles[(selectedGroup - 1) % selectedStyles.length] : commonStyle;
|
||||||
|
|
||||||
|
edge.currentStyle = currentStyle;
|
||||||
|
}
|
||||||
|
|
||||||
|
Application.prototype.RedrawEdge = function(context, edge)
|
||||||
{
|
{
|
||||||
var curvedArcDrawer = new CurvedArcDrawer(context, edge.model)
|
var curvedArcDrawer = new CurvedArcDrawer(context, edge.model)
|
||||||
var arcDrawer = this.GetBaseArcDrawer(context, edge);
|
var arcDrawer = this.GetBaseArcDrawer(context, edge);
|
||||||
|
|
||||||
var commonStyle = (ForceCommonStyle === undefined) ? this.edgeCommonStyle : ForceCommonStyle;
|
this._RedrawEdge(edge, arcDrawer);
|
||||||
var selectedStyle = (ForceSelectedStyle === undefined) ? this.edgeSelectedStyles : ForceSelectedStyle;
|
|
||||||
|
|
||||||
this._RedrawEdge(edge, arcDrawer, commonStyle, selectedStyle);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Application.prototype._RedrawEdge = function(edge, arcDrawer, commonStyle, selectedStyles)
|
Application.prototype._RedrawEdge = function(edge, arcDrawer, commonStyle, selectedStyles)
|
||||||
{
|
{
|
||||||
var selectedGroup = this.handler.GetSelectedGroup(edge);
|
this._RedrawEdgeWithStyle(edge, edge.currentStyle, arcDrawer, commonStyle, selectedStyles);
|
||||||
var currentStyle = selectedGroup > 0 ?
|
|
||||||
selectedStyles[(selectedGroup - 1) % selectedStyles.length] : commonStyle;
|
|
||||||
|
|
||||||
this._RedrawEdgeWithStyle(edge, currentStyle, arcDrawer, commonStyle, selectedStyles);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Application.prototype._RedrawEdgeWithStyle = function(edge, style, arcDrawer, commonStyle, selectedStyles)
|
Application.prototype._RedrawEdgeWithStyle = function(edge, style, arcDrawer, commonStyle, selectedStyles)
|
||||||
@ -372,17 +362,34 @@ Application.prototype.RedrawEdgeProgress = function(context, edge, progress)
|
|||||||
this._RedrawEdge(edge, arcDrawer, this.edgeCommonStyle, this.edgeSelectedStyles);
|
this._RedrawEdge(edge, arcDrawer, this.edgeCommonStyle, this.edgeSelectedStyles);
|
||||||
}
|
}
|
||||||
|
|
||||||
Application.prototype.RedrawEdges = function(context, ForceCommonStyle, ForceSelectedStyle)
|
Application.prototype.UpdateEdgesCurrentStyle = function(ForceCommonStyle, ForceSelectedStyle)
|
||||||
{
|
{
|
||||||
for (i = 0; i < this.graph.edges.length; i ++)
|
for (i = 0; i < this.graph.edges.length; i ++)
|
||||||
{
|
{
|
||||||
this.RedrawEdge(context, this.graph.edges[i], ForceCommonStyle, ForceSelectedStyle);
|
this.UpdateEdgeCurrentStyle(this.graph.edges[i], ForceCommonStyle, ForceSelectedStyle);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Application.prototype.RedrawNodes = function(context, ForceCommonStyle, ForceSelectedStyle)
|
Application.prototype.RedrawEdges = function(context)
|
||||||
|
{
|
||||||
|
for (i = 0; i < this.graph.edges.length; i ++)
|
||||||
|
{
|
||||||
|
this.RedrawEdge(context, this.graph.edges[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Application.prototype.RedrawNodes = function(context)
|
||||||
{
|
{
|
||||||
var graphDrawer = new BaseVertexDrawer(context);
|
var graphDrawer = new BaseVertexDrawer(context);
|
||||||
|
|
||||||
|
for (i = 0; i < this.graph.vertices.length; i ++)
|
||||||
|
{
|
||||||
|
graphDrawer.Draw(this.graph.vertices[i], this.graph.vertices[i].currentStyle.GetStyle({}));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Application.prototype.UpdateNodesCurrentStyle = function(ForceCommonStyle, ForceSelectedStyle)
|
||||||
|
{
|
||||||
var commonStyle = (ForceCommonStyle === undefined) ? this.vertexCommonStyle : ForceCommonStyle;
|
var commonStyle = (ForceCommonStyle === undefined) ? this.vertexCommonStyle : ForceCommonStyle;
|
||||||
var selectedStyle = (ForceSelectedStyle === undefined) ? this.vertexSelectedVertexStyles : ForceSelectedStyle;
|
var selectedStyle = (ForceSelectedStyle === undefined) ? this.vertexSelectedVertexStyles : ForceSelectedStyle;
|
||||||
|
|
||||||
@ -392,7 +399,7 @@ Application.prototype.RedrawNodes = function(context, ForceCommonStyle, ForceSel
|
|||||||
var currentStyle = selectedGroup > 0 ?
|
var currentStyle = selectedGroup > 0 ?
|
||||||
selectedStyle[(selectedGroup - 1) % selectedStyle.length] : commonStyle;
|
selectedStyle[(selectedGroup - 1) % selectedStyle.length] : commonStyle;
|
||||||
|
|
||||||
graphDrawer.Draw(this.graph.vertices[i], currentStyle.GetStyle({}));
|
this.graph.vertices[i].currentStyle = currentStyle;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -1635,3 +1642,24 @@ Application.prototype.GetStyle = function(type, styleName)
|
|||||||
|
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Application.prototype._RedrawGraph = function(context, backgroundPosition, backgroundStyle, bDrawSelectedRect,
|
||||||
|
forceVertexCommon, forceVertexSeleceted, forceEdgeCommon, forceEdgeSelected)
|
||||||
|
{
|
||||||
|
var backgroundDrawer = new BaseBackgroundDrawer(context);
|
||||||
|
|
||||||
|
backgroundDrawer.Draw(
|
||||||
|
backgroundStyle,
|
||||||
|
Math.max(this.canvas.width, this.GetRealWidth()),
|
||||||
|
Math.max(this.canvas.height, this.GetRealHeight()),
|
||||||
|
backgroundPosition,
|
||||||
|
this.canvasScale);
|
||||||
|
|
||||||
|
this.UpdateEdgesCurrentStyle(forceEdgeCommon, forceEdgeSelected);
|
||||||
|
this.UpdateNodesCurrentStyle(forceVertexCommon, forceVertexSeleceted);
|
||||||
|
|
||||||
|
this.RedrawEdges(context);
|
||||||
|
this.RedrawNodes(context);
|
||||||
|
if (bDrawSelectedRect && this.selectionRect != null)
|
||||||
|
this.RedrawSelectionRect(context);
|
||||||
|
}
|
@ -153,8 +153,8 @@ BaseEdge.prototype.GetEdgePositions = function()
|
|||||||
{
|
{
|
||||||
var position1 = this.vertex1.position;
|
var position1 = this.vertex1.position;
|
||||||
var position2 = this.vertex2.position;
|
var position2 = this.vertex2.position;
|
||||||
var diameter1 = this.vertex1.model.diameter;
|
var diameter1 = this.vertex1.model.diameter + parseInt(this.vertex1.currentStyle.lineWidth);
|
||||||
var diameter2 = this.vertex2.model.diameter;
|
var diameter2 = this.vertex2.model.diameter + parseInt(this.vertex2.currentStyle.lineWidth);
|
||||||
|
|
||||||
var direction = position1.subtract(position2);
|
var direction = position1.subtract(position2);
|
||||||
|
|
||||||
|
@ -191,7 +191,22 @@ BaseEdgeDrawer.prototype.Draw = function(baseEdge, arcStyle)
|
|||||||
var hasStartStyle = !position1.equals(position2) && baseEdge.GetStartEdgeStyle() != "";
|
var hasStartStyle = !position1.equals(position2) && baseEdge.GetStartEdgeStyle() != "";
|
||||||
var hasFinishStyle = !position1.equals(position2) && baseEdge.GetFinishEdgeStyle() != "";
|
var hasFinishStyle = !position1.equals(position2) && baseEdge.GetFinishEdgeStyle() != "";
|
||||||
|
|
||||||
this.DrawArc (positions[0], positions[1], arcStyle);
|
var arcPos1 = positions[0];
|
||||||
|
var arcPos2 = positions[1];
|
||||||
|
|
||||||
|
if (hasStartStyle)
|
||||||
|
{
|
||||||
|
var dirArrow = this.GetStartArrowDiretion(positions[0], positions[1], lengthArrow);
|
||||||
|
arcPos1 = arcPos1.add(dirArrow.multiply(lengthArrow / 2));
|
||||||
|
}
|
||||||
|
|
||||||
|
if (hasFinishStyle)
|
||||||
|
{
|
||||||
|
var dirArrow = this.GetFinishArrowDiretion(positions[0], positions[1], lengthArrow);
|
||||||
|
arcPos2 = arcPos2.add(dirArrow.multiply(-lengthArrow / 2));
|
||||||
|
}
|
||||||
|
|
||||||
|
this.DrawArc (arcPos1, arcPos2, arcStyle);
|
||||||
|
|
||||||
this.context.fillStyle = this.context.strokeStyle;
|
this.context.fillStyle = this.context.strokeStyle;
|
||||||
this.context.lineWidth = 0;
|
this.context.lineWidth = 0;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user