2015-08-19 5 views
0

Я пытаюсь понять больше о Cytoscape.js aimate. Посмотрите на документацию here, если я правильно понял, что он должен изменить цвет узла на синий в течение секунды, подождать секунду, а затем изменить цвет узла на желтый. Однако, когда я нажимаю кнопку для просмотра примера, он ничего не делает.Cytoscape.js Animate Node Color

Я пытался сделать что-то подобное в моем собственном коде здесь:

$(function() { 
    $('#cy').cytoscape({ 
     style: cytoscape.stylesheet() 
      .selector('node') 
       .css({ 
        'content': 'data(name)', 
        'text-valign': 'center', 
        'color': 'black' 
       }), 

     ready: function(){ 
      window.cy = this; 

      cy.add({ 
       group: 'nodes', 
       data: {name: 'test', id: '1'}, 
       position: {x: 200, y: 100} 
      }); 

      cy.nodes().animate({ 
       style: { 
        'background-color': 'blue' 
       } 
      }, { 
       duration: 2000, 
       complete: function() { 
        console.log("Done"); 
       } 
      }); 
     } 
    }); 
}); 

но опять же цвет не меняет никаких.

В конечном счете, я надеюсь использовать анимацию и стиль для анимации, изменяя размер узла, но я просто пытался выяснить основы анимации и застрять здесь. Заранее спасибо за помощь!

ответ

Смежные вопросы