は、私は「基本的なグラフ」例 私は自分のローカルコンピュータ上の例をコピーしたいと働いています<a href="http://graphalchemist.github.io/Alchemy/#/examples" rel="nofollow noreferrer">http://graphalchemist.github.io/Alchemy/#/examples</a> での例を見て、単純なHTMLページの例

をレンダリングすることはできません。は、私は「基本的なグラフ」例 私は自分のローカルコンピュータ上の例をコピーしたいと働いています<a href="http://graphalchemist.github.io/Alchemy/#/examples" rel="nofollow noreferrer">http://graphalchemist.github.io/Alchemy/#/examples</a> での例を見て、単純なHTMLページの例

私は2個のファイルとディレクトリを作っ：trial.htmlとcharlize.json、およびコードをコピーしました。私はtrial.htmlを開いたときに私が作った

のみ変更が

dataSource: 'charlize.json', (I also tried ./charlize.json)

に

dataSource: 'data/charlize.json',

を切り替えた、私は、ネットワークグラフを得ることはありません。空の白いHTMLページが表示されます。私は何をしなければならないのか分かりません。

Alchemy.jsにはライブラリをインストールする必要はなく、頭にCSSスタイルへのリンクがあり、それ以外に必要なものは何もわかりません。

UPDATE（作業コード）：

<html> 
<head> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/alchemyjs/0.4.2/alchemy.min.css" /> 
</head> 
<body> 
    <div class="alchemy" id="alchemy"></div> 

    <script src="http://cdn.graphalchemist.com/alchemy.min.js"></script> 

    <script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/alchemyjs/0.4.2/alchemy.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/alchemyjs/0.4.2/scripts/vendor.js"></script> 


    <script type="text/javascript"> 
     var config = { 
      dataSource: './charlize.json', 
      }; 

     alchemy = new Alchemy(config) 
    </script> 
    </body> 
</html>

出典

2017-05-01 sam

あなたがコードを共有することができますしてください – brk

あなたが偶然プロキシの背後にありますか？私は仕事場でコンピュータでこれを実行しようとすると、同じ結果（空白の画面）が表示されます。開発ツールに入り、ネットワークタブを見ると、AlchemyのCSSとJSファイルがブロックされていることがわかります。 – brittenb

私は現在プロキシをチェックしています。良いアイデア – sam

私は錬金術を使ったことがないが、私は一緒に彼らのデモコードを入れて、それが彼らのvendor.jsとd3のライブラリが必要のように見えます。サンプルコードのデモがあります。

<html> 
 

 
<head> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/alchemyjs/0.4.2/alchemy.min.css" /> 
 
</head> 
 

 

 
<body> 
 
    <div class="alchemy" id="alchemy"></div> 
 
    <script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/alchemyjs/0.4.2/alchemy.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/alchemyjs/0.4.2/scripts/vendor.js"></script> 
 
    <script type="text/javascript"> 
 
    var json = { 
 
     comment: "Charlize Theron's 'ego' network as GraphJSON", 
 
     nodes: [ 
 
     { 
 
      caption: "Screen Actors Guild Award for Outstanding Performance by a Female Actor in a Miniseries or Television Movie", 
 
      type: "award", 
 
      id: 595472 
 
     }, 
 
     { 
 
      caption: "Children of the Corn III: Urban Harvest", 
 
      type: "movie", 
 
      id: 626470 
 
     }, 
 
     { 
 
      caption: "Sleepwalking", 
 
      type: "movie", 
 
      id: 795744 
 
     }, 
 
     { 
 
      caption: "That Thing You Do!", 
 
      type: "movie", 
 
      id: 692946 
 
     }, 
 
     { 
 
      caption: "Trapped", 
 
      type: "movie", 
 
      id: 689794 
 
     }, 
 
     { 
 
      caption: "Head in the Clouds", 
 
      type: "movie", 
 
      id: 709577 
 
     }, 
 
     { 
 
      caption: "Waking Up in Reno", 
 
      type: "movie", 
 
      id: 635905 
 
     }, 
 
     { 
 
      caption: "Battle in Seattle", 
 
      type: "movie", 
 
      id: 734583 
 
     }, 
 
     { 
 
      caption: "Mighty Joe Young", 
 
      type: "movie", 
 
      id: 662595 
 
     }, 
 
     { 
 
      caption: "Academy Award for Actress in a Leading Role", 
 
      type: "award", 
 
      id: 593781 
 
     }, 
 
     { 
 
      caption: "The Devil's Advocate", 
 
      type: "movie", 
 
      id: 740763 
 
     }, 
 
     { 
 
      caption: "Screen Actors Guild Award for Outstanding Performance by a Cast in a Motion Picture", 
 
      type: "award", 
 
      id: 595440 
 
     }, 
 
     { 
 
      caption: "Silver Bear for Best Actress", 
 
      type: "award", 
 
      id: 601507 
 
     }, 
 
     { 
 
      caption: "The Curse of the Jade Scorpion", 
 
      type: "movie", 
 
      id: 649461 
 
     }, 
 
     { 
 
      caption: "MTV Movie Award for Best Female Performance", 
 
      type: "award", 
 
      id: 595074 
 
     }, 
 
     { 
 
      caption: "15 Minutes", 
 
      type: "movie", 
 
      id: 634248 
 
     }, 
 
     { 
 
      caption: "The Burning Plain", 
 
      type: "movie", 
 
      id: 670704 
 
     }, 
 
     { 
 
      caption: "The Life and Death of Peter Sellers", 
 
      type: "movie", 
 
      id: 794982 
 
     }, 
 
     { 
 
      caption: "Prometheus", 
 
      type: "movie", 
 
      id: 608746 
 
     }, 
 
     { 
 
      caption: "Teen Choice Award for Choice Summer Movie Star: Female", 
 
      type: "award", 
 
      id: 599909 
 
     }, 
 
     { 
 
      caption: "Chicago Film Critics Association Award for Best Actress", 
 
      type: "award", 
 
      id: 623686 
 
     }, 
 
     { 
 
      caption: "Golden Globe Award for Best Supporting Actress - Series, Miniseries or Television Film", 
 
      type: "award", 
 
      id: 598027 
 
     }, 
 
     { 
 
      caption: "Golden Globe Award for Best Actress - Musical or Comedy Film", 
 
      type: "award", 
 
      id: 595206 
 
     }, 
 
     { 
 
      caption: "Mad Max: Fury Road", 
 
      type: "movie", 
 
      id: 804341 
 
     }, 
 
     { 
 
      caption: "In the Valley of Elah", 
 
      type: "movie", 
 
      id: 621675 
 
     }, 
 
     { 
 
      caption: "Screen Actors Guild Award for Outstanding Performance by a Female Actor in a Leading Role", 
 
      type: "award", 
 
      id: 593954 
 
     }, 
 
     { 
 
      caption: "Golden Raspberry Award for Worst Actress", 
 
      type: "award", 
 
      id: 594134 
 
     }, 
 
     { 
 
      caption: "East of Havana", 
 
      type: "movie", 
 
      id: 609415 
 
     }, 
 
     { 
 
      caption: "The Road", 
 
      type: "movie", 
 
      id: 627715 
 
     }, 
 
     { 
 
      caption: "Golden Globe Award for Best Actress - Drama Film", 
 
      type: "award", 
 
      id: 593776 
 
     }, 
 
     { 
 
      caption: "Charles Jacobus Theron", 
 
      type: "person", 
 
      id: 314008 
 
     }, 
 
     { 
 
      caption: "Jackson Theron", 
 
      type: "person", 
 
      id: 314009 
 
     }, 
 
     { 
 
      caption: "Primetime Emmy Award for Outstanding Supporting Actress in a Miniseries or a Movie", 
 
      type: "award", 
 
      id: 595684 
 
     }, 
 
     { 
 
      caption: "The Cider House Rules", 
 
      type: "movie", 
 
      id: 8
 
     }, 
 
     { 
 
      caption: "The Astronaut's Wife", 
 
      type: "movie", 
 
      id: 657006 
 
     }, 
 
     { 
 
      caption: "Broadcast Film Critics Association Award for Best Actress", 
 
      type: "award", 
 
      id: 601849 
 
     }, 
 
     { 
 
      caption: "Hancock", 
 
      type: "movie", 
 
      id: 652245 
 
     }, 
 
     { 
 
      caption: "Charlize Theron", 
 
      root: true, 
 
      id: 314003 
 
     }, 
 
     { 
 
      caption: "Stuart Townsend", 
 
      type: "person", 
 
      id: 314004 
 
     }, 
 
     { 
 
      caption: "Stephan Jenkins", 
 
      type: "person", 
 
      id: 314005 
 
     }, 
 
     { 
 
      caption: "Benoni, Gauteng", 
 
      type: "person", 
 
      id: 314006 
 
     }, 
 
     { 
 
      caption: "Gerda Jacoba Aletta Maritz", 
 
      type: "person", 
 
      id: 314007 
 
     }, 
 
     { 
 
      caption: "Æon Flux", 
 
      type: "movie", 
 
      id: 663286 
 
     }, 
 
     { 
 
      caption: "Snow White and the Huntsman", 
 
      type: "movie", 
 
      id: 599907 
 
     }, 
 
     { 
 
      caption: "Young Adult", 
 
      type: "movie", 
 
      id: 661733 
 
     }, 
 
     { 
 
      caption: "Reindeer Games", 
 
      type: "movie", 
 
      id: 761000 
 
     }, 
 
     { 
 
      caption: "Monster", 
 
      type: "movie", 
 
      id: 729778 
 
     }, 
 
     { 
 
      caption: "The Legend of Bagger Vance", 
 
      type: "movie", 
 
      id: 804616 
 
     }, 
 
     { 
 
      caption: "Teen Choice Award for Choice Hissy Fit: Film", 
 
      type: "award", 
 
      id: 599908 
 
     }, 
 
     { 
 
      caption: "The Yards", 
 
      type: "movie", 
 
      id: 781638 
 
     }, 
 
     { 
 
      caption: "MTV Movie Award for Best Kiss", 
 
      type: "award", 
 
      id: 595095 
 
     }, 
 
     { 
 
      caption: "Celebrity", 
 
      type: "movie", 
 
      id: 611629 
 
     }, 
 
     { 
 
      caption: "Astro Boy", 
 
      type: "movie", 
 
      id: 818608 
 
     }, 
 
     { 
 
      caption: "North Country", 
 
      type: "movie", 
 
      id: 784437 
 
     }, 
 
     { 
 
      caption: "2 Days in the Valley", 
 
      type: "movie", 
 
      id: 615556 
 
     }, 
 
     { 
 
      caption: "Satellite Award for Best Actress – Motion Picture", 
 
      type: "award", 
 
      id: 595704 
 
     }, 
 
     { 
 
      caption: "Trial and Error", 
 
      type: "movie", 
 
      id: 799574 
 
     }, 
 
     { 
 
      caption: "National Society of Film Critics Award for Best Actress", 
 
      type: "award", 
 
      id: 595702 
 
     }, 
 
     { 
 
      caption: "Independent Spirit Award for Best Female Lead", 
 
      type: "award", 
 
      id: 595703 
 
     }, 
 
     { 
 
      caption: "Two Eyes Staring", 
 
      type: "movie", 
 
      id: 788889 
 
     }, 
 
     { 
 
      caption: "Sweet November", 
 
      type: "movie", 
 
      id: 811358 
 
     }, 
 
     { 
 
      caption: "Teen Choice Movie Award: Villain", 
 
      type: "award", 
 
      id: 595082 
 
     }, 
 
     { 
 
      caption: "Satellite Award for Best Supporting Actress – Drama", 
 
      type: "award", 
 
      id: 602151 
 
     }, 
 
     { 
 
      caption: "San Francisco Film Critics Circle Award for Best Actress", 
 
      type: "award", 
 
      id: 669827 
 
     }, 
 
     { 
 
      caption: "Independent Spirit Award for Best First Feature", 
 
      type: "award", 
 
      id: 599387 
 
     }, 
 
     { 
 
      caption: "The Italian Job", 
 
      type: "movie", 
 
      id: 817380 
 
     }, 
 
     { 
 
      caption: "Hollywood Confidential", 
 
      type: "movie", 
 
      id: 711550 
 
     }, 
 
     { 
 
      caption: "Men of Honor", 
 
      type: "movie", 
 
      id: 682763 
 
     }, 
 
     { 
 
      caption: "BAFTA Award for Best Actress in a Leading Role", 
 
      type: "award", 
 
      id: 594478 
 
     } 
 
     ], 
 
     edges: [ 
 
     { 
 
      source: 314003, 
 
      target: 621675, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 818608, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 601849, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 649461, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 669827, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 608746, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 593954, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595702, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 601849, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595095, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 729778, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595703, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 811358, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595472, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 661733, 
 
      caption: "PRODUCED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 784437, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 634248, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 662595, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 804616, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595703, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 626470, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 599387, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 599908, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 682763, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595702, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 788889, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 657006, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 795744, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 593781, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 594478, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 594134, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595074, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 692946, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 740763, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314005, 
 
      target: 314003, 
 
      caption: "PARTNER_OF" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 711550, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595440, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 8, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 599907, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 761000, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 781638, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 670704, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 609415, 
 
      caption: "PRODUCED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 314009, 
 
      caption: "PARENT_OF" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 652245, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 661733, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 602151, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 635905, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 799574, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 593781, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 817380, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 611629, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 729778, 
 
      caption: "PRODUCED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 709577, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 804341, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 627715, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 794982, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 623686, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595082, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 689794, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 788889, 
 
      caption: "PRODUCED" 
 
     }, 
 
     { 
 
      source: 314007, 
 
      target: 314003, 
 
      caption: "PARENT_OF" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 593776, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 734583, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 598027, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 601507, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 599909, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 314004, 
 
      caption: "PARTNER_OF" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 663286, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 314006, 
 
      caption: "BORN_AT" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 615556, 
 
      caption: "ACTED_IN" 
 
     }, 
 
     { 
 
      source: 314004, 
 
      target: 314003, 
 
      caption: "PARTNER_OF" 
 
     }, 
 
     { 
 
      source: 314008, 
 
      target: 314003, 
 
      caption: "PARENT_OF" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 314005, 
 
      caption: "PARTNER_OF" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 795744, 
 
      caption: "PRODUCED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595704, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 670704, 
 
      caption: "EXEC_PRODUCED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 593954, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595206, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 593776, 
 
      caption: "RECEIVED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595704, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 595684, 
 
      caption: "NOMINATED" 
 
     }, 
 
     { 
 
      source: 314003, 
 
      target: 599387, 
 
      caption: "NOMINATED" 
 
     } 
 
     ] 
 
    }; 
 
    var config = { 
 
     dataSource: json 
 
    }; 
 
    
 
    alchemy = new Alchemy(config); 
 
    </script> 
 
</body> 
 

 
</html>

出典

2017-05-01 16:11:47

これは正しいです。オリジナルのHREFリンクとSRCリンクは、たとえ提供されていたとしても何らかの形で間違っていたようです。問題コードで作業コードが更新される – sam

答えて

関連する問題