Question

我对现代javascript库（例如protovis和d3js）可能存在的所有很酷的东西印象深刻。作为一名生态学家，我拥有大量适合这些高级可视化技术的数据。可悲的是，我在下载d3js库后已经迷路了。 :(

我在http://d3js.org上读到，必须设置localhost才能运行示例。我在Windows 7系统上安装了xampp系统。 Localhost / xampp告诉我一切都很好但仍然无法让大多数示例运行。例如，“albers”仅显示灰色框。示例“bar”确实运行（我想）。

有人能给我一个如何在Windows 7上正确启动的提示吗？非常感谢教程的链接。如果我找到正确的方法，我将为世界制作自己的教程。

我知道我的问题听起来很无聊和不愉快，因为它是绝对的初学者问题，我很抱歉，但我真的想和d3js合作，因为我有很多好的（？）想法。

谢谢你！

Answer 1

d3.js是一个客户端 JavaScript库，因此您不需要在后台安装任何服务器。开始使用静态文件。这是一个简短的例子：

的index.html：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>My first d3.js</title>
    <link href="style.css" rel="stylesheet">
  </head>

  <body>
    <div id="mySVG"></div>
    <script src="http://d3js.org/d3.v2.js"></script>
    <script>
      var svg = d3.select("#mySVG")
        .append("svg")
        .attr("width", 200)
        .attr("height", 200)

      svg.append("text")
        .attr("x", 50)
        .attr("y", 50)
        .attr("class", "text")
        .text("d3.js is awesome")
    </script>
  </body>

和样式的style.css：

.text {
  fill: blue;
}

在浏览器中打开index.html，您会看到一个蓝色文字说“d3.js很棒”。更有用的教程是：

当然

https://github.com/mbostock/d3/wiki/Tutorials

Answer 2

当您尝试在本地运行静态文件时，d3示例库中的某些示例可能会在某些浏览器中产生错误。 Mike建议你在浏览样本时运行python的simplehttpserver。

请参阅此处的说明： https://github.com/mbostock/d3/wiki

python -m SimpleHTTPServer 8888

如何使用xampp开始使用d3js示例？

2 个答案: