Image button

Hi all

I would like to insert the image as the button and I would like to change to another image button when i click collapsing or expanding group on the button.

Please suggest me, How to solve my problem by using GoJs

Thank in advance

If you are using a “Button” Panel, as described at http://gojs.net/latest/intro/buttons.html, and if you want to use a Picture, just add it as the only element inside the “Button”.

Your button click event handler can change the appearance of the button. Remember to perform all changes within a transaction.

It would help if you provided screenshots for before and after states.

Thank Walter

I have inserted “go.Picture” as code bellow but when diagram is started, it displays “start.svg” as the button in the group and then when i click for expanding the group it still display “start.svg” as the button

So, I would like to change “start.svg” to another image when group are expand. Can u suggest me how to add attribute in order to change the image when the group are expand

$("SubGraphExpanderButton",
	{
		width: 15,
		"ButtonBorder.fill": "transperlent"
	},
	$(go.Picture,  { width: 15, height: 15, source:"../images/start.svg"})
),

Thank in advance

OK, now I have a better understanding of what you are trying to do.

I suggest that you study the implementation of the “SubGraphExpanderButton” that is provided in http://gojs.net/latest/extensions/Buttons.js. Copy it, rename it, and modify it to use a Picture instead of a Shape, binding Picture.source instead of Shape.figure.

Thank you very much, I will try your solution.