得到提升片段在D3 JSON数据(Get json data in d3 from lift sni

我使用D3和数据的JSON对象目前正在实施的图表。这样的图的工作示例可以在这里找到： http://bl.ocks.org/950642 。如果你知道D3你当然可以直接跳到我的问题的一部分。

代码快速概览

所以，基本上在我的模板我有必要的最低限度的代码：

<div id="main" class="lift:surround?with=default;at=content">
  <div class="lift:GraphVisual.showGraph"></div>
</div>

然后在我的片段（ GraphVisual.scala ）我有以下几点：

def showGraph = {
  <h3>Bachelor 5/6 - Communication Systems</h3> ++
  <div id="graph-container" width="500px" height="100px">
    <script type="text/javascript" src="static/scripts/graph_script.js></script>
  </div>

在JavaScript文件中定义的曲线图（ graph_script ）我主要有以下

var vis = d3.select("#graph-container").append("svg:svg")

d3.json("static/scripts/jsonData.json", function(json) {
  //Do stuff
}

我的问题

如果我存储在一个文件中的json数据，如上图所示，一切工作正常。现在，我想我的生成与提升JSON对象。所以，我想有一个函数返回在提升图形的JSON对象表示和在脚本中使用它（这应该是静态的）。

我试着

假设我有以下值定义我的图表：

val graph = JObject(JField("nodes", JArray(List(...))), JField("links", JArray(List)))

我试图定义该图形作为D3以上脚本的脚本变量：

<script>{JsCrVar("myGraph", graph).toJsCmd}</script>

用这种方法我有可变myGraph这是明确的，但我不知道如何访问它graph_script.js

Answer 1:

您可以将您的JSON数据检索到REST API。

object MyGraphApi extends RestHelper {
   serve {
     case Req("graph" :: Nil, _, GetRequest)  => {
       JsonResponse(myGraphObject)
     }
   }
}

然后，你可以阿贾克斯把它使用/图网址页面内。

Answer 2:

卢卡斯的使用REST API的解决方案，工作完全正常。在我的研究中，我还发现，我的问题只是一个JavaScript的问题：我并不需要使用d3.json(...)

所以，我不得不删除功能d3.json(...)并把所有的，里面的它之外。然后，只需调用mygraph.nodes例如，而不是json.nodes 。