如何通过mxGraph中的mouseEvent使用Obect(cell)更改单元格样式?

时间:2018-10-10 04:18:41

标签: javascript stylesheet mxgraph

我可以更改svg样式,但是页面不起作用,可能需要redraw()。该怎么做?

保存单元节点

public async Task AddMoviesToStudioAsync(List<Movie> movies, int studioId) 
{
    var movieStudiosList
        = movies.Select(
            movie => new MovieStudios
            {
                MovieId = movie.Id, 
                StudioId = studioId
            })
            .ToList();

    await DbContext.Set<MovieStudios>().AddRangeAsync(movieStudiosList);
}

点击功能

let svg = {}

事件监听器

function clickFn(){
    let keys = Object.keys(svg)
    keys.forEach((item,i)=>{
        if(item.split('.')[0] === 'col' ){
            svg[item].style = 'col'
            if(me.sourceState.cell.id === item){
                svg[item].style = 'active'
                //do not work!is need redraw()?
                //but svg[item] hasn't redraw()
            }else{
                svg[item].style = 'col'
            }
            // svg[item].shape.redraw();
        }
    })
}

插入节点使用'col + col.sort'保存

graph.addMouseListener({
    mouseDown: function(sender, me){
            if(me.sourceState && me.sourceState.cell && me.sourceState.cell.id.split('.')[0] === 'col'){
                clickFn()
            }
        },
    });

插入链接

let WIDTH1 = 280,WIDTH2 = 250,WIDTH3 = 240,id = '';
this.dataBlood.forEach((fold,i)=>{
    svg['fold' + fold.sort] = graph.insertVertex(parent, null, '', 0, 0, WIDTH1, 0, 'column');
    fold.tables.forEach((table,index)=>{
        id = 'fold' + i + '.table' + index;
        svg[id] = graph.insertVertex(svg['fold' + fold.sort], id, table.name, 0, 0, WIDTH2, 30,'table');
        svg[id].collapsed = true;
        table.col.forEach((col)=>{
            svg['col.' + col.id] = graph.insertVertex(svg[id], 'col.' + col.id, col.name, 0, 0, WIDTH3, 20,'col');
        })
    })

})

}

0 个答案:

没有答案