Unable to load image

GoJS
1

@walter: We are trying to use GoJS inside an angular project and we are facing an issue of images not being served for Picture object from the src/app/assets folder.

I tried a simple use case in gojs-angular-basic(GitHub - NorthwoodsSoftware/gojs-angular-basic: Simple project demonstrating usage of our GoJS/Angular components) project as well and observed the same issue. Below are the changes I made in gojs-angular-basic project for my use case:

a) Created a folder named assets under src/app and placed an image (named resources.svg) inside it
b) Updated assets property in angular.json file to point to “src/app/assets”
c) Updated nodeTemplate in app.component.ts to include a Picture element

// define the Node template
    palette.nodeTemplate =
      $(go.Node, 'Auto',
        $(go.Shape, 'RoundedRectangle',
          {
            stroke: null
          },
          new go.Binding('fill', 'color')
        ),
        $(go.Picture,
          {
            width: 40,
            height: 40,
            imageStretch: go.GraphObject.Uniform,
            source: 'assets/resources.svg',
          },
        ),
        $(go.TextBlock, { margin: 8 },
          new go.Binding('text', 'key'))
      );

Upon page load, I see a 404 error in browser console for the image not being found

image
image1134×58 9.29 KB

Could you please help me out on this as I am stuck here?

Thanks in advance.

2

I don’t know the answer, but a quick web search reveals this to be a common problem, so I really do not think this is a problem with GoJS. I hope you can find answers from the Angular community.