Change the font of the textblock without changing the alignment

I want to change the font of the textblock without changing the alignment of textblock.What should I do?

I use this code :

new go.Binding("alignment","alignment",go.Spot.parse).makeTwoWay(go.Spot.stringify),

Something else is going on. Changing the font does not typically reset the alignment.

What other data bindings do you have?


new go.Binding("font","font"), 
new go.Binding("stroke","color"), 
new go.Binding("text","text").makeTwoWay()

I don’t see any issues when trying to reproduce this. I can change the font without the alignment being affected. What are you doing differently from this example?

My code:

        var SD = {
            mode: "pointer",
            itemType: "pointer"
        var $ = go.GraphObject.make;
        var myDiagram = $(go.Diagram, "myDiagramDiv", {
            initialContentAlignment: go.Spot.Center,
            initialAutoScale: go.Diagram.Uniform, 
            rotatingTool: new RotateMultipleTool(),
            "toolManager.mouseWheelBehavior": go.ToolManager.WheelZoom,
            "draggingTool.isGridSnapEnabled": true,
            "draggingTool.dragsLink": true,
            "draggingTool.dragsTree": true,  
            "undoManager.isEnabled": true,
            allowDrop: true,
            allowLink: false,
            "animationManager.isEnabled": false,
        myDiagram.addDiagramListener("Modified", function(e) {
            var button = document.getElementById("SaveButton");
            if (button)
                button.disabled = !myDiagram.isModified;
            var idx = document.title.indexOf("*");
            if (myDiagram.isModified) {
                if (idx < 0)
                    document.title += "*";
            } else {
                if (idx >= 0)
                    document.title = document.title.substr(0, idx);

        myDiagram.toolManager.mouseMoveTools.insertAt(1, new NodeLabelDraggingTool());
        myDiagram.toolManager.mouseMoveTools.insertAt(0, new LinkLabelDraggingTool());

        function finishDrop(e, grp) {
            var ok = (grp !== null ? grp.addMembers(grp.diagram.selection, true) : e.diagram.commandHandler.addTopLevelParts(e.diagram.selection, true));
            if (!ok)

        go.Shape.defineFigureGenerator("Semi_Circle", function(shape, w, h) {
            var geo = new go.Geometry();
            var fig = new go.PathFigure(-1,(6) * h,false);
            fig.add(new go.PathSegment(go.PathSegment.Arc,0,180,(6) * w,(6) * h,(6) * w,(6) * h));
            return geo;

        $(go.Node, "Spot", 
         $(go.Shape, "Semi_Circle", {
            fill: "rgba(0,0,0,1)",
            strokeWidth: 2,
            stroke: "rgba(0,0,0,1)",
            height: 1,
            width: 1,
        }), $(go.TextBlock, {
            editable: true,
            _isNodeLabel: true,
            cursor: "pointer"
        }, new go.Binding("alignment","alignment",go.Spot.parse).makeTwoWay(go.Spot.stringify), new go.Binding("font","font"), new go.Binding("stroke","color"),new go.Binding("text","text").makeTwoWay()));

        var nodeDataArray = [{ key: 1, text: "Semi_Circle", color: "#B2DFDB", font: "bold 8pt Helvetica", alignment: ".5 .5 69 42" }];
        var linkDataArray = [];
        myDiagram.model = new go.GraphLinksModel(nodeDataArray, linkDataArray);

        var inspector = new Inspector('myInspectorDiv',myDiagram,
            properties: {
                "text": {},
                "font": {},
                "color": { show: Inspector.showIfNode, type: 'color' },
                "alignment": {
                    show: Inspector.showIfNode,
                    type: 'point'

        function save() {
            document.getElementById("mySavedModel").value = myDiagram.model.toJson();
            myDiagram.isModified = false;
        function load() {
            myDiagram.model = go.Model.fromJson(document.getElementById("mySavedModel").value);

The problem still exists.

Ahh, now I see the problem. You are specifying the alignment as type Spot in the DataInspector, when really it’s a string.

You can either remove the type specification on the alignment property since your data binding assumes a string, or you can make your data binding new go.Binding("alignment").makeTwoWay() and store an actual Spot in the model. I’d suggest removing the type specification.

How to resolve this error?

That should be resolved if you get the latest version of GoJS, or if you add this line to the inspector properties:

"isGroup": { readOnly: true, show: Inspector.showIfPresent }