小编Jer*_*nen的帖子

为D3 Chord图添加标签

我是一名新手程序员,所以对于大多数人来说这可能是一个简单的程序员.此Chord图的标签和/或鼠标悬停文本需要哪些代码行?

http://mbostock.github.com/d3/ex/chord.html

在此输入图像描述

我需要它来显示外部条带中的类别名称.鼠标悬停时,我想显示确切的数字和两个类别.这样的事情:'A:来自B'的5件事.

编辑:

我仍然无法弄清楚如何在我的代码中实现它.有人可以填写我的示例代码解释发生了什么?

    <!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Selecties EK 2010</title>
    <script type="text/javascript" src="d3.v2.js"></script>
    <link type="text/css" rel="stylesheet" href="ek2010.css"/>
  </head>
  <body>
    <div id="chart"></div>
    <script type="text/javascript" src="ek2010.js"></script>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

// From http://mkweb.bcgsc.ca/circos/guide/tables/
var chord = d3.layout.chord()
    .padding(.05)
    .sortSubgroups(d3.descending)
    .matrix([
      [0, 0, 7, 5],
      [0, 0, 8, 3],
      [7, 8, 0, 0],
      [5, 3, 0, 0]
    ]);

var width = 1000,
    height = 1000,
    innerRadius = Math.min(width, height) * .3,
    outerRadius = innerRadius * 1.1;

var fill …
Run Code Online (Sandbox Code Playgroud)

javascript label data-visualization d3.js chord-diagram

13
推荐指数
1
解决办法
1万
查看次数

D3/咖啡气泡图中的不同状态

我想使用这个(http://vallandingham.me/vis/gates/)气泡图(在D3中制作):

在此输入图像描述

...演练一些不同的场景。简而言之,我想可视化选举数据。政党获得了多少票,在什么情况下可能组建政府?

在数据层面,非常明显:名称、议会席位数、state1、state2、state3等。State1是1或2。1是政府中的一个地方,2是反对派。非常简单。

但该示例仅显示两种状态:“所有补助金”和“按年份补助金”。我想要的是更多像按年拨款这样的州。但我不是一个很好的程序员,无法弄清楚如何使这项工作有效。当我添加新状态时,可视化不起作用。

这是控制状态的代码(Coffee)。

class BubbleChart
  constructor: (data) ->
    @data = data
    @width = 940
    @height = 600

    @tooltip = CustomTooltip("gates_tooltip", 240)

    # locations the nodes will move towards
    # depending on which view is currently being
    # used
    @center = {x: @width / 2, y: @height / 2}
    @year_centers = {
      "2008": {x: @width / 3, y: @height / 2},
      "2009": {x: @width / 2, y: @height / 2},
      "2010": {x: 2 * @width / 3, …
Run Code Online (Sandbox Code Playgroud)

bubble-chart coffeescript d3.js force-layout

5
推荐指数
1
解决办法
1566
查看次数