Added test size settings for vertices and edges.

This commit is contained in:
Oleg Sh
2024-07-15 22:11:38 +02:00
parent b7b14e16e8
commit dac4f9bcb8
31 changed files with 703 additions and 584 deletions

View File

@@ -1,187 +1,7 @@
/**
* Graph drawer.
*/
const lineDashTypes = [
[],
[4, 4],
[12, 12],
[16, 4, 4, 4],
];
// Common text position
const WeightTextCenter = 0,
WeightTextUp = 1;
function BaseEdgeStyle()
{
this.baseStyles = [];
}
BaseEdgeStyle.prototype.GetStyle = function (baseStyle, object)
{
this.baseStyles.forEach(function(element) {
var styleObject = globalApplication.GetStyle("edge", element, object);
baseStyle = styleObject.GetStyle(baseStyle, object);
});
if (this.hasOwnProperty('weightText'))
baseStyle.weightText = this.weightText;
if (this.hasOwnProperty('strokeStyle'))
baseStyle.strokeStyle = this.strokeStyle;
if (this.hasOwnProperty('fillStyle'))
baseStyle.fillStyle = this.fillStyle;
if (this.hasOwnProperty('textPadding'))
baseStyle.textPadding = this.textPadding;
if (this.hasOwnProperty('textStrokeWidth'))
baseStyle.textStrokeWidth = this.textStrokeWidth;
if (this.hasOwnProperty('lineDash'))
baseStyle.lineDash = this.lineDash;
if (this.hasOwnProperty('additionalTextColor'))
baseStyle.additionalTextColor = this.additionalTextColor;
if (this.hasOwnProperty('weightPosition'))
baseStyle.weightPosition = this.weightPosition;
return this.FixNewFields(baseStyle);
}
BaseEdgeStyle.prototype.FixNewFields = function (style)
{
if (!style.hasOwnProperty('lineDash'))
style.lineDash = 0;
if (!style.hasOwnProperty('weightPosition'))
style.weightPosition = WeightTextCenter;
return style;
}
BaseEdgeStyle.prototype.Clear = function ()
{
delete this.weightText;
delete this.strokeStyle;
delete this.fillStyle;
delete this.textPadding;
delete this.textStrokeWidth;
delete this.lineDash;
delete this.additionalTextColor;
delete this.weightPosition;
}
BaseEdgeStyle.prototype.ShouldLoad = function (field)
{
return field != "baseStyles";
}
function CommonEdgeStyle()
{
BaseEdgeStyle.apply(this, arguments);
this.strokeStyle = '#c7b7c7';
this.weightText = '#f0d543';
this.fillStyle = '#68aeba';
this.textPadding = 4;
this.textStrokeWidth = 2;
this.lineDash = 0;
this.additionalTextColor = '#c7b7c7';
this.weightPosition = WeightTextCenter;
}
CommonEdgeStyle.prototype = Object.create(BaseEdgeStyle.prototype);
function CommonPrintEdgeStyle()
{
BaseEdgeStyle.apply(this, arguments);
this.strokeStyle = '#000000';
this.weightText = '#000000';
this.fillStyle = '#FFFFFF';
this.textPadding = 4;
this.textStrokeWidth = 2;
this.baseStyles.push("common");
}
CommonPrintEdgeStyle.prototype = Object.create(BaseEdgeStyle.prototype);
function SelectedEdgeStyle0()
{
BaseEdgeStyle.apply(this, arguments);
this.strokeStyle = '#f0d543';
this.weightText = '#f0d543';
this.fillStyle = '#c7627a';
this.baseStyles.push("common");
}
SelectedEdgeStyle0.prototype = Object.create(BaseEdgeStyle.prototype);
function SelectedEdgeStyle1()
{
BaseEdgeStyle.apply(this, arguments);
this.strokeStyle = '#8FBF83';
this.weightText = '#8FBF83';
this.fillStyle = '#F9F9D5';
this.baseStyles.push("selected");
}
SelectedEdgeStyle1.prototype = Object.create(BaseEdgeStyle.prototype);
function SelectedEdgeStyle2()
{
BaseEdgeStyle.apply(this, arguments);
this.strokeStyle = '#8C4C86';
this.weightText = '#8C4C86';
this.fillStyle = '#253267';
this.baseStyles.push("selected");
}
SelectedEdgeStyle2.prototype = Object.create(BaseEdgeStyle.prototype);
function SelectedEdgeStyle3()
{
BaseEdgeStyle.apply(this, arguments);
this.strokeStyle = '#6188FF';
this.weightText = '#6188FF';
this.fillStyle = '#E97CF9';
this.baseStyles.push("selected");
}
SelectedEdgeStyle3.prototype = Object.create(BaseEdgeStyle.prototype);
function SelectedEdgeStyle4()
{
BaseEdgeStyle.apply(this, arguments);
this.strokeStyle = '#C6B484';
this.weightText = '#C6B484';
this.fillStyle = '#E0DEE1';
this.baseStyles.push("selected");
}
SelectedEdgeStyle4.prototype = Object.create(BaseEdgeStyle.prototype);
function SelectedEdgePrintStyle()
{
BaseEdgeStyle.apply(this, arguments);
this.strokeStyle = '#AAAAAA';
this.weightText = '#000000';
this.fillStyle = '#AAAAAA';
this.baseStyles.push("printed");
}
SelectedEdgePrintStyle.prototype = Object.create(BaseEdgeStyle.prototype);
var DefaultSelectedEdgeStyles = [new SelectedEdgeStyle0(), new SelectedEdgeStyle1(),
new SelectedEdgeStyle2(), new SelectedEdgeStyle3(), new SelectedEdgeStyle4()];
var DefaultPrintSelectedEdgeStyles = [new SelectedEdgePrintStyle()];
// Test graph: http://localhost:8080/?graph=IEktYqMyJaYYyLufZZcst_test
function BaseEdgeDrawer(context, drawObjects)
{
@@ -277,19 +97,22 @@ BaseEdgeDrawer.prototype.Draw = function(baseEdge, arcStyle)
if (baseEdge.GetUpText().length > 0)
{
this.DrawUpText(positions[0], positions[1], baseEdge.GetUpText(), arcStyle, false, arcStyle.additionalTextColor, baseEdge.model.width / 2 + 20, null);
this.DrawUpText(positions[0], positions[1], baseEdge.GetUpText(), arcStyle, false, arcStyle.additionalTextColor,
baseEdge.model.width / 2 + arcStyle.mainTextFontSize + 4, arcStyle.mainTextFontSize);
}
}
else if (arcStyle.weightPosition == WeightTextUp)
{
if (baseEdge.GetText().length > 0)
{
this.DrawUpText(positions[0], positions[1], baseEdge.GetText(), arcStyle, false, arcStyle.weightText, baseEdge.model.width / 2 + 10, "16px");
this.DrawUpText(positions[0], positions[1], baseEdge.GetText(), arcStyle, false, arcStyle.weightText,
baseEdge.model.width / 2 + arcStyle.mainTextFontSize / 2, arcStyle.mainTextFontSize);
}
if (baseEdge.GetUpText().length > 0)
{
this.DrawUpText(positions[0], positions[1], baseEdge.GetUpText(), arcStyle, false, arcStyle.additionalTextColor, - baseEdge.model.width / 2 - 15, null);
this.DrawUpText(positions[0], positions[1], baseEdge.GetUpText(), arcStyle, false, arcStyle.additionalTextColor,
- baseEdge.model.width / 2 - (arcStyle.mainTextFontSize / 2 + 4), arcStyle.mainTextFontSize);
}
}
}
@@ -334,7 +157,7 @@ BaseEdgeDrawer.prototype.DrawWeight = function(position1, position2, text, arcSt
{
var centerPoint = this.GetTextCenterPoint(position1, position2, hasPair, arcStyle);
this.context.font = "bold 16px sans-serif";
this.context.font = "bold " + arcStyle.mainTextFontSize + "px sans-serif";
this.context.textBaseline = "middle";
this.context.lineWidth = arcStyle.textStrokeWidth;
this.context.fillStyle = arcStyle.fillStyle;
@@ -343,8 +166,8 @@ 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);
centerPoint.y - arcStyle.mainTextFontSize / 1.7 - arcStyle.textPadding / 2,
widthText + arcStyle.textPadding, arcStyle.mainTextFontSize + arcStyle.textPadding);
this.context.closePath();
this.context.fill();
this.context.stroke ();
@@ -357,7 +180,9 @@ BaseEdgeDrawer.prototype.DrawUpText = function(position1, position2, text, arcSt
{
var centerPoint = this.GetTextCenterPoint(position1, position2, hasPair, arcStyle);
this.context.font = fontSize == null ? "bold 12px sans-serif" : "bold " + fontSize + " sans-serif";
this.context.font = fontSize == null ? "bold " + (DefaultMainTextFontSizeEdge + TopTextFontSizeDeltaEdge) +
"px sans-serif" : "bold " + (fontSize + TopTextFontSizeDeltaEdge) +
"px sans-serif";
this.context.textBaseline = "middle";
var widthText = this.context.measureText(text).width;