#javascript #gojs
#javascript #gojs
Вопрос:
Здравствуйте, у меня проблема со стилем ContextMenuButton :/
cm.add(this.$("ContextMenuButton",
this.$(go.TextBlock, {
text: 'Usuń',
stroke: '#323232',
background: '#eee',
margin: 0,
alignment: go.Spot.Center
}),
{
click: () => {
this.diagram.commandHandler.deleteSelection();
},
mouseHover: () => {
console.log(this.diagram);
}
}));
Как установить новые свойства для cm
объекта? Я имею в виду, как удалить синюю тень? (наведение курсора мыши)
Ответ №1:
Вам нужно добавить selectionAdorned: false
в свое контекстное меню.
Вот пример, который я сделал в Codepen.
Вы можете видеть, что это контекстное меню, и когда вы удаляете свойство selectionAdorned, при нажатии на элементы у вас будет выделение вокруг квадрата.
Вы можете найти документацию об этом здесь .
Ответ №2:
Хорошо, но это не работает:/ единственное место, где я что-то нашел contextMenu
, — это эта часть кода. Как вы можете видеть, я добавил cm.selectionAdorned = false;
private setUpDiagram() {
this.diagram = new go.Diagram();
this.diagram.initialContentAlignment = go.Spot.Center;
this.diagram.undoManager.isEnabled = true;
this.diagram.validCycle = go.Diagram.CycleNotDirected;
this.diagram.toolManager.panningTool.canStart = () => {
return this.diagram.lastInput.control;
};
this.diagram.toolManager.dragSelectingTool.isEnabled = true;
this.diagram.allowCopy = false;
this.diagram.addDiagramListener('SelectionMoved', () => this.shiftNodesToEmptySpaces(this.diagram));
this.diagram.toolManager.draggingTool.isCopyEnabled = false;
this.diagram.toolManager.contextMenuTool.showContextMenu = (cm: Adornment, obj) => {
let data = obj.part.data;
this.diagram.selectCollection(this.diagram.selection.filter(x => x.key != '0'));
while (cm.elements.count > 0) cm.removeAt(0);
cm.selectionAdorned = false;
console.log(cm);
if (data.key != '0') {
cm.add(this.$("ContextMenuButton",
this.$(go.Shape,
{
stroke: null, strokeWidth: 0,
fill: '#323232',
width: 50,
height: 25
},
),
this.$(go.TextBlock, {
text: 'Usuń',
stroke: '#ffffff',
background: '#323232',
margin: 0,
alignment: go.Spot.Center
}),
{
click: () => {
this.diagram.commandHandler.deleteSelection();
}
}));
}
go.ContextMenuTool.prototype.showContextMenu.call(this.diagram.toolManager.contextMenuTool, cm, obj);
};
}