为什么要使用Cytoscape无法正确对齐文本

Question

我正在使用cytoscape.js对数据库进行vizualize，但是我无法正确对齐父节点文本（按对象）。似乎“父”选择器不存在。所有其他选择器对我来说都正常工作。

这是我的js文件的重要部分：

var cy = window.cy = cytoscape({
  container: document.getElementById('cy'),
  style: [{
      selector: 'node',
      css: {
        'content': 'data(label)',
        'text-valign': 'center',
        'text-halign': 'center',
        'font-style': 'oblique',
        'font-size': 10,
        'shape': 'round-rectangle',
      }
    },
    {
      selector: 'parent',
      css: {
        'text-valign': 'top',
        'text-halign': 'center',
        'font-style': 'normal',
        'font-size': 15,
      }
    },
    {
      selector: 'edge',
      css: {
        'curve-style': 'unbundled-bezier',
        'control-point-distances': [-20, 10],
        'target-arrow-shape': 'triangle'
      }
    }
  ],

  elements: myElements,

  layout: {
    name: 'preset',
    padding: 5
  }
});

Answer 1

您使用的父选择器错误，可以在docs中阅读这些选择器：

var cy = window.cy = cytoscape({
  container: document.getElementById('cy'),
  style: [{
      selector: 'node',
      css: {
        'content': 'data(label)',
        'text-valign': 'center',
        'text-halign': 'center',
        'font-style': 'oblique',
        'font-size': 10,
        'shape': 'round-rectangle',
      }
    },
    {
      selector: ':parent',
      css: {
        'text-valign': 'top',
        'text-halign': 'center',
        'font-style': 'normal',
        'font-size': 15,
      }
    },
    {
      selector: 'edge',
      css: {
        'curve-style': 'unbundled-bezier',
        'control-point-distances': [-20, 10],
        'target-arrow-shape': 'triangle'
      }
    }
  ],

  elements: myElements,

  layout: {
    name: 'preset',
    padding: 5
  }
});