我有一个asp.net mvc4应用程序,我想在其中添加一个树视图。所以我使用了这个Jquery库:graphdracula
<html>
<head>
<script type="text/javascript" src="~/Content/Scripts/raphael-min.js"></script>
<script type="text/javascript" src="~/Content/Scripts/dracula_graffle.js"></script>
<script type="text/javascript" src="~/Content/Scripts/dracula_graph.js"></script>
<script type="text/javascript" src="~/Content/Scripts/dracula_algorithms.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var width = $(document).width() -500;
var height = $(document).height();
var g = new Graph();
g.edgeFactory.template.style.directed = true;
@for(int i =0;i < @Model[1].Count; i+=2){
@: g.addEdge("@Html.Raw(@Model[1][i])","@Html.Raw(@Model[1][i+1])");
}
var layouter = new Graph.Layout.Ordered(g, topological_sort(g));
var renderer = new Graph.Renderer.Raphael('canvas', g, width, height);
});
</script>
</head>
<body>
<div id="canvas"></div>
</body>
</html>
结果是:
我需要将边缘标题的字体大小修改为18px,我找不到修改标签值的片段。
我怎么能修改代码呢?我在哪里可以找到目标代码?
答案 0 :(得分:3)
您需要使用the documentation中描述的自定义节点渲染功能。
以下是我本地测试页面中的重要代码:
var g = new Graph();
var render = function(r, n) {
var color = Raphael.getColor();
var set = r.set().
push(r.ellipse(n.point[0], n.point[1], 30, 20).attr({fill: color, stroke: color, "stroke-width": 2})).
push(r.text(n.point[0], n.point[1] + 30, n.label || n.id).attr({"font-size": "18px"}));
return set;
};
/* add a simple node */
g.addNode("strawberry", { render : render });
g.addNode("cherry", { render : render });