如何在Cytoscape中创建“细节面板”？

<script src="https://unpkg.com/cytoscape/dist/cytoscape.min.js"></script>

<div id="cy"></div>

var cy = cytoscape({
  container: document.getElementById('cy'),
  elements: [ /* 网络数据 */ ],
  style: [ /* 样式规则 */ ],
  layout: { /* 布局选项 */ }
});

cy.on('click', 'node', function(event){
  var node = event.target;
  var detailPanel = document.getElementById('detail-panel');
  
  // 清空细节面板内容
  detailPanel.innerHTML = '';
  
  // 创建细节面板内容
  var title = document.createElement('h2');
  title.textContent = '节点详情';
  detailPanel.appendChild(title);
  
  var label = document.createElement('p');
  label.textContent = '标签: ' + node.data('label');
  detailPanel.appendChild(label);
  
  // 显示细节面板
  detailPanel.style.display = 'block';
});