2016-06-28 4 views
0

Я успешно создал строку с помощью jsPlumb. Ниже приведен код:Получить цвет линии jsPlumb после SetPaintStyle

myid_create_line_instance(0, '1px', '#00000'); 

//A function that creates line instance. 
function myid_create_line_instance(id, width, color){ 
    jsPlumb_instance[id] = jsPlumb.getInstance();  
    var id1 = 'myid_templates_editor_line_' + id + '_pair_1'; 
    var id2 = 'myid_templates_editor_line_' + id + '_pair_2';  

    var endpointOptions = { 
     anchor:'BottomCenter', 
     maxConnections:1,      
     endpoint:['Rectangle',{width:'1px', height:'1px' }],      
     connectorStyle:{lineWidth:width,strokeStyle:color}, 
     connector:['Straight'],      
    }; 

    div1Endpoint = jsPlumb_instance[id].addEndpoint(id1, endpointOptions); 
    div2Endpoint = jsPlumb_instance[id].addEndpoint(id2, endpointOptions);  

    jsPlumb_instance[id].connect({  
     source:div1Endpoint, 
     target:div2Endpoint, 
    });   

    jsPlumb_instance[id].draggable(id1); 
    jsPlumb_instance[id].draggable(id2); 

} 

enter image description here

Я редактировал цвет и ширину линии с помощью кода ниже.

//The width and color values are from the users input. 
width = '5px'; 
color = '#ff8080'; 
jsPlumb_instance[0].select().setPaintStyle({lineWidth: width, strokeStyle:color}); 

enter image description here

Я хочу, чтобы сохранить выбранную ширину и цвет линии к базе данных, поэтому я использую код ниже:

console.log(myid_get_line_color(0)); 
console.log(myid_get_line_width(id)); 

//A function that gets the line color base on it's id. 
function myid_get_line_color(id){ 
    var connections = jsPlumb_instance[id].getConnections(); 
    return connections[0]['endpoints'][0]['connectorStyle']['strokeStyle']; 
} 

//A function that gets the line width base on it's id. 
function myid_get_line_width(id){ 
    var connections = jsPlumb_instance[id].getConnections(); 
    return connections[0]['endpoints'][0]['connectorStyle']['lineWidth']; 
} 

консоль возвращает 1 и #00000, которые не является правильным. Он выводил предыдущие значения. Как я это исправлю?

ответ

0

Я исправляю свою проблему с помощью post в stackoverflow. Вместо использования setPaintStyle я использовал getPaintStyle.

jsPlumb_instance[id].select().getPaintStyle()[0][0].strokeStyle = color; 
jsPlumb_instance[id].select().getPaintStyle()[0][0].lineWidth = width + 'px';