如何禁用gojs图中的自动中心？答案

【问题标题】：how to disable the automatic center in gojs diagram?如何禁用gojs图中的自动中心？
【发布时间】：2019-09-16 16:58:49
【问题描述】：

第一次点击图表导致页面自动定位在中心不变，怎么禁用？我该如何解决？我找不到这些问题的文档。 goJs 版本 2.0.9 我们已经将 gojs 与 angular js 集成在一起，这些是在两只蜜蜂检索节点和链接之后调用的函数

$scope.createCustomNode = function () {
            var nodePicture = $scope.make(
                $go.Picture,
                {maxSize: new go.Size(475, 166)},
                new $go.Binding("source", "src")
            )
            var nodeTesxt = $scope.make(
                $go.TextBlock,
                "Default Text",
                new go.Binding("stroke", "color"),
                {margin: 12, font: "21px sans-serif"},
                new $go.Binding('text', 'name')
            )
            var managedEvent = {
                click: function (e, obj) {
                    $scope.nodeClick(obj.part.data.key)
                },
            }
            $scope.diagram.nodeTemplate = $scope.make(
                $go.Node,
                managedEvent,
                new $go.Binding("location", "loc", $go.Point.parse).makeTwoWay($go.Point.stringify),
                'Vertical',
                {background: 'transparent'},
                nodePicture,
                nodeTesxt
            )
        }
        $scope.createCustomLink = function () {
            var linkStyle = $scope.make(
                $go.Shape,
                new go.Binding("stroke", "color"),
                new go.Binding("strokeWidth", "width"),
                new go.Binding("strokeDashArray", "dash")
            )
            var startTextLink = $scope.make(
                $go.TextBlock,
                {font: "18px sans-serif"},
                new $go.Binding('text', 'startLabel'),
                {
                    segmentIndex: 0,
                    segmentFraction: 0.2,
                    segmentOffset: new go.Point(0, -20)
                }
            )
            var endTextLink = $scope.make(
                $go.TextBlock,
                {font: "18px sans-serif"},
                new $go.Binding('text', 'endLabel'),
                {
                    segmentIndex: 0,
                    segmentFraction: 0.8,
                    segmentOffset: new go.Point(0, -20)
                }
            )
            $scope.diagram.linkTemplate = $scope.make(
                $go.Link,
                linkStyle,
                startTextLink,
                endTextLink
            )
        }
        $scope.createDiagram = function () {
            $scope.diagram.model = $scope.model
        }
        $scope.initDiagramParams = function () {
            $scope.diagram = $scope.make($go.Diagram, 'diagram', {
                initialAutoScale: $go.Diagram.Uniform,
                // layout: new $go.ForceDirectedLayout(),
                // layout: new $go.LayeredDigraphLayout(),
                allowCopy: false
            })
            $scope.diagram.addDiagramListener('SelectionMoved', function (e) {
                $scope.nodeDragEnd(e)
            })
        }

【问题讨论】：

您使用的是哪个版本的 GoJS？（评估go.version。）除了代码中显示的内容之外，您如何初始化图表？
2.0.9，我开始图表，我调用 API 来获得节点和链接，并在答案中将数据传递给图表
您是否创建了模型并设置了 Diagram.model？
是的，函数 createDiagram.was 在 API 之后调用节点和链接

标签： gojs

【解决方案1】：

尝试在您的图表初始化中设置 Diagram.initialContentAlignment。例如：

$(go.Diagram, . . .,
  {
    initialContentAlignment: go.Spot.TopLeft,
    initialAutoScale: go.Diagram.Uniform,
    layout: . . .
  })

如果您未指定 initialContentAlignment、initialDocumentSpot 和 initialViewportSpot 或 initialPosition，则2.0 版的默认行为是在视口中居中显示内容。版本 1.* 中的默认行为是将内容放在视口的左上角。

【讨论】：