Question

我想使用CytoscapeWeb 2.0的discreteMapper（即基于jQuery的CytoscapeWeb），但需要一些示例代码来展示我到底要做什么。

我已尝试从基于Flash的CytoscapeWeb中获取一些代码并尝试

var entityColorMapper = {
    attrName: "etype",
    entries: [ { attrValue: "protein", value: "#ff0000" },
               { attrValue: "compound", value: "#00ff00" },
               { attrValue: "group", value: "#0000ff" } 
             ]
};

然后在“风格”结构中我有

    "node.E": {
        fillColor: {
            discreteMapper: entityColorMapper
        }
    }

但这似乎不起作用。

Answer 1

在Cytoscape Web 2中有所不同： https://github.com/cytoscape/cytoscapeweb/wiki/StyleObject

  // example discrete mapper
  fillColor: {
    defaultValue: "grey",
    discreteMapper: {
      attr: "type", // field in ele.data() to map to
      mapped: {
        "foo": "red", // field value : visual property value
        "bar": "blue"
      }
    }
  }

你真的不需要使用离散映射器，因为你可以使用你风格的选择器：

"node[type='foo']": { fillColor: "red", borderColor: "pink" },
"node[type='bar']": { fillColor: "blue" }

最好使用第二种方法，因为您可以同时为多个视觉属性（例如[type='blah']）分隔borderColor的样式，就像CSS一样。

请记住：在第一次正式发布之前，确保始终使用Cytoscape Web 2时的最新预发布版本。 https://github.com/cytoscape/cytoscapeweb/downloads

使用discreteMapper的示例

1 个答案: