mirrors/graphonline
1
0
Fork 0
mirror of https://github.com/UnickSoft/graphonline.git synced 2026-04-03 06:16:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added up text for edges.

Browse Source
This commit is contained in:
Unick Soft
2020-05-03 15:04:01 +02:00
parent 72f94e5ddd
commit bbcdbb7294
9 changed files with 89 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
script/Appilcation.js
View File

@@ -502,9 +502,9 @@ Application.prototype.CreateNewGraphEx = function(x, y, vertexEnume)
return this.graph.AddNewVertex(new BaseVertex(x, y, vertexEnume));
}
Application.prototype.CreateNewArc = function(graph1, graph2, isDirect, weight, replaceIfExist)
Application.prototype.CreateNewArc = function(graph1, graph2, isDirect, weight, replaceIfExist, upText)
{
var edge = this.AddNewEdge(new BaseEdge(graph1, graph2, isDirect, weight), replaceIfExist);
var edge = this.AddNewEdge(new BaseEdge(graph1, graph2, isDirect, weight, upText), replaceIfExist);
var edgeObject = this.graph.edges[edge];
var hasPair = this.graph.hasPair(edgeObject);

19
script/BaseEdge.js
View File

@@ -4,7 +4,7 @@
*
*/
function BaseEdge(vertex1, vertex2, isDirect, weight)
function BaseEdge(vertex1, vertex2, isDirect, weight, upText)
{
this.vertex1 = vertex1;
this.vertex2 = vertex2;
@@ -17,6 +17,7 @@ function BaseEdge(vertex1, vertex2, isDirect, weight)
this.useWeight = false;
this.id = 0;
this.model = new EdgeModel();
this.upText = upText;
if (weight !== undefined)
this.SetWeight(weight);
@@ -32,6 +33,7 @@ BaseEdge.prototype.SaveToXML = function ()
"useWeight=\"" + this.useWeight + "\" " +
"id=\"" + this.id + "\" " +
"text=\"" + this.text + "\" " +
"upText=\"" + this.upText + "\" " +
"arrayStyleStart=\"" + this.arrayStyleStart + "\" " +
"arrayStyleFinish=\"" + this.arrayStyleFinish + "\" " +
this.model.SaveToXML() +
@@ -64,6 +66,11 @@ BaseEdge.prototype.LoadFromXML = function (xml, graph)
this.text = xml.attr("text") == null ? "" : xml.attr("text");
this.arrayStyleStart = xml.attr("arrayStyleStart") == null ? "" : xml.attr("arrayStyleStart");
this.arrayStyleFinish = xml.attr("arrayStyleFinish") == null ? "" : xml.attr("arrayStyleFinish");
this.upText = xml.attr('upText');
if (typeof this.upText === 'undefined')
{
this.upText = "";
}
this.model.LoadFromXML(xml);
}
@@ -90,6 +97,11 @@ BaseEdge.prototype.GetText = function ()
return this.text.length > 0 ? this.text : (this.useWeight ? this.weight.toString() : "");
}
BaseEdge.prototype.GetUpText = function ()
{
return this.upText;
}
BaseEdge.prototype.GetStartEdgeStyle = function ()
{
return this.arrayStyleStart;
@@ -159,4 +171,9 @@ BaseEdge.prototype.SetWeight = function(weight)
this.weight = Number(weight);
this.useWeight = useWeight;
}
BaseEdge.prototype.SetUpText = function(text)
{
this.upText = text;
}

42
script/BaseEdgeDrawer.js
View File

@@ -165,6 +165,11 @@ BaseEdgeDrawer.prototype.Draw = function(baseEdge, arcStyle)
{
this.DrawWeight(positions[0], positions[1], baseEdge.GetText(), arcStyle, false);
}
if (baseEdge.GetUpText().length > 0)
{
this.DrawUpText(positions[0], positions[1], baseEdge.GetUpText(), arcStyle, false);
}
}
@@ -216,13 +221,44 @@ BaseEdgeDrawer.prototype.DrawWeight = function(position1, position2, text, arcSt
this.context.beginPath();
this.context.rect(centerPoint.x - widthText / 2 - arcStyle.textPadding / 2,
centerPoint.y - 8 - arcStyle.textPadding / 2,
widthText + arcStyle.textPadding, 16 + arcStyle.textPadding);
widthText + arcStyle.textPadding, 16 + arcStyle.textPadding);
this.context.closePath();
this.context.fill();
this.context.stroke ();
this.context.fillStyle = arcStyle.weightText;
this.context.fillText(text, centerPoint.x - widthText / 2, centerPoint.y);
this.context.fillStyle = arcStyle.weightText;
this.context.fillText(text, centerPoint.x - widthText / 2, centerPoint.y);
}
BaseEdgeDrawer.prototype.DrawUpText = function(position1, position2, text, arcStyle, hasPair)
{
var centerPoint = this.GetTextCenterPoint(position1, position2, hasPair, arcStyle);
this.context.font = "bold 12px sans-serif";
this.context.textBaseline = "middle";
var widthText = this.context.measureText(text).width;
this.context.fillStyle = arcStyle.strokeStyle;
var vectorEdge = new Point(position2.x - position1.x, position2.y - position1.y);
var angleRadians = Math.atan2(vectorEdge.y, vectorEdge.x);
if (angleRadians > Math.PI / 2 || angleRadians < -Math.PI / 2)
{
vectorEdge = new Point(position1.x - position2.x, position1.y - position2.y);
angleRadians = Math.atan2(vectorEdge.y, vectorEdge.x);
}
var normalize = vectorEdge.normal().normalizeCopy(20);
this.context.save();
this.context.translate(centerPoint.x - normalize.x, centerPoint.y - normalize.y);
this.context.rotate(angleRadians);
this.context.textAlign = "center";
//context.textAlign = "center";
//context.fillText("Your Label Here", labelXposition, 0);
this.context.fillText(text, 0, 0);
this.context.restore();
}
BaseEdgeDrawer.prototype.DrawArrow = function(position, direction, length, width)

19
script/EventHandlers.js
View File

@@ -302,6 +302,7 @@ DefaultHandler.prototype.MouseUp = function(pos)
dialogButtons[g_save] = function() {
handler.selectedObject.SetWeight(document.getElementById('EdgeWeight').value);
handler.selectedObject.SetUpText(document.getElementById('EdgeLable').value);
handler.needRedraw = true;
handler.app.redrawGraph();
@@ -313,6 +314,17 @@ DefaultHandler.prototype.MouseUp = function(pos)
document.getElementById('EdgeWeight').value = handler.selectedObject.useWeight ? handler.selectedObject.weight : g_noWeight;
document.getElementById('EdgeWeightSlider').value = handler.selectedObject.useWeight ? handler.selectedObject.weight : 0;
var edgePresets = handler.app.GetEdgePresets();
var presetsStr = "<span onClick=\"document.getElementById('EdgeWeight').value='" + g_DefaultWeightPreset + "'; document.getElementById('EdgeWeightSlider').value='" + g_DefaultWeightPreset + "';\" style=\"cursor: pointer\" class=\"defaultWeigth\">" + g_DefaultWeightPreset + "</span>";
for(var i = 0; i < edgePresets.length; i ++)
{
var edgePreset = edgePresets[i];
presetsStr += "<span onClick=\"document.getElementById('EdgeWeight').value='" + edgePreset + "'; document.getElementById('EdgeWeightSlider').value=" + edgePreset + ";\" style=\"cursor: pointer\" class=\"defaultWeigth\">" + edgePreset + "</span>";
}
document.getElementById("EdgesPresets").innerHTML = presetsStr;
document.getElementById('EdgeLable').value = handler.selectedObject.upText;
$( "#addEdge" ).dialog({
resizable: false,
height: "auto",
@@ -421,7 +433,9 @@ ConnectionGraphHandler.prototype.firstObject = null;
ConnectionGraphHandler.prototype.AddNewEdge = function(selectedObject, isDirect)
{
this.app.CreateNewArc(this.firstObject, selectedObject, isDirect, document.getElementById('EdgeWeight').value, $("#RadiosReplaceEdge").prop("checked"));
this.app.CreateNewArc(this.firstObject, selectedObject, isDirect, document.getElementById('EdgeWeight').value, $("#RadiosReplaceEdge").prop("checked"), document.getElementById('EdgeLable').value);
EdgeLable
this.SelectFirst();
this.app.NeedRedraw();
}
@@ -471,6 +485,7 @@ ConnectionGraphHandler.prototype.SelectVertex = function(selectedObject)
presetsStr += "<span onClick=\"document.getElementById('EdgeWeight').value='" + edgePreset + "'; document.getElementById('EdgeWeightSlider').value=" + edgePreset + ";\" style=\"cursor: pointer\" class=\"defaultWeigth\">" + edgePreset + "</span>";
}
document.getElementById("EdgesPresets").innerHTML = presetsStr;
document.getElementById('EdgeLable').value = "";
$( "#addEdge" ).dialog({
resizable: false,
@@ -1280,7 +1295,7 @@ SetupEdgeStyle.prototype.show = function(index)
var graphDrawer = new BaseEdgeDrawer(context);
var baseVertex1 = new BaseVertex(0, canvas.height / 2, new BaseEnumVertices(this));
var baseVertex2 = new BaseVertex(canvas.width, canvas.height / 2, new BaseEnumVertices(this));
var baseEdge = new BaseEdge(baseVertex1, baseVertex2, true, 10);
var baseEdge = new BaseEdge(baseVertex1, baseVertex2, true, 10, "Text");
graphDrawer.Draw(baseEdge, style);