Question

HERE是一个很好的例子，说明了如何使用graphviz生成复杂的图形。点文件列在这里。

digraph G {
    compound=true;
    ranksep=1.25;
    label="From Past to Future...";

    node [shape=plaintext, fontsize=16];

    bgcolor=white;
    edge [arrowsize=1, color=black];

    /* Nodes */
    subgraph cluster_Computers {label="Computers"; labelloc="b"; Computers_icon};
    Computers_icon [label="", shape=box, style=invis, shapefile="Computers.png"];

    subgraph cluster_Semantic_Web {label="Semantic Web"; labelloc="b"; Semantic_Web_icon};
    Semantic_Web_icon [label="", shape=box, style=invis, shapefile="Semantic_Web.png"];

    subgraph cluster_Cryptography {label="Cryptography"; labelloc="b"; Cryptography_icon};
    Cryptography_icon [label="", shape=box, style=invis, shapefile="Cryptography.png"];

    subgraph cluster_Automata {label="Automata"; labelloc="b"; Automata_icon};
    Automata_icon [label="", shape=box, style=invis, shapefile="Automata.png"];

    subgraph cluster_AI {label="A.I."; labelloc="b"; AI_icon};
    AI_icon [label="", shape=box, style=invis, shapefile="AI.png"];

    subgraph cluster_Chaos {label="Chaos / Fractals"; labelloc="b"; Chaos_icon};
    Chaos_icon [label="", shape=box, style=invis, shapefile="Chaos.png"];

    subgraph cluster_XML {label="XML / RDF / URI"; labelloc="b"; XML_icon};
    XML_icon [label="", shape=box, style=invis, shapefile="XML.png"];

    subgraph cluster_Ontology {label="Ontology / Clustering"; labelloc="b"; Ontology_icon};
    Ontology_icon [label="", shape=box, style=invis, shapefile="Ontology.png"];

    subgraph cluster_Biology {label="Biology / Neurons"; labelloc="b"; Biology_icon};
    Biology_icon [label="", shape=box, style=invis, shapefile="Biology.png"];

    subgraph cluster_Agents {label="Agents / Security"; labelloc="b"; Agents_icon};
    Agents_icon [label="", shape=box, style=invis, shapefile="Agents.png"];

    subgraph cluster_Small_World {label="The Small World Project"; labelloc="b"; Small_World_icon};
    Small_World_icon [label="", shape=box, style=invis, shapefile="Small_World.png"];

    subgraph cluster_Social_Networks {label="Social Networks"; labelloc="b"; Social_Networks_icon};
    Social_Networks_icon [label="", shape=box, style=invis, shapefile="Social_Networks.png"];

    subgraph cluster_Search_Engines {label="Search Engines"; labelloc="b"; Search_Engines_icon};
    Search_Engines_icon [label="", shape=box, style=invis, shapefile="Search_Engines.png"];

    subgraph cluster_Turing {label="A. Turing"; labelloc="b"; Turing_icon};
    Turing_icon [label="", shape=box, style=invis, shapefile="Turing.png"];

    subgraph cluster_Rejewski {label="M. Rejewski"; labelloc="b"; Rejewski_icon};
    Rejewski_icon [label="", shape=box, style=invis, shapefile="Rejewski.png"];

    subgraph cluster_Dertouzos {label="M. Dertouzos"; labelloc="b"; Dertouzos_icon};
    Dertouzos_icon [label="", shape=box, style=invis, shapefile="Dertouzos.png"];

    subgraph cluster_Berners_Lee {label="T. Berners-Lee"; labelloc="b"; Berners_Lee_icon};
    Berners_Lee_icon [label="", shape=box, style=invis, shapefile="Berners_Lee.png"];

    /* Relationships */
    Computers_icon -> Semantic_Web_icon;
    Semantic_Web_icon -> Computers_icon;
    Cryptography_icon -> Semantic_Web_icon;
    Cryptography_icon -> Computers_icon;
    Automata_icon -> Computers_icon;
    AI_icon -> Automata_icon;
    Automata_icon -> AI_icon;
    Chaos_icon -> Computers_icon;
    Chaos_icon -> AI_icon;
    AI_icon -> Chaos_icon;
    Computers_icon -> Chaos_icon;
    XML_icon -> Semantic_Web_icon;
    XML_icon -> Computers_icon;
    Computers_icon -> XML_icon;
    Ontology_icon -> Semantic_Web_icon;
    Biology_icon -> AI_icon;
    Biology_icon -> Chaos_icon;
    Chaos_icon -> Biology_icon;
    Chaos_icon -> Semantic_Web_icon;
    Agents_icon -> Semantic_Web_icon;
    Semantic_Web_icon -> Agents_icon;
    Agents_icon -> AI_icon;
    AI_icon -> Agents_icon;
    Small_World_icon -> Chaos_icon;
    Small_World_icon -> Agents_icon;
    Small_World_icon -> Biology_icon;
    Biology_icon -> Small_World_icon;
    Social_Networks_icon -> Small_World_icon;
    Social_Networks_icon -> Biology_icon;
    Search_Engines_icon -> Semantic_Web_icon;
    Computers_icon -> Search_Engines_icon;
    Turing_icon -> Cryptography_icon;
    Turing_icon -> Computers_icon;
    Turing_icon -> Automata_icon;
    Rejewski_icon -> Turing_icon;
    Rejewski_icon -> Cryptography_icon;
    Dertouzos_icon -> Computers_icon;
    Dertouzos_icon -> Berners_Lee_icon;
    Berners_Lee_icon -> Semantic_Web_icon;


    { rank=same; Rejewski_icon; Turing_icon; Dertouzos_icon; Berners_Lee_icon };
    { rank=same; Biology_icon; AI_icon; Social_Networks_icon };

}

我带着警告

运行dot -Tpng -ofrom-past-to-future.png from-past-to-future.dot

C:\dot>dot -Tpng -ofrom-past-to-future.png from-past-to-future.dot
Warning: AI_icon was already in a rankset, deleted from cluster G
Warning: Biology_icon was already in a rankset, deleted from cluster G
Warning: Social_Networks_icon was already in a rankset, deleted from cluster G
Warning: Turing_icon was already in a rankset, deleted from cluster G
Warning: Rejewski_icon was already in a rankset, deleted from cluster G
Warning: Dertouzos_icon was already in a rankset, deleted from cluster G
Warning: Berners_Lee_icon was already in a rankset, deleted from cluster G

我尝试修改点文件，但无法获得与原始帖子相同的png图像。怎么接近它？

Answer 1

这是一个修改后的脚本，适用于当前版本的graphviz。请注意，您需要将所有图像放在与脚本相同的目录中。

我所做的改变：

清理冗余属性声明（label=""，labelloc等）。
使用image属性而不是旧shapefile
从节点中删除了shape=box和style=invis
添加penwidth=0以摆脱群集边界
将图表标签放在底部（应始终位于底部）
列出了排名限制。 same节点不能是不同子图的一部分。

当然，这不会重现完全相同的图形。重新创建排名约束需要更多的创造力，主要是因为每个节点都打包到自己的集群中，以便为其附加标签......非常hacky。您可以尝试不使用群集，但使用新的xlabel属性。

我添加了第二个版本，其中我取消注释rank=same子图并将它们放在集群的定义之前。然后Graphviz将创建一个输出，但没有任何标签用于那些节点。

这是脚本：

digraph G {
    compound=true;
    ranksep=1.25;

    node [shape=plaintext, fontsize=16, label=""];

    bgcolor=white;
    edge [arrowsize=1, color=black];
    graph[penwidth=0, labelloc="b"];

    /* Nodes */
    //{ rank=same; Rejewski_icon; Turing_icon; Dertouzos_icon; Berners_Lee_icon };
    //{ rank=same; Biology_icon; AI_icon; Social_Networks_icon };

    subgraph cluster_Computers {label="Computers"; Computers_icon[image="Computers.png"];};
    subgraph cluster_Semantic_Web {label="Semantic Web"; Semantic_Web_icon[image="Semantic_Web.png"];};
    subgraph cluster_Cryptography {label="Cryptography"; Cryptography_icon[image="Cryptography.png"];};
    subgraph cluster_Automata {label="Automata"; Automata_icon[image="Automata.png"];};
    subgraph cluster_AI {label="A.I."; AI_icon[image="AI.png"];};
    subgraph cluster_Chaos {label="Chaos / Fractals"; Chaos_icon[image="Chaos.png"];};
    subgraph cluster_XML {label="XML / RDF / URI"; XML_icon[image="XML.png"];};
    subgraph cluster_Ontology {label="Ontology / Clustering"; Ontology_icon[image="Ontology.png"];};
    subgraph cluster_Biology {label="Biology / Neurons"; Biology_icon[image="Biology.png"];};
    subgraph cluster_Agents {label="Agents / Security"; Agents_icon[image="Agents.png"];};
    subgraph cluster_Small_World {label="The Small World Project"; Small_World_icon[image="Small_World.png"];};
    subgraph cluster_Social_Networks {label="Social Networks"; Social_Networks_icon[image="Social_Networks.png"];};
    subgraph cluster_Search_Engines {label="Search Engines"; Search_Engines_icon[image="Search_Engines.png"];};
    subgraph cluster_Turing {label="A. Turing"; Turing_icon[image="Turing.png"];};
    subgraph cluster_Rejewski {label="M. Rejewski"; Rejewski_icon[image="Rejewski.png"];};
    subgraph cluster_Dertouzos {label="M. Dertouzos"; Dertouzos_icon[image="Dertouzos.png"];};
    subgraph cluster_Berners_Lee {label="T. Berners-Lee"; Berners_Lee_icon[image="Berners_Lee.png"];};


    /* Relationships */
    Agents_icon -> {AI_icon Semantic_Web_icon};
    AI_icon -> {Agents_icon Automata_icon Chaos_icon};
    Automata_icon -> {AI_icon Computers_icon};
    Berners_Lee_icon -> Semantic_Web_icon;
    Biology_icon -> {AI_icon Chaos_icon Small_World_icon};
    Chaos_icon -> {AI_icon Biology_icon Computers_icon Semantic_Web_icon};
    Computers_icon -> {Chaos_icon Search_Engines_icon Semantic_Web_icon XML_icon};
    Cryptography_icon -> {Computers_icon Semantic_Web_icon};
    Dertouzos_icon -> {Berners_Lee_icon Computers_icon};
    Ontology_icon -> Semantic_Web_icon;
    Rejewski_icon -> {Cryptography_icon Turing_icon};
    Search_Engines_icon -> Semantic_Web_icon;
    Semantic_Web_icon -> {Agents_icon Computers_icon};
    Small_World_icon -> {Agents_icon Biology_icon Chaos_icon};
    Social_Networks_icon -> {Biology_icon Small_World_icon};
    Turing_icon -> {Automata_icon Computers_icon Cryptography_icon};
    XML_icon -> {Computers_icon Semantic_Web_icon};

    fontsize=28;
    label="From Past to Future...";
}

这就是它的样子：

graphviz output

第二个变体，rank=same子图未注释：

graphviz output

如何生成具有自定义形状的节点？

1 个答案: