Enhance matrix display functionality and formatting.

core/config/main.php

@@ -94,5 +94,5 @@
     $g_config['vote']                   = "./tmp/vote/vote.txt";
     $g_config['voteTopics']             = "./tmp/vote/voteTopics.txt_";
     $g_config['use_js_cache']           = true;
-    $g_config['engine_version']         = 103;
+    $g_config['engine_version']         = 104;
 ?>

i/css/home.css

@@ -60,6 +60,7 @@
 		overflow: scroll;
 		width : 100%;
         height: 300px;
+        min-width: 400px;
 		overflow-wrap: normal;
 	}
 
@@ -68,6 +69,7 @@
 		overflow: scroll;
 		width : 100%;
 		height: 300px;
+        min-width: 400px;
 		overflow-wrap: normal;
 	}
 
@@ -76,6 +78,7 @@
 		overflow: scroll;
 		width : 100%;
 		height: 300px;
+        min-width: 400px;
 		overflow-wrap: normal;
     }
 
@@ -372,14 +375,17 @@
 	#AdjacencyMatrixField
 	{
         height: 200px;
+        min-width: 200px;
 	}
     #IncidenceMatrixField
     {
         height: 200px;
+        min-width: 200px;
     }
     #IncidenceMatrixField
     {
         height: 200px;
+        min-width: 200px;
     }
     
     #addVertex
@@ -496,3 +502,66 @@ label.switcherText {
 #autoSaveOrOriginalGraph .btn-xs{
     font-size: 12px;
 }
+
+/* Common matrix parameters */
+.ui-widget textarea.matrix,
+.top-text,
+.side-text {
+  font-family: ui-monospace, Consolas, monospace;
+  font-size: 14px;
+  line-height: 1.4;
+  white-space: pre;
+  box-sizing: border-box;
+}
+
+/* GRID 2×2 */
+.matrix-wrapper {
+  display: grid;
+  grid-template-columns: max-content auto;
+  grid-template-rows: auto auto;
+  width: 100%;
+}
+
+/* Empty corner */
+.corner {
+  width: 40px;
+  height: 40px;
+  display: grid;
+  place-items: center;
+}
+
+/* Top text */
+.top-text-wrap {
+  /* width: 120px; */  /* ← Set in JS */
+  width: 10px;
+  height: 40px;
+  overflow: hidden;
+}
+
+.top-text {
+  padding: 6px;
+}
+
+/* Left text */
+.side-text-wrap {
+  width: 40px;
+  height: 300px; /* ← Same as textarea */
+  overflow: hidden;
+}
+
+@media only screen and (max-width: 650px) {
+    .side-text-wrap {
+        height: 200px; /* ← Same as textarea */
+    }
+}
+
+.side-text {
+  padding: 6px;
+}
+
+/* TEXTAREA */
+.ui-widget textarea.matrix {
+  padding: 6px;
+  overflow: auto;
+  resize: both;
+}

lang/ru/home.php

@@ -345,7 +345,7 @@
 
     $g_lang['salesman_problem'] = "Задача коммивояжёра";
     $g_lang['no_solution'] = "Решения не существует";
-    $g_lang['shortest_loop_is'] = "Кратчайшие цикл имеет длинну ";
+    $g_lang['shortest_loop_is'] = "Кратчайший цикл имеет длинну ";
     $g_lang['salesman_path_problem'] = "Задача коммивояжёра для пути";
-    $g_lang['shortest_path_is'] = "Кратчайшие путь имеет длинну ";
+    $g_lang['shortest_path_is'] = "Кратчайший путь имеет длинну ";
 ?>

script/entities/graph/model/Graph.js

@@ -289,32 +289,71 @@ Graph.prototype.FindAllEdges = function(id1, id2)
 	return res;
 }
 
-Graph.prototype.GetAdjacencyMatrixStr = function ()
+Graph.prototype.GetAdjacencyMatrixStr = function (res_columns_width)
 {
 	var matrix = "";
+	let cols_width = [];
+
+	let get_edge_weight_str = (vertex_1, vertex_2) => {
+		var res = "";
+
+		var edge = this.FindEdgeMin (vertex_1.id, vertex_2.id);
+		if (edge != null)
+		{
+			res += edge.weight;
+		}
+		else
+		{
+			res += "0";
+		}
+		
+		return res;
+	}
+
+	// Calculate max width for each column
+	for (var j = 0; j < this.vertices.length; j++)
+	{
+		cols_width.push(0);
+		for (var i = 0; i < this.vertices.length; i++)
+		{	
+			let weight_str = get_edge_weight_str(this.vertices[i], this.vertices[j]);
+			let weight_len = weight_str.length;
+			// Make the length at least 2 if vertex name length > 1
+			if (this.vertices[j].mainText.toString().length > weight_len && weight_len == 1)
+			{
+				weight_len = 2;
+			}
+			if (weight_len > cols_width[j]) 
+			{
+				cols_width[j] = weight_len;
+			}
+		}
+	}
+
 	for (var i = 0; i < this.vertices.length; i++)
 	{
 		for (var j = 0; j < this.vertices.length; j++)
 		{	
-			var edge = this.FindEdgeMin (this.vertices[i].id, this.vertices[j].id);
+			let weight_str = get_edge_weight_str(this.vertices[i], this.vertices[j]);
-			if (edge != null)
+			if (weight_str.length < cols_width[j])
 			{
-				matrix += edge.weight;
+				weight_str = " ".repeat(cols_width[j] - weight_str.length) + weight_str;
-			}
-			else
-			{
-				matrix += "0";
 			}
+			matrix += weight_str;
 			
 			if (j != this.vertices.length)
 			{
 				matrix += ", ";
 			}
-			
 		}
 		matrix = matrix + "\n";
 	}
 
+	if (res_columns_width !== undefined) {
+		res_columns_width.length = 0;
+		res_columns_width.push(...cols_width);
+	}
+	
 	return matrix;
 }
 
@@ -939,32 +978,50 @@ Graph.prototype.SetIncidenceMatrix = function (matrix, viewportSize, currentEnum
 Graph.prototype.GetIncidenceMatrix = function ()
 {
 	var matrix = "";
+	let cols_width = [];
+
+	let get_edge_weight_str = (vertex_index, edge_index) => {
+		if (this.edges[edge_index].vertex1 == this.vertices[vertex_index])
+		{
+			return this.edges[edge_index].weight.toString();
+		}
+		else if (this.edges[edge_index].vertex2 == this.vertices[vertex_index] && !this.edges[edge_index].isDirect)
+		{
+			return this.edges[edge_index].weight.toString();
+		}
+		else if (this.edges[edge_index].vertex2 == this.vertices[vertex_index] && this.edges[edge_index].isDirect)
+		{
+			return -this.edges[edge_index].weight.toString();
+		}
+		else
+		{
+			return "0";
+		}
+	};
+
+	for (var j = 0; j < this.edges.length; j++)
+	{
+		let max_width = 0;
+		for (var i = 0; i < this.vertices.length; i++)
+		{	
+			let str = "" + get_edge_weight_str(i, j);
+			max_width = Math.max(max_width, str.length);
+		}
+		cols_width.push(max_width);
+	}
+
 	for (var i = 0; i < this.vertices.length; i++)
 	{
 		for (var j = 0; j < this.edges.length; j++)
 		{	
-			if (this.edges[j].vertex1 == this.vertices[i])
+			let weight_str = get_edge_weight_str(i, j);
-			{
+			weight_str = " ".repeat(cols_width[j] - weight_str.length) + weight_str;
-				matrix += this.edges[j].weight;
-			}
-			else if (this.edges[j].vertex2 == this.vertices[i] && !this.edges[j].isDirect)
-			{
-				matrix += this.edges[j].weight;
-			}
-			else if (this.edges[j].vertex2 == this.vertices[i] && this.edges[j].isDirect)
-			{
-				matrix += -this.edges[j].weight;
-			}
-			else
-			{
-				matrix += "0";
-			}
 
+			matrix += "" + weight_str;
 			if (j != this.edges.length - 1)
 			{
 				matrix += ", ";
 			}			
-			
 		}
 		matrix = matrix + "\n";
 	}

script/features/algorithms/model/plugins/Floid.js

@@ -139,7 +139,37 @@ FloidAlgorithm.prototype.messageWasChanged = function()
             dialogButtons[g_close] = function() {
 				$( this ).dialog( "close" );						
 			};
-            $( "#FloidMatrixField" ).val(self.GetFloidMatrix());	
+            let ta = $("#FloidMatrixField");
+            let topWrap = $("#floidMatrix_top_text");
+            let sideWrap = $("#floidMatrix_side_text");
+            ta.on("scroll", function() {
+                topWrap.scrollLeft(ta.scrollLeft());
+                sideWrap.scrollTop(ta.scrollTop());
+            });
+
+            let columns_width = [];
+            $( "#FloidMatrixField" ).val(self.GetFloidMatrix(columns_width).trimEnd());
+            ta.focus()[0].setSelectionRange(0, 0);
+            /* Make side and top text */
+            let sideText = "";
+            let topText = "";
+            for (let i = 0; i < self.graph.vertices.length; i++)
+            {
+                /* Each vertex name max 3 symbols */
+                sideText += self.graph.vertices[i].mainText.toString().slice(0, 3) + "\n";
+                
+                let col_width = columns_width[i];
+                let col_text = self.graph.vertices[i].mainText.toString();
+                if (col_width < col_text.length)
+                {
+                    col_text = col_text.slice(0, col_width);
+                }
+                col_text = col_text.padStart(col_width, " ");
+                topText += col_text + "  ";
+            }
+            $("#floidMatrix_top_text_text").html(topText);
+            $("#floidMatrix_side_text_text").html(sideText + "\n");
+            
             $( "#floidMatrix" ).dialog({
 		        resizable: false,
                 height: "auto",
@@ -147,7 +177,11 @@ FloidAlgorithm.prototype.messageWasChanged = function()
 		        modal: true,
 		        title: g_minDistMatrixText,
                 buttons: dialogButtons,
-                dialogClass: 'EdgeDialog'
+                dialogClass: 'EdgeDialog',
+                open: function(event, ui) {
+                    /* Set width for side text */
+                    $("#floidMatrix_top_text").width(ta.width());
+                }
 	       });
         };
     }
@@ -157,9 +191,9 @@ FloidAlgorithm.prototype.messageWasChanged = function()
     });
 }
 
-FloidAlgorithm.prototype.GetFloidMatrix = function()
+FloidAlgorithm.prototype.GetFloidMatrix = function(res_columns_width)
 {
-    return this.graph.GetAdjacencyMatrixStr();
+    return this.graph.GetAdjacencyMatrixStr(res_columns_width);
 }
 
 

script/features/show_adjacency_matrix/index.js

@@ -46,9 +46,41 @@ ShowAdjacencyMatrix.prototype.show = function()
 				$( this ).dialog( "close" );						
 			};
 
-	$( "#AdjacencyMatrixField" ).val(this.app.GetAdjacencyMatrix());	
+	let ta = $("#AdjacencyMatrixField");
+	let topWrap = $("#adjacencyMatrix_top_text");
+	let sideWrap = $("#adjacencyMatrix_side_text");
+
+	ta.on("scroll", function() {
+		topWrap.scrollLeft(ta.scrollLeft());
+		sideWrap.scrollTop(ta.scrollTop());
+	});
+
+	let res_columns_width = [];
+	ta.val(this.app.GetAdjacencyMatrix(res_columns_width).trimEnd());	
+	ta.focus()[0].setSelectionRange(0, 0);
+
 	$( "#BadMatrixFormatMessage" ).hide();
 
+	/* Make side and top text */
+	let sideText = "";
+	let topText = "";
+	for (let i = 0; i < this.app.graph.vertices.length; i++)
+	{
+		/* Each vertex name max 3 symbols */
+		sideText += this.app.graph.vertices[i].mainText.toString().slice(0, 3) + "\n";
+		
+		let col_width = res_columns_width[i];
+		let col_text = this.app.graph.vertices[i].mainText.toString();
+		if (col_width < col_text.length)
+		{
+			col_text = col_text.slice(0, col_width);
+		}
+		col_text = col_text.padStart(col_width, " ");
+		topText += col_text + "  ";
+	}
+	$("#adjacencyMatrix_top_text_text").html(topText);
+	$("#adjacencyMatrix_side_text_text").html(sideText + "\n");
+	
     if (this.app.graph.isMulti())
         $( "#AdjacencyMatrixMultiGraphDesc").show();
     else
@@ -61,6 +93,11 @@ ShowAdjacencyMatrix.prototype.show = function()
 		modal: true,
 		title: g_adjacencyMatrixText,
 		buttons: dialogButtons,
-		dialogClass: 'EdgeDialog'
+		dialogClass: 'EdgeDialog',
+		open: function(event, ui) {
+			/* Set width for side text */
+			$("#adjacencyMatrix_top_text").width(ta.width());
+			$("#BadMatrixFormatMessage").width(ta.width());
+		}
 	});
 }

script/features/show_distance_matrix/index.js

@@ -20,26 +20,56 @@ ShowDistanceMatrix.prototype.firstObject = null;
 // Path
 ShowDistanceMatrix.prototype.pathObjects = null;
 
-ShowDistanceMatrix.prototype.GetIncidenceMatrix = function (rawMatrix)
+ShowDistanceMatrix.prototype.GetIncidenceMatrix = function (rawMatrix, res_columns_width)
 {
+	let get_weight_str = function (i, j)
+	{
+		let str = "";
+		if (i == j)
+		{
+			str += "0";
+		}
+		else if ((new Graph()).infinity == rawMatrix[i][j])
+		{
+			str += '\u221E';
+		}
+		else
+		{
+			str += rawMatrix[i][j];   
+		}
+        return str;
+	};
+	
+	for (var j = 0; j < rawMatrix.length; j++)
+	{
+		let max_length = 0;
+		for (var i = 0; i < rawMatrix.length; i++)
+		{	
+			let str = get_weight_str(i, j);
+			let weight_len = str.length;
+			// Make the length at least 2 if vertex name length > 1
+			if (this.app.graph.vertices[j].mainText.toString().length > weight_len && weight_len == 1)
+			{
+				weight_len = 2;
+			}
+			max_length = Math.max(max_length, weight_len);
+		}
+		res_columns_width.push(max_length);
+	}
+
 	var matrix = "";
 	for (var i = 0; i < rawMatrix.length; i++)
 	{
 		for (var j = 0; j < rawMatrix[i].length; j++)
 		{	
-            if (i == j)
+			let weight_str = get_weight_str(i, j);
+			if (weight_str.length < res_columns_width[j])
 			{
-                matrix += "0";
+				weight_str = " ".repeat(res_columns_width[j] - weight_str.length) + weight_str;
-            }
-            else if ((new Graph()).infinity == rawMatrix[i][j])
-            {
-                matrix += '\u221E';
-            }
-            else
-            {
-                matrix += rawMatrix[i][j];   
 			}
 
+            matrix += weight_str;
+            
 			if (j != rawMatrix[i].length - 1)
 			{
 				matrix += ", ";
@@ -63,7 +93,39 @@ ShowDistanceMatrix.prototype.show = function()
 
     var handler = g_Algorithms[g_AlgorithmIds.indexOf("OlegSh.FloidAlgorithm")](this.app.graph, this.app);
         
-	$( "#FloidMatrixField" ).val(this.GetIncidenceMatrix(handler.resultMatrix()));	
+	let ta = $("#FloidMatrixField");
+	let topWrap = $("#floidMatrix_top_text");
+	let sideWrap = $("#floidMatrix_side_text");
+
+	ta.on("scroll", function() {
+		topWrap.scrollLeft(ta.scrollLeft());
+		sideWrap.scrollTop(ta.scrollTop());
+	});
+
+	let res_columns_width = [];
+
+	ta.val(this.GetIncidenceMatrix(handler.resultMatrix(), res_columns_width).trimEnd());
+	ta.focus()[0].setSelectionRange(0, 0);	
+
+	/* Make side and top text */
+	let sideText = "";
+	let topText = "";
+	for (let i = 0; i < this.app.graph.vertices.length; i++)
+	{
+		/* Each vertex name max 3 symbols */
+		sideText += this.app.graph.vertices[i].mainText.toString().slice(0, 3) + "\n";
+		
+		let col_width = res_columns_width[i];
+		let col_text = this.app.graph.vertices[i].mainText.toString();
+		if (col_width < col_text.length)
+		{
+			col_text = col_text.slice(0, col_width);
+		}
+		col_text = col_text.padStart(col_width, " ");
+		topText += col_text + "  ";
+	}
+	$("#floidMatrix_top_text_text").html(topText);
+	$("#floidMatrix_side_text_text").html(sideText + "\n");
 				
 	$( "#floidMatrix" ).dialog({
 		resizable: false,
@@ -72,6 +134,11 @@ ShowDistanceMatrix.prototype.show = function()
 		modal: true,
 		title: g_minDistMatrixText,
 		buttons: dialogButtons,
-		dialogClass: 'EdgeDialog'
+		dialogClass: 'EdgeDialog',
+		open: function(event, ui) {
+			/* Set width for side text */
+			$("#floidMatrix_top_text").width(ta.width());
+		}
 	});
+
 }

script/features/show_incidence_matrix/index.js

@@ -46,9 +46,27 @@ ShowIncidenceMatrix.prototype.show = function()
 				$( this ).dialog( "close" );						
 			};
 
-	$( "#IncidenceMatrixField" ).val(this.app.GetIncidenceMatrix());	
+	let ta = $("#IncidenceMatrixField");
+	let sideWrap = $("#incidenceMatrix_side_text");
+
+	ta.on("scroll", function() {
+		sideWrap.scrollTop(ta.scrollTop());
+	});
+
+	$( "#IncidenceMatrixField" ).val(this.app.GetIncidenceMatrix().trimEnd());	
+	ta.focus()[0].setSelectionRange(0, 0);
+
 	$( "#BadIncidenceMatrixFormatMessage" ).hide();
 				
+	/* Make side and top text */
+	let sideText = "";
+	for (let i = 0; i < this.app.graph.vertices.length; i++)
+	{
+		/* Each vertex name max 3 symbols */
+		sideText += this.app.graph.vertices[i].mainText.toString().slice(0, 3) + "\n";		
+	}
+	$("#incidenceMatrix_side_text_text").html(sideText + "\n");
+
 	$( "#incidenceMatrix" ).dialog({
 		resizable: false,
         height: "auto",
@@ -56,6 +74,11 @@ ShowIncidenceMatrix.prototype.show = function()
 		modal: true,
 		title: g_incidenceMatrixText,
 		buttons: dialogButtons,
-		dialogClass: 'EdgeDialog'
+		dialogClass: 'EdgeDialog',
+		open: function(event, ui) {
+			/* Set width for side text */
+			$("#incidenceMatrix_top_text").width(ta.width());
+			$("#BadIncidenceMatrixFormatMessage").width(ta.width());
+		}
 	});
 }

script/pages/create_graph_by_edge_list/api/index.js.cache

@@ -1,4 +1,4 @@
-moduleLoader.beginCacheLoading(["/script/entities/graph/api/index.js?v=103","/script/shared/point.js?v=103","/script/entities/edge/api/index.js?v=103","/script/entities/edge/model/BaseEdge.js?v=103","/script/entities/edge/model/EdgeModel.js?v=103","/script/entities/vertex/api/index.js?v=103","/script/entities/vertex/model/BaseVertex.js?v=103","/script/entities/vertex/model/VertexModel.js?v=103","/script/entities/graph/model/Graph.js?v=103",]);{let modulDir="pages/create_graph_by_edge_list/";doInclude([include("entities/graph/api/index.js")]);}
+moduleLoader.beginCacheLoading(["/script/entities/graph/api/index.js?v=104","/script/shared/point.js?v=104","/script/entities/edge/api/index.js?v=104","/script/entities/edge/model/BaseEdge.js?v=104","/script/entities/edge/model/EdgeModel.js?v=104","/script/entities/vertex/api/index.js?v=104","/script/entities/vertex/model/BaseVertex.js?v=104","/script/entities/vertex/model/VertexModel.js?v=104","/script/entities/graph/model/Graph.js?v=104",]);{let modulDir="pages/create_graph_by_edge_list/";doInclude([include("entities/graph/api/index.js")]);}
 {let modulDir="entities/graph/";doInclude([include("shared/point.js"),include("entities/edge/api/index.js"),include("entities/vertex/api/index.js"),include("model/Graph.js",modulDir)])}function Point(x,y){this.x=x||0;this.y=y||0;};Point.prototype.x=null;Point.prototype.y=null;Point.prototype.add=function(v){return new Point(this.x+v.x,this.y+v.y);};Point.prototype.addValue=function(v){return new Point(this.x+v,this.y+v);};Point.prototype.clone=function(){return new Point(this.x,this.y);};Point.prototype.degreesTo=function(v){var dx=this.x-v.x;var dy=this.y-v.y;var angle=Math.atan2(dy,dx);return angle*(180/Math.PI);};Point.prototype.distance=function(v){return Math.sqrt(this.distanceSqr(v));};Point.prototype.distanceSqr=function(v){var x=this.x-v.x;var y=this.y-v.y;return x*x+y*y;};Point.prototype.equals=function(toCompare){return this.x==toCompare.x&&this.y==toCompare.y;};Point.prototype.interpolate=function(v,f){return new Point((this.x+v.x)*f,(this.y+v.y)*f);};Point.prototype.length=function(){return Math.sqrt(this.x*this.x+this.y*this.y);};Point.prototype.normalize=function(thickness){var l=this.length();this.x=this.x/l*thickness;this.y=this.y/l*thickness;return new Point(this.x,this.y);};Point.prototype.normalizeCopy=function(thickness){var l=this.length();return new Point(this.x/l*thickness,this.y/l*thickness);};Point.prototype.orbit=function(origin,arcWidth,arcHeight,degrees){var radians=degrees*(Math.PI/180);this.x=origin.x+arcWidth*Math.cos(radians);this.y=origin.y+arcHeight*Math.sin(radians);};Point.prototype.rotate=function(center,degrees){var radians=degrees*(Math.PI/180);offset=this.subtract(center);this.x=offset.x*Math.cos(radians)-offset.y*Math.sin(radians);this.y=offset.x*Math.sin(radians)+offset.y*Math.cos(radians);this.x=this.x+center.x;this.y=this.y+center.y;return this;};Point.prototype.offset=function(dx,dy){this.x+=dx;this.y+=dy;};Point.prototype.subtract=function(v){return new Point(this.x-v.x,this.y-v.y);};Point.prototype.subtractValue=function(value){return new Point(this.x-value,this.y-value);};Point.prototype.multiply=function(value){return new Point(this.x*value,this.y*value);};Point.prototype.toString=function(){return"(x="+this.x+", y="+this.y+")";};Point.prototype.normal=function(){return new Point(-this.y,this.x);};Point.prototype.min=function(point)
 {return new Point(Math.min(this.x,point.x),Math.min(this.y,point.y));};Point.prototype.max=function(point)
 {return new Point(Math.max(this.x,point.x),Math.max(this.y,point.y));};Point.prototype.inverse=function()
@@ -309,16 +309,26 @@ Graph.prototype.FindAllEdges=function(id1,id2)
 {var edge=this.edges[i];if((edge.vertex1.id==id1&&edge.vertex2.id==id2)||(!edge.isDirect&&edge.vertex1.id==id2&&edge.vertex2.id==id1))
 {res.push(edge);}}
 return res;}
-Graph.prototype.GetAdjacencyMatrixStr=function()
+Graph.prototype.GetAdjacencyMatrixStr=function(res_columns_width)
-{var matrix="";for(var i=0;i<this.vertices.length;i++)
+{var matrix="";let cols_width=[];let get_edge_weight_str=(vertex_1,vertex_2)=>{var res="";var edge=this.FindEdgeMin(vertex_1.id,vertex_2.id);if(edge!=null)
-{for(var j=0;j<this.vertices.length;j++)
+{res+=edge.weight;}
-{var edge=this.FindEdgeMin(this.vertices[i].id,this.vertices[j].id);if(edge!=null)
-{matrix+=edge.weight;}
 else
-{matrix+="0";}
+{res+="0";}
-if(j!=this.vertices.length)
+return res;}
+for(var j=0;j<this.vertices.length;j++)
+{cols_width.push(0);for(var i=0;i<this.vertices.length;i++)
+{let weight_str=get_edge_weight_str(this.vertices[i],this.vertices[j]);let weight_len=weight_str.length;if(this.vertices[j].mainText.toString().length>weight_len&&weight_len==1)
+{weight_len=2;}
+if(weight_len>cols_width[j])
+{cols_width[j]=weight_len;}}}
+for(var i=0;i<this.vertices.length;i++)
+{for(var j=0;j<this.vertices.length;j++)
+{let weight_str=get_edge_weight_str(this.vertices[i],this.vertices[j]);if(weight_str.length<cols_width[j])
+{weight_str=" ".repeat(cols_width[j]-weight_str.length)+weight_str;}
+matrix+=weight_str;if(j!=this.vertices.length)
 {matrix+=", ";}}
 matrix=matrix+"\n";}
+if(res_columns_width!==undefined){res_columns_width.length=0;res_columns_width.push(...cols_width);}
 return matrix;}
 Graph.prototype.GetAdjacencyMatrix=function()
 {var matrix=[];for(var i=0;i<this.vertices.length;i++)
@@ -473,17 +483,20 @@ for(var i=cols.length;i<Math.max(this.vertices.length,cols.length);i++)
 {this.DeleteVertex(this.vertices[i]);i--;}
 this.VerticesReposition(viewportSize,newVertices);}}
 Graph.prototype.GetIncidenceMatrix=function()
-{var matrix="";for(var i=0;i<this.vertices.length;i++)
+{var matrix="";let cols_width=[];let get_edge_weight_str=(vertex_index,edge_index)=>{if(this.edges[edge_index].vertex1==this.vertices[vertex_index])
-{for(var j=0;j<this.edges.length;j++)
+{return this.edges[edge_index].weight.toString();}
-{if(this.edges[j].vertex1==this.vertices[i])
+else if(this.edges[edge_index].vertex2==this.vertices[vertex_index]&&!this.edges[edge_index].isDirect)
-{matrix+=this.edges[j].weight;}
+{return this.edges[edge_index].weight.toString();}
-else if(this.edges[j].vertex2==this.vertices[i]&&!this.edges[j].isDirect)
+else if(this.edges[edge_index].vertex2==this.vertices[vertex_index]&&this.edges[edge_index].isDirect)
-{matrix+=this.edges[j].weight;}
+{return-this.edges[edge_index].weight.toString();}
-else if(this.edges[j].vertex2==this.vertices[i]&&this.edges[j].isDirect)
-{matrix+=-this.edges[j].weight;}
 else
-{matrix+="0";}
+{return"0";}};for(var j=0;j<this.edges.length;j++)
-if(j!=this.edges.length-1)
+{let max_width=0;for(var i=0;i<this.vertices.length;i++)
+{let str=""+get_edge_weight_str(i,j);max_width=Math.max(max_width,str.length);}
+cols_width.push(max_width);}
+for(var i=0;i<this.vertices.length;i++)
+{for(var j=0;j<this.edges.length;j++)
+{let weight_str=get_edge_weight_str(i,j);weight_str=" ".repeat(cols_width[j]-weight_str.length)+weight_str;matrix+=""+weight_str;if(j!=this.edges.length-1)
 {matrix+=", ";}}
 matrix=matrix+"\n";}
 return matrix;}

script/pages/create_graph_by_incidence_matrix/api/index.js.cache

@@ -1,4 +1,4 @@
-moduleLoader.beginCacheLoading(["/script/entities/graph/api/index.js?v=103","/script/shared/point.js?v=103","/script/entities/edge/api/index.js?v=103","/script/entities/edge/model/BaseEdge.js?v=103","/script/entities/edge/model/EdgeModel.js?v=103","/script/entities/vertex/api/index.js?v=103","/script/entities/vertex/model/BaseVertex.js?v=103","/script/entities/vertex/model/VertexModel.js?v=103","/script/entities/graph/model/Graph.js?v=103",]);{let modulDir="pages/create_graph_by_matrix/";doInclude([include("entities/graph/api/index.js")]);}
+moduleLoader.beginCacheLoading(["/script/entities/graph/api/index.js?v=104","/script/shared/point.js?v=104","/script/entities/edge/api/index.js?v=104","/script/entities/edge/model/BaseEdge.js?v=104","/script/entities/edge/model/EdgeModel.js?v=104","/script/entities/vertex/api/index.js?v=104","/script/entities/vertex/model/BaseVertex.js?v=104","/script/entities/vertex/model/VertexModel.js?v=104","/script/entities/graph/model/Graph.js?v=104",]);{let modulDir="pages/create_graph_by_matrix/";doInclude([include("entities/graph/api/index.js")]);}
 {let modulDir="entities/graph/";doInclude([include("shared/point.js"),include("entities/edge/api/index.js"),include("entities/vertex/api/index.js"),include("model/Graph.js",modulDir)])}function Point(x,y){this.x=x||0;this.y=y||0;};Point.prototype.x=null;Point.prototype.y=null;Point.prototype.add=function(v){return new Point(this.x+v.x,this.y+v.y);};Point.prototype.addValue=function(v){return new Point(this.x+v,this.y+v);};Point.prototype.clone=function(){return new Point(this.x,this.y);};Point.prototype.degreesTo=function(v){var dx=this.x-v.x;var dy=this.y-v.y;var angle=Math.atan2(dy,dx);return angle*(180/Math.PI);};Point.prototype.distance=function(v){return Math.sqrt(this.distanceSqr(v));};Point.prototype.distanceSqr=function(v){var x=this.x-v.x;var y=this.y-v.y;return x*x+y*y;};Point.prototype.equals=function(toCompare){return this.x==toCompare.x&&this.y==toCompare.y;};Point.prototype.interpolate=function(v,f){return new Point((this.x+v.x)*f,(this.y+v.y)*f);};Point.prototype.length=function(){return Math.sqrt(this.x*this.x+this.y*this.y);};Point.prototype.normalize=function(thickness){var l=this.length();this.x=this.x/l*thickness;this.y=this.y/l*thickness;return new Point(this.x,this.y);};Point.prototype.normalizeCopy=function(thickness){var l=this.length();return new Point(this.x/l*thickness,this.y/l*thickness);};Point.prototype.orbit=function(origin,arcWidth,arcHeight,degrees){var radians=degrees*(Math.PI/180);this.x=origin.x+arcWidth*Math.cos(radians);this.y=origin.y+arcHeight*Math.sin(radians);};Point.prototype.rotate=function(center,degrees){var radians=degrees*(Math.PI/180);offset=this.subtract(center);this.x=offset.x*Math.cos(radians)-offset.y*Math.sin(radians);this.y=offset.x*Math.sin(radians)+offset.y*Math.cos(radians);this.x=this.x+center.x;this.y=this.y+center.y;return this;};Point.prototype.offset=function(dx,dy){this.x+=dx;this.y+=dy;};Point.prototype.subtract=function(v){return new Point(this.x-v.x,this.y-v.y);};Point.prototype.subtractValue=function(value){return new Point(this.x-value,this.y-value);};Point.prototype.multiply=function(value){return new Point(this.x*value,this.y*value);};Point.prototype.toString=function(){return"(x="+this.x+", y="+this.y+")";};Point.prototype.normal=function(){return new Point(-this.y,this.x);};Point.prototype.min=function(point)
 {return new Point(Math.min(this.x,point.x),Math.min(this.y,point.y));};Point.prototype.max=function(point)
 {return new Point(Math.max(this.x,point.x),Math.max(this.y,point.y));};Point.prototype.inverse=function()
@@ -309,16 +309,26 @@ Graph.prototype.FindAllEdges=function(id1,id2)
 {var edge=this.edges[i];if((edge.vertex1.id==id1&&edge.vertex2.id==id2)||(!edge.isDirect&&edge.vertex1.id==id2&&edge.vertex2.id==id1))
 {res.push(edge);}}
 return res;}
-Graph.prototype.GetAdjacencyMatrixStr=function()
+Graph.prototype.GetAdjacencyMatrixStr=function(res_columns_width)
-{var matrix="";for(var i=0;i<this.vertices.length;i++)
+{var matrix="";let cols_width=[];let get_edge_weight_str=(vertex_1,vertex_2)=>{var res="";var edge=this.FindEdgeMin(vertex_1.id,vertex_2.id);if(edge!=null)
-{for(var j=0;j<this.vertices.length;j++)
+{res+=edge.weight;}
-{var edge=this.FindEdgeMin(this.vertices[i].id,this.vertices[j].id);if(edge!=null)
-{matrix+=edge.weight;}
 else
-{matrix+="0";}
+{res+="0";}
-if(j!=this.vertices.length)
+return res;}
+for(var j=0;j<this.vertices.length;j++)
+{cols_width.push(0);for(var i=0;i<this.vertices.length;i++)
+{let weight_str=get_edge_weight_str(this.vertices[i],this.vertices[j]);let weight_len=weight_str.length;if(this.vertices[j].mainText.toString().length>weight_len&&weight_len==1)
+{weight_len=2;}
+if(weight_len>cols_width[j])
+{cols_width[j]=weight_len;}}}
+for(var i=0;i<this.vertices.length;i++)
+{for(var j=0;j<this.vertices.length;j++)
+{let weight_str=get_edge_weight_str(this.vertices[i],this.vertices[j]);if(weight_str.length<cols_width[j])
+{weight_str=" ".repeat(cols_width[j]-weight_str.length)+weight_str;}
+matrix+=weight_str;if(j!=this.vertices.length)
 {matrix+=", ";}}
 matrix=matrix+"\n";}
+if(res_columns_width!==undefined){res_columns_width.length=0;res_columns_width.push(...cols_width);}
 return matrix;}
 Graph.prototype.GetAdjacencyMatrix=function()
 {var matrix=[];for(var i=0;i<this.vertices.length;i++)
@@ -473,17 +483,20 @@ for(var i=cols.length;i<Math.max(this.vertices.length,cols.length);i++)
 {this.DeleteVertex(this.vertices[i]);i--;}
 this.VerticesReposition(viewportSize,newVertices);}}
 Graph.prototype.GetIncidenceMatrix=function()
-{var matrix="";for(var i=0;i<this.vertices.length;i++)
+{var matrix="";let cols_width=[];let get_edge_weight_str=(vertex_index,edge_index)=>{if(this.edges[edge_index].vertex1==this.vertices[vertex_index])
-{for(var j=0;j<this.edges.length;j++)
+{return this.edges[edge_index].weight.toString();}
-{if(this.edges[j].vertex1==this.vertices[i])
+else if(this.edges[edge_index].vertex2==this.vertices[vertex_index]&&!this.edges[edge_index].isDirect)
-{matrix+=this.edges[j].weight;}
+{return this.edges[edge_index].weight.toString();}
-else if(this.edges[j].vertex2==this.vertices[i]&&!this.edges[j].isDirect)
+else if(this.edges[edge_index].vertex2==this.vertices[vertex_index]&&this.edges[edge_index].isDirect)
-{matrix+=this.edges[j].weight;}
+{return-this.edges[edge_index].weight.toString();}
-else if(this.edges[j].vertex2==this.vertices[i]&&this.edges[j].isDirect)
-{matrix+=-this.edges[j].weight;}
 else
-{matrix+="0";}
+{return"0";}};for(var j=0;j<this.edges.length;j++)
-if(j!=this.edges.length-1)
+{let max_width=0;for(var i=0;i<this.vertices.length;i++)
+{let str=""+get_edge_weight_str(i,j);max_width=Math.max(max_width,str.length);}
+cols_width.push(max_width);}
+for(var i=0;i<this.vertices.length;i++)
+{for(var j=0;j<this.edges.length;j++)
+{let weight_str=get_edge_weight_str(i,j);weight_str=" ".repeat(cols_width[j]-weight_str.length)+weight_str;matrix+=""+weight_str;if(j!=this.edges.length-1)
 {matrix+=", ";}}
 matrix=matrix+"\n";}
 return matrix;}

script/pages/create_graph_by_matrix/api/index.js.cache

@@ -1,4 +1,4 @@
-moduleLoader.beginCacheLoading(["/script/entities/graph/api/index.js?v=103","/script/shared/point.js?v=103","/script/entities/edge/api/index.js?v=103","/script/entities/edge/model/BaseEdge.js?v=103","/script/entities/edge/model/EdgeModel.js?v=103","/script/entities/vertex/api/index.js?v=103","/script/entities/vertex/model/BaseVertex.js?v=103","/script/entities/vertex/model/VertexModel.js?v=103","/script/entities/graph/model/Graph.js?v=103","/script/pages/create_graph_by_matrix/model/createByMatrixMain.js?v=103","/script/pages/create_graph_by_matrix/model/main.js?v=103",]);{let modulDir="pages/create_graph_by_matrix/";doInclude([include("entities/graph/api/index.js"),include("model/createByMatrixMain.js",modulDir),include("model/main.js",modulDir)]);}
+moduleLoader.beginCacheLoading(["/script/entities/graph/api/index.js?v=104","/script/shared/point.js?v=104","/script/entities/edge/api/index.js?v=104","/script/entities/edge/model/BaseEdge.js?v=104","/script/entities/edge/model/EdgeModel.js?v=104","/script/entities/vertex/api/index.js?v=104","/script/entities/vertex/model/BaseVertex.js?v=104","/script/entities/vertex/model/VertexModel.js?v=104","/script/entities/graph/model/Graph.js?v=104","/script/pages/create_graph_by_matrix/model/createByMatrixMain.js?v=104","/script/pages/create_graph_by_matrix/model/main.js?v=104",]);{let modulDir="pages/create_graph_by_matrix/";doInclude([include("entities/graph/api/index.js"),include("model/createByMatrixMain.js",modulDir),include("model/main.js",modulDir)]);}
 {let modulDir="entities/graph/";doInclude([include("shared/point.js"),include("entities/edge/api/index.js"),include("entities/vertex/api/index.js"),include("model/Graph.js",modulDir)])}function Point(x,y){this.x=x||0;this.y=y||0;};Point.prototype.x=null;Point.prototype.y=null;Point.prototype.add=function(v){return new Point(this.x+v.x,this.y+v.y);};Point.prototype.addValue=function(v){return new Point(this.x+v,this.y+v);};Point.prototype.clone=function(){return new Point(this.x,this.y);};Point.prototype.degreesTo=function(v){var dx=this.x-v.x;var dy=this.y-v.y;var angle=Math.atan2(dy,dx);return angle*(180/Math.PI);};Point.prototype.distance=function(v){return Math.sqrt(this.distanceSqr(v));};Point.prototype.distanceSqr=function(v){var x=this.x-v.x;var y=this.y-v.y;return x*x+y*y;};Point.prototype.equals=function(toCompare){return this.x==toCompare.x&&this.y==toCompare.y;};Point.prototype.interpolate=function(v,f){return new Point((this.x+v.x)*f,(this.y+v.y)*f);};Point.prototype.length=function(){return Math.sqrt(this.x*this.x+this.y*this.y);};Point.prototype.normalize=function(thickness){var l=this.length();this.x=this.x/l*thickness;this.y=this.y/l*thickness;return new Point(this.x,this.y);};Point.prototype.normalizeCopy=function(thickness){var l=this.length();return new Point(this.x/l*thickness,this.y/l*thickness);};Point.prototype.orbit=function(origin,arcWidth,arcHeight,degrees){var radians=degrees*(Math.PI/180);this.x=origin.x+arcWidth*Math.cos(radians);this.y=origin.y+arcHeight*Math.sin(radians);};Point.prototype.rotate=function(center,degrees){var radians=degrees*(Math.PI/180);offset=this.subtract(center);this.x=offset.x*Math.cos(radians)-offset.y*Math.sin(radians);this.y=offset.x*Math.sin(radians)+offset.y*Math.cos(radians);this.x=this.x+center.x;this.y=this.y+center.y;return this;};Point.prototype.offset=function(dx,dy){this.x+=dx;this.y+=dy;};Point.prototype.subtract=function(v){return new Point(this.x-v.x,this.y-v.y);};Point.prototype.subtractValue=function(value){return new Point(this.x-value,this.y-value);};Point.prototype.multiply=function(value){return new Point(this.x*value,this.y*value);};Point.prototype.toString=function(){return"(x="+this.x+", y="+this.y+")";};Point.prototype.normal=function(){return new Point(-this.y,this.x);};Point.prototype.min=function(point)
 {return new Point(Math.min(this.x,point.x),Math.min(this.y,point.y));};Point.prototype.max=function(point)
 {return new Point(Math.max(this.x,point.x),Math.max(this.y,point.y));};Point.prototype.inverse=function()
@@ -309,16 +309,26 @@ Graph.prototype.FindAllEdges=function(id1,id2)
 {var edge=this.edges[i];if((edge.vertex1.id==id1&&edge.vertex2.id==id2)||(!edge.isDirect&&edge.vertex1.id==id2&&edge.vertex2.id==id1))
 {res.push(edge);}}
 return res;}
-Graph.prototype.GetAdjacencyMatrixStr=function()
+Graph.prototype.GetAdjacencyMatrixStr=function(res_columns_width)
-{var matrix="";for(var i=0;i<this.vertices.length;i++)
+{var matrix="";let cols_width=[];let get_edge_weight_str=(vertex_1,vertex_2)=>{var res="";var edge=this.FindEdgeMin(vertex_1.id,vertex_2.id);if(edge!=null)
-{for(var j=0;j<this.vertices.length;j++)
+{res+=edge.weight;}
-{var edge=this.FindEdgeMin(this.vertices[i].id,this.vertices[j].id);if(edge!=null)
-{matrix+=edge.weight;}
 else
-{matrix+="0";}
+{res+="0";}
-if(j!=this.vertices.length)
+return res;}
+for(var j=0;j<this.vertices.length;j++)
+{cols_width.push(0);for(var i=0;i<this.vertices.length;i++)
+{let weight_str=get_edge_weight_str(this.vertices[i],this.vertices[j]);let weight_len=weight_str.length;if(this.vertices[j].mainText.toString().length>weight_len&&weight_len==1)
+{weight_len=2;}
+if(weight_len>cols_width[j])
+{cols_width[j]=weight_len;}}}
+for(var i=0;i<this.vertices.length;i++)
+{for(var j=0;j<this.vertices.length;j++)
+{let weight_str=get_edge_weight_str(this.vertices[i],this.vertices[j]);if(weight_str.length<cols_width[j])
+{weight_str=" ".repeat(cols_width[j]-weight_str.length)+weight_str;}
+matrix+=weight_str;if(j!=this.vertices.length)
 {matrix+=", ";}}
 matrix=matrix+"\n";}
+if(res_columns_width!==undefined){res_columns_width.length=0;res_columns_width.push(...cols_width);}
 return matrix;}
 Graph.prototype.GetAdjacencyMatrix=function()
 {var matrix=[];for(var i=0;i<this.vertices.length;i++)
@@ -473,17 +483,20 @@ for(var i=cols.length;i<Math.max(this.vertices.length,cols.length);i++)
 {this.DeleteVertex(this.vertices[i]);i--;}
 this.VerticesReposition(viewportSize,newVertices);}}
 Graph.prototype.GetIncidenceMatrix=function()
-{var matrix="";for(var i=0;i<this.vertices.length;i++)
+{var matrix="";let cols_width=[];let get_edge_weight_str=(vertex_index,edge_index)=>{if(this.edges[edge_index].vertex1==this.vertices[vertex_index])
-{for(var j=0;j<this.edges.length;j++)
+{return this.edges[edge_index].weight.toString();}
-{if(this.edges[j].vertex1==this.vertices[i])
+else if(this.edges[edge_index].vertex2==this.vertices[vertex_index]&&!this.edges[edge_index].isDirect)
-{matrix+=this.edges[j].weight;}
+{return this.edges[edge_index].weight.toString();}
-else if(this.edges[j].vertex2==this.vertices[i]&&!this.edges[j].isDirect)
+else if(this.edges[edge_index].vertex2==this.vertices[vertex_index]&&this.edges[edge_index].isDirect)
-{matrix+=this.edges[j].weight;}
+{return-this.edges[edge_index].weight.toString();}
-else if(this.edges[j].vertex2==this.vertices[i]&&this.edges[j].isDirect)
-{matrix+=-this.edges[j].weight;}
 else
-{matrix+="0";}
+{return"0";}};for(var j=0;j<this.edges.length;j++)
-if(j!=this.edges.length-1)
+{let max_width=0;for(var i=0;i<this.vertices.length;i++)
+{let str=""+get_edge_weight_str(i,j);max_width=Math.max(max_width,str.length);}
+cols_width.push(max_width);}
+for(var i=0;i<this.vertices.length;i++)
+{for(var j=0;j<this.edges.length;j++)
+{let weight_str=get_edge_weight_str(i,j);weight_str=" ".repeat(cols_width[j]-weight_str.length)+weight_str;matrix+=""+weight_str;if(j!=this.edges.length-1)
 {matrix+=", ";}}
 matrix=matrix+"\n";}
 return matrix;}

script/pages/editor/api/index.js.cache

@@ -1,4 +1,4 @@
-moduleLoader.beginCacheLoading(["/script/shared/utils.js?v=103","/script/shared/gzip.js?v=103","/script/entities/graph/api/index.js?v=103","/script/shared/point.js?v=103","/script/entities/edge/api/index.js?v=103","/script/entities/edge/model/BaseEdge.js?v=103","/script/entities/edge/model/EdgeModel.js?v=103","/script/entities/vertex/api/index.js?v=103","/script/entities/vertex/model/BaseVertex.js?v=103","/script/entities/vertex/model/VertexModel.js?v=103","/script/entities/graph/model/Graph.js?v=103","/script/features/draw_graph/api/index.js?v=103","/script/features/draw_graph/model/BaseBackgroundDrawer.js?v=103","/script/features/draw_graph/model/EdgeStyle.js?v=103","/script/features/draw_graph/model/BaseEdgeDrawer.js?v=103","/script/features/draw_graph/model/VertexShape.js?v=103","/script/features/draw_graph/model/VertexStyle.js?v=103","/script/features/draw_graph/model/BaseVertexDrawer.js?v=103","/script/features/draw_graph/model/GraphFullStyle.js?v=103","/script/features/algorithms/api/index.js?v=103","/script/features/algorithms/model/Algorithms.js?v=103","/script/features/algorithms/model/BaseTraversal.js?v=103","/script/features/base_handler/index.js?v=103","/script/features/default_handler/index.js?v=103","/script/features/add_vertices_handler/index.js?v=103","/script/features/connect_vertices_handler/index.js?v=103","/script/features/delete_objects_handler/index.js?v=103","/script/features/algorithm_handler/index.js?v=103","/script/features/select_auto_save_graph_or_not/index.js?v=103","/script/features/graph_preview/index.js?v=103","/script/features/serialization/api/index.js?v=103","/script/features/serialization/model/GraphMLCreator.js?v=103","/script/features/enum_vertices/EnumVertices.js?v=103","/script/pages/editor/model/texts.js?v=103","/script/pages/editor/model/UndoStack.js?v=103","/script/pages/editor/model/DiskSaveLoad.js?v=103","/script/pages/editor/model/Application.js?v=103","/script/pages/editor/ui/ya_metrika.js?v=103","/script/pages/editor/ui/editor.js?v=103","/script/pages/editor/ui/main.js?v=103",]);{function onloadEditor(){console.log("onload() call");doIncludeAsync([include("shared/canvas2svg.min.js"),include("features/group_rename_handler/index.js"),include("features/saved_graph_handler/index.js"),include("features/saved_graph_image_handler/index.js"),include("features/show_adjacency_matrix/index.js"),include("features/show_distance_matrix/index.js"),include("features/show_incidence_matrix/index.js"),include("features/setup_background_style/index.js"),include("features/setup_edge_style/index.js"),include("features/setup_vertex_style/index.js"),]);postLoadPage();}
+moduleLoader.beginCacheLoading(["/script/shared/utils.js?v=104","/script/shared/gzip.js?v=104","/script/entities/graph/api/index.js?v=104","/script/shared/point.js?v=104","/script/entities/edge/api/index.js?v=104","/script/entities/edge/model/BaseEdge.js?v=104","/script/entities/edge/model/EdgeModel.js?v=104","/script/entities/vertex/api/index.js?v=104","/script/entities/vertex/model/BaseVertex.js?v=104","/script/entities/vertex/model/VertexModel.js?v=104","/script/entities/graph/model/Graph.js?v=104","/script/features/draw_graph/api/index.js?v=104","/script/features/draw_graph/model/BaseBackgroundDrawer.js?v=104","/script/features/draw_graph/model/EdgeStyle.js?v=104","/script/features/draw_graph/model/BaseEdgeDrawer.js?v=104","/script/features/draw_graph/model/VertexShape.js?v=104","/script/features/draw_graph/model/VertexStyle.js?v=104","/script/features/draw_graph/model/BaseVertexDrawer.js?v=104","/script/features/draw_graph/model/GraphFullStyle.js?v=104","/script/features/algorithms/api/index.js?v=104","/script/features/algorithms/model/Algorithms.js?v=104","/script/features/algorithms/model/BaseTraversal.js?v=104","/script/features/base_handler/index.js?v=104","/script/features/default_handler/index.js?v=104","/script/features/add_vertices_handler/index.js?v=104","/script/features/connect_vertices_handler/index.js?v=104","/script/features/delete_objects_handler/index.js?v=104","/script/features/algorithm_handler/index.js?v=104","/script/features/select_auto_save_graph_or_not/index.js?v=104","/script/features/graph_preview/index.js?v=104","/script/features/serialization/api/index.js?v=104","/script/features/serialization/model/GraphMLCreator.js?v=104","/script/features/enum_vertices/EnumVertices.js?v=104","/script/pages/editor/model/texts.js?v=104","/script/pages/editor/model/UndoStack.js?v=104","/script/pages/editor/model/DiskSaveLoad.js?v=104","/script/pages/editor/model/Application.js?v=104","/script/pages/editor/ui/ya_metrika.js?v=104","/script/pages/editor/ui/editor.js?v=104","/script/pages/editor/ui/main.js?v=104",]);{function onloadEditor(){console.log("onload() call");doIncludeAsync([include("shared/canvas2svg.min.js"),include("features/group_rename_handler/index.js"),include("features/saved_graph_handler/index.js"),include("features/saved_graph_image_handler/index.js"),include("features/show_adjacency_matrix/index.js"),include("features/show_distance_matrix/index.js"),include("features/show_incidence_matrix/index.js"),include("features/setup_background_style/index.js"),include("features/setup_edge_style/index.js"),include("features/setup_vertex_style/index.js"),]);postLoadPage();}
 let modulDir="pages/editor/";doInclude([include("shared/utils.js"),include("shared/gzip.js"),include("entities/graph/api/index.js"),include("features/draw_graph/api/index.js"),include("features/algorithms/api/index.js"),include("features/base_handler/index.js"),include("features/default_handler/index.js"),include("features/add_vertices_handler/index.js"),include("features/connect_vertices_handler/index.js"),include("features/delete_objects_handler/index.js"),include("features/algorithm_handler/index.js"),include("features/select_auto_save_graph_or_not/index.js"),include("features/serialization/api/index.js"),include("features/enum_vertices/EnumVertices.js"),include("model/texts.js",modulDir),include("model/UndoStack.js",modulDir),include("model/DiskSaveLoad.js",modulDir),include("model/Application.js",modulDir),include("ui/ya_metrika.js",modulDir),include("ui/editor.js",modulDir),include("ui/main.js",modulDir)],onloadEditor);}
 function gEncodeToHTML(str)
 {if(typeof str!=='string')
@@ -338,16 +338,26 @@ Graph.prototype.FindAllEdges=function(id1,id2)
 {var edge=this.edges[i];if((edge.vertex1.id==id1&&edge.vertex2.id==id2)||(!edge.isDirect&&edge.vertex1.id==id2&&edge.vertex2.id==id1))
 {res.push(edge);}}
 return res;}
-Graph.prototype.GetAdjacencyMatrixStr=function()
+Graph.prototype.GetAdjacencyMatrixStr=function(res_columns_width)
-{var matrix="";for(var i=0;i<this.vertices.length;i++)
+{var matrix="";let cols_width=[];let get_edge_weight_str=(vertex_1,vertex_2)=>{var res="";var edge=this.FindEdgeMin(vertex_1.id,vertex_2.id);if(edge!=null)
-{for(var j=0;j<this.vertices.length;j++)
+{res+=edge.weight;}
-{var edge=this.FindEdgeMin(this.vertices[i].id,this.vertices[j].id);if(edge!=null)
-{matrix+=edge.weight;}
 else
-{matrix+="0";}
+{res+="0";}
-if(j!=this.vertices.length)
+return res;}
+for(var j=0;j<this.vertices.length;j++)
+{cols_width.push(0);for(var i=0;i<this.vertices.length;i++)
+{let weight_str=get_edge_weight_str(this.vertices[i],this.vertices[j]);let weight_len=weight_str.length;if(this.vertices[j].mainText.toString().length>weight_len&&weight_len==1)
+{weight_len=2;}
+if(weight_len>cols_width[j])
+{cols_width[j]=weight_len;}}}
+for(var i=0;i<this.vertices.length;i++)
+{for(var j=0;j<this.vertices.length;j++)
+{let weight_str=get_edge_weight_str(this.vertices[i],this.vertices[j]);if(weight_str.length<cols_width[j])
+{weight_str=" ".repeat(cols_width[j]-weight_str.length)+weight_str;}
+matrix+=weight_str;if(j!=this.vertices.length)
 {matrix+=", ";}}
 matrix=matrix+"\n";}
+if(res_columns_width!==undefined){res_columns_width.length=0;res_columns_width.push(...cols_width);}
 return matrix;}
 Graph.prototype.GetAdjacencyMatrix=function()
 {var matrix=[];for(var i=0;i<this.vertices.length;i++)
@@ -502,17 +512,20 @@ for(var i=cols.length;i<Math.max(this.vertices.length,cols.length);i++)
 {this.DeleteVertex(this.vertices[i]);i--;}
 this.VerticesReposition(viewportSize,newVertices);}}
 Graph.prototype.GetIncidenceMatrix=function()
-{var matrix="";for(var i=0;i<this.vertices.length;i++)
+{var matrix="";let cols_width=[];let get_edge_weight_str=(vertex_index,edge_index)=>{if(this.edges[edge_index].vertex1==this.vertices[vertex_index])
-{for(var j=0;j<this.edges.length;j++)
+{return this.edges[edge_index].weight.toString();}
-{if(this.edges[j].vertex1==this.vertices[i])
+else if(this.edges[edge_index].vertex2==this.vertices[vertex_index]&&!this.edges[edge_index].isDirect)
-{matrix+=this.edges[j].weight;}
+{return this.edges[edge_index].weight.toString();}
-else if(this.edges[j].vertex2==this.vertices[i]&&!this.edges[j].isDirect)
+else if(this.edges[edge_index].vertex2==this.vertices[vertex_index]&&this.edges[edge_index].isDirect)
-{matrix+=this.edges[j].weight;}
+{return-this.edges[edge_index].weight.toString();}
-else if(this.edges[j].vertex2==this.vertices[i]&&this.edges[j].isDirect)
-{matrix+=-this.edges[j].weight;}
 else
-{matrix+="0";}
+{return"0";}};for(var j=0;j<this.edges.length;j++)
-if(j!=this.edges.length-1)
+{let max_width=0;for(var i=0;i<this.vertices.length;i++)
+{let str=""+get_edge_weight_str(i,j);max_width=Math.max(max_width,str.length);}
+cols_width.push(max_width);}
+for(var i=0;i<this.vertices.length;i++)
+{for(var j=0;j<this.edges.length;j++)
+{let weight_str=get_edge_weight_str(i,j);weight_str=" ".repeat(cols_width[j]-weight_str.length)+weight_str;matrix+=""+weight_str;if(j!=this.edges.length-1)
 {matrix+=", ";}}
 matrix=matrix+"\n";}
 return matrix;}
@@ -1709,8 +1722,8 @@ Application.prototype.SetStatus=function(name,value)
 {this.status[name]=value;}
 Application.prototype.GetStatus=function()
 {return this.status[name];}
-Application.prototype.GetAdjacencyMatrix=function()
+Application.prototype.GetAdjacencyMatrix=function(res_columns_width)
-{return this.graph.GetAdjacencyMatrixStr();}
+{return this.graph.GetAdjacencyMatrixStr(res_columns_width);}
 Application.prototype.TestAdjacencyMatrix=function(matrix,rowsObj,colsObj,separator)
 {if(separator===undefined)
 {separator=",";}

script/pages/editor/model/Application.js

@@ -846,9 +846,9 @@ Application.prototype.GetStatus = function()
 }
 
 
-Application.prototype.GetAdjacencyMatrix = function ()
+Application.prototype.GetAdjacencyMatrix = function (res_columns_width)
 {
-	return this.graph.GetAdjacencyMatrixStr();
+	return this.graph.GetAdjacencyMatrixStr(res_columns_width);
 }
 
 Application.prototype.TestAdjacencyMatrix = function (matrix, rowsObj, colsObj, separator)

tpl/home.php

@@ -401,9 +401,21 @@
 	<div id="adjacencyMatrix">
 		<form>
 		<fieldset>
-				<p><?= L('adjacency_matrix_description')?></p>
+				<p style="margin-bottom: 0.5rem;"><?= L('adjacency_matrix_description')?></p>
         <p id="AdjacencyMatrixMultiGraphDesc"><?= L('adjacency_matrix_multigraph_description')?></p>
-				<textarea name="adjacencyMatrixField" id="AdjacencyMatrixField" wrap="off"></textarea>
+        <div class="matrix-wrapper">
+          <div class="corner"><span class="bi bi-arrow-90deg-right"></span></div>
+
+          <div class="top-text-wrap" id="adjacencyMatrix_top_text">
+            <div class="top-text" id="adjacencyMatrix_top_text_text"></div>
+          </div>
+
+          <div class="side-text-wrap" id="adjacencyMatrix_side_text">
+            <div class="side-text" id="adjacencyMatrix_side_text_text"></div>
+          </div>
+
+          <textarea class="matrix" name="adjacencyMatrixField" id="AdjacencyMatrixField" wrap="off"></textarea>
+        </div>
 				<p id="BadMatrixFormatMessage"><?= L('adjacency_matrix_bad_format')?></p>
 		</fieldset>
 		</form>
@@ -412,8 +424,17 @@
 	<div id="incidenceMatrix">
 		<form>
 		<fieldset>
-				<p><?= L('incidence_matrix_description')?></p>				
+				<p style="margin-bottom: 0.5rem;"><?= L('incidence_matrix_description')?></p>				
-				<textarea name="incidenceMatrixField" id="IncidenceMatrixField" wrap="off"></textarea>
+				
+        <div class="matrix-wrapper">
+
+          <div class="side-text-wrap" id="incidenceMatrix_side_text">
+            <div class="side-text" id="incidenceMatrix_side_text_text"></div>
+          </div>
+
+          <textarea class="matrix" name="incidenceMatrixField" id="IncidenceMatrixField" wrap="off"></textarea>
+        </div>
+
 				<p id="BadIncidenceMatrixFormatMessage"><?= L('incidence_matrix_bad_format')?></p>
 		</fieldset>
 		</form>
@@ -422,8 +443,21 @@
 	<div id="floidMatrix">
 		<form>
 		<fieldset>
-				<p><?= L('min_dist_matrix_description') ?></p>
+				<p style="margin-bottom: 0.5rem;"><?= L('min_dist_matrix_description') ?></p>
-				<textarea name="floidMatrixField" id="FloidMatrixField" wrap="off"></textarea>
+
+        <div class="matrix-wrapper">
+          <div class="corner"><span class="bi bi-arrow-90deg-right"></span></div>
+
+          <div class="top-text-wrap" id="floidMatrix_top_text">
+            <div class="top-text" id="floidMatrix_top_text_text"></div>
+          </div>
+
+          <div class="side-text-wrap" id="floidMatrix_side_text">
+            <div class="side-text" id="floidMatrix_side_text_text"></div>
+          </div>
+
+          <textarea class="matrix" name="floidMatrixField" id="FloidMatrixField" wrap="off"></textarea>
+        </div>
 		</fieldset>
 		</form>
     </div>