2016-11-05 9 views
0

D3 Dendrogram ChartでElasticUIプロジェクトを拡張しようとしています。D3 Dendrogram ChartのJSオブジェクトを(角)JSでフォーマットする方法

Apolagia: 私はそれはもはや維持しているためElasticUIは減価償却されていない知っているが、それは私に長い道のりをもたらしていると私は、両方のJavaScriptとAngularJSの総初心者として夢見たことがない可能性がな方法で弾性データを試してみましょう私はまっすぐに飛び込んで、elasticsearch.jsだけを使って、そのための「サービス」をコードしようとしました。 2番目のこと:私はオブジェクトがあると言いますが、JSONデータ、配列、またはフォーマットされたStringであっても構いません。ブラウザのコンソールに、自分のデータに「オブジェクト」が含まれていると表示されます。

ここでは、私のhtmlのスリム化されたバージョンですが、デンドログラムだけです。

<body eui-enabled="true" ng-app="moviesearch" ng-controller="IndexController" eui-index="indexName"> 
<div id="dendrogram" class="d3-chart"> 
    <eui-singleselect field="tweetMsg" size="10"></eui-singleselect> 
    <div class="nav nav-list" eui-aggregation="ejs.TermsAggregation('entries').field('tweetMsg').size(20)" eui-filter="ejs.TermsFilter('tweetMsg', bucket.key)" eui-enabled="filter.enabled" eui-filter-self="true"> 

      <eui-var eui-key="dendroSelectorChartConfig" eui-value='     
      { 
       "name": "Top Level", 
       "children": (treeMap(aggResult.buckets))      
      } 
      '/> 

      <div class="container well"> 
       <div d3-hierarchy="dendroSelectorChartConfig" depth="3"></div> 
      </div> 
    </div> 
</div> 

そして、ここに私のコントローラ内の関数です。それはおそらく私のコントローラにあるべきではないでしょうか?私はそれを他の方法で働かせることができませんでした。私は私にconsole.logをコメントアウトした場合、しかし...

app.js:87 {"name":"https"},{"name":"t.co"},{"name":"movie"},{"name":"rt"}, {"name":"the"},{"name":"film"},{"name":"a"},{"name":"to"},{"name":"in"},{"name":"of"},{"name":"and"}, 

など:

$scope.treeMap = function mainTreeMapDiagramData(data) { 
var i; 
for(i = 0; i < data.length; i++) { 
    console.log("{\"name\":" + "\"" + data[i].key + "\"},"); 
    //  return "{\"name\":" + "\"" + data[i].key + "\"},"; 
    } 
}; 

あなたは笑うかもしれないが、これは実際には、ブラウザのコンソールに正しく結果の集約利用規約を記録します()と私の "リターン"のコメントを外してください... D3は何も表示されません。上記のようなリストを自分のHTMLに直接コピーすれば動作します。

私は子供の子供のように次のレベルについても考え始めていません - ただ一つのレベルを働かせてうれしいです。

ありがとうございます!

EDIT:それは場合に役立ちます、プロジェクトがオンラインにここにある: https://analytics.molch.at/dendrogram.html

答えて

0

これは働いていた。しかし

$scope.treeMap = function mainTreeMapDiagramData(data) { 

var i; 
arr = []; 
for (var key in data){ 
    if (typeof data[key] !== 'function') { 
      arr.push({ name: data[key].key }); 
    } 
} 

return arr; 

}; 

。単一レベルの樹状図は、樹状図のほとんどではありません。今、私は以前のtermsAggregationで各バケットのtermsAggregationを追加する方法を理解しなければなりません。

関連する問題