D3.js 不工作的非常简单的教程示例 [英] Very simple tutorial example of D3.js not working

查看:34
本文介绍了D3.js 不工作的非常简单的教程示例的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我对 D3.js 有点陌生.我正在阅读 Mike Dewar 的D3 入门.我尝试了书中的第一个示例,但它不起作用.我一直在为这件事伤心.我这里的代码有什么问题?

部分:

<script src="http://mbostock.github.com/d3/d3.js"></script><脚本>函数绘制(数据){严格使用";d3.select("body").append("ul").selectAll("li").data(数据).进入().append("li").text(功能(d){返回 d.name + ":" + d.status;});}

中:

和 JSON 文件:

<预><代码>[{状态":[良好的服务"],名称":[123"],网址":[空],文本": ["..."],"plannedworkheadline": [null],"时间": [" 7:35AM"],日期":[12/15/2011"]}]

解决方案

如果您使用的是 Chrome,它可能会因为跨域安全限制而阻止您正确打开文件.尝试使用 Firefox 看看是否是这种情况(它可能会让您正确加载文件).

如果这是问题所在,您需要安装 WAMP 等本地 Web 服务器(如果您运行的是 Windows)或按照此处 wiki 页面上的说明进行操作:https://github.com/mbostock/d3/wiki

祝你好运

I'm kind of new to D3.js. I'm reading Getting Started with D3 by Mike Dewar. I tried the very first example in the book, and it doesn't work. I've been tearing my hear out over this. What is wrong with my code here?

In the <head> section:

<script src="http://mbostock.github.com/d3/d3.js"></script>
<script>
   function draw(data) {
    "use strict";
   d3.select("body")
      .append("ul")
      .selectAll("li")
      .data(data)
      .enter()
      .append("li")
         .text(function (d) {
            return d.name + ": " + d.status;
         });
      }
</script>

In the <body>:

<script>

    d3.json("flare.json", draw);

</script>

And the JSON file:

[
{
    "status": ["GOOD SERVICE"],
    "name": ["123"],
    "url": [null],
    "text": ["..."],
    "plannedworkheadline": [null],
    "Time": [" 7:35AM"],
    "Date": ["12/15/2011"]
}
]

解决方案

If you're using Chrome, it may prevent you from opening the file properly because of cross domain security restrictions. Try Firefox to see if that's the case (it will probably let you load the file correctly).

If that is the problem, you will want to install a local web server like WAMP (if you're running Windows) or follow instructions on the wiki page here: https://github.com/mbostock/d3/wiki

Good luck

这篇关于D3.js 不工作的非常简单的教程示例的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆