个人中心
文章发布
退出
作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用？
- database - RESTful URI 是否应该公开数据库主键？
25
4
我正在尝试使用 dc.js 来实现 crossfilter 和 d3。我快成功了。当我在 JSFiddle 中运行我的代码时，它工作得很好!但是，当我尝试在本地系统上实现确切的代码时，它会给我 Uncaught TypeError: Cannot read property 'textContent' of null 错误。
我的代码是
trial1.js
var yearChart = dc.barChart('#year-chart');
//the data
var data = [
{date: "2015-10-01", type: "car", quantity: 3}];
var dispatch = crossfilter(data);
var parseDate = d3.time.format("%Y-%m-%d").parse;
data.forEach(function (d) {
d.date = parseDate(d.date);
d.quantity = +d.quantity;
d.Year = d.date.getFullYear();
});
var dateDim = dispatch.dimension(function (d) {
return d.date;
});
var productions = dateDim.group().reduceSum(function (d) {
return d.quantity;
});
var minDate = dateDim.bottom(1)[0].date;
var maxDate = dateDim.top(1)[0].date;
yearChart.width(2000).height(200)
.dimension(dateDim)
.group(productions)
.x(d3.time.scale().domain([minDate, maxDate]))
.brushOn(false)
.centerBar(true)
.yAxisLabel("Productions per day")
.xUnits(function(){return 10;});
yearChart.render();<html>
<head>
<meta charset="utf-8">
<script src="https:////cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js" charset="utf-8"></script>
<script type="text/javascript" src="https://dc-js.github.io/dc.js/js/d3.js"></script>
<script type="text/javascript" src="https://dc-js.github.io/dc.js/js/crossfilter.js"></script>
<script type="text/javascript" src="https://dc-js.github.io/dc.js/js/dc.js"></script>
<script type="text/javascript" src="https://dc-js.github.io/dc.js/js/colorbrewer.js"></script>
<script type="text/javascript" src = "trial1.js"></script>
</head>
<body>
<div id="year-chart"></div>
</body>
</html>d3.js 中出现错误的代码行是 this.node().textContent;
最佳答案
我遇到了同样的问题! 本地刚刚发现:
<div id="year-chart"></div>
放错地方了!
只需尝试在 JS 文件之前设置所有您的 html 内容。并且会正常工作!
看例子:
obs:它在 JSFiddle 上工作，因为 html(必须)在 js 脚本之前呈现!
希望对你也有用。
<!DOCTYPE html>
<html lang="en">
<head>
<title>dc.js - Bar Chart Example</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="http://dc-js.github.io/dc.js/css/dc.css"/>
<script src="https:////cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js" charset="utf-8"></script>
<script src="http://dc-js.github.io/dc.js/js/d3.js" charset="utf-8"></script>
<script src="http://dc-js.github.io/dc.js/js/crossfilter.js"></script>
<script src="http://dc-js.github.io/dc.js/js/dc.js"></script>
</head>
<body>
<div id="year-chart"></div>
<script type="text/javascript">
var yearChart = dc.barChart('#year-chart');
//the data
var data = [{
date: "2015-10-01",
customer: "BOASG",
quantity: 3
}];
var dispatch = crossfilter(data);
var parseDate = d3.time.format("%Y-%m-%d").parse;
data.forEach(function (d) {
d.date = parseDate(d.date);
d.quantity = +d.quantity;
d.Year = d.date.getFullYear();
});
var dateDim = dispatch.dimension(function (d) {
return d.date;
});
var productions = dateDim.group().reduceSum(function (d) {
return d.quantity;
});
var minDate = dateDim.bottom(1)[0].date;
window.alert(minDate);
var maxDate = dateDim.top(1)[0].date;
window.alert(maxDate);
yearChart.width(2000).height(200)
.dimension(dateDim)
.group(productions)
.x(d3.time.scale().domain([minDate, maxDate]))
.brushOn(false)
.centerBar(true)
.yAxisLabel("Productions per day")
.xUnits(function () {
return 10;
});
dc.renderAll();
</script>
<!-- <div id="year-chart"></div> if you set the code here you will be able to reproduce the issue.-->
</body>
</html>关于javascript - 未捕获的类型错误 : Cannot read property 'textContent' of null error，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32973616/
25
4
0
您好，下面是我在 AWS 中创建启用了弹性 IP 的实例的模板。但是我不确定我哪里出错了。我已经通过在线 json 验证器验证了 json，仍然面临问题请帮忙 { "AWSTemplateForm
标题有点乱，但已经说明了一切。我想在一个属性的属性上有一个属性观察器: class A { var b: B init() { b = B() } fu
假设我的一个 Controller 中有这样的方法: [Route("api/Products")] public IQueryable GetProducts() { return db.P
这有效: // @flow import React, {Component} from 'react'; type Props = {}; class Delete extends Componen
我有一个 ViewModelBase 类，我在其中为 INotifyPropertyChanged 接口(interface)定义了 RaisePropertyChanged 方法。大多数 MVVM
我创建了类: class StorageBase { public Queue Slices {get;set;} } 和 wpf 自定义控件，它具有 StorageBase 类型的依赖属性
我的 java 应用程序问题是 log4j2 系统日志不是写在 'local1.log' 中而是'消息'。我的/etc/rsyslog.conf 在/etc/rsyslog.conf 中配置为 'lo
为什么需要在对象中使用 this.property = property ？它是用来定义对象的“外部世界”的属性吗？ function Person(property) { this.property
摘要: 这个问题是关于属性的继承与从彼此继承属性的类的内部和外部的不同读/写访问相结合。 详细信息: 我有一个类 A 和另一个继承自 A 的类 B。 A 中声明了属性someProperty。我希望该
我正在开发 ASP.NET MVC 应用，设计域模型，使用(测试)新的 EF Code First 功能。 我有一个可能有也可能没有截止日期的事件实体，处理它的最佳方法是什么？ 1 个属性: publ
我在配置项目时经常使用它们，但大多数情况下都是按照指示添加 fragment 。我完全不知道哪个文件到底是做什么的。谁能清楚地说明每个文件的用途。 到目前为止我认为 local.properties
在运行 python 文件以使用 rasa nlu 训练文件时，我在命令提示符下收到此错误 我目前正在使用 Windows 10 rasa_core==0.8.2 rasa_nlu==0.11.4 p
我在这方面遇到了一些麻烦，尽管我已经搜索了答案，但还是找不到。 为了使用 AsyncAppender，我看到了很多不同的 log4j 配置，无论如何，它们都与 .properties 配置文件无关。
我正在编写一个 Python 类，并使用 @property 装饰器为该类创建属性。 我在文档中没有找到太多关于这个装饰器的信息，但是从我可以从 Stack Overflow 和我的 Python l
在 gradle 任务中，我可以创建这样的路径: System.env.FOLDER_PATH + '/subFolder' 但我想在我的 gradle.properties 中设置它，所以它会像 s
如何在属性文件的 log4j2 中创建键值对？ 我知道在 log4j 版本 1 中它是这样完成的: log4j.appender.x.additionalFields={'key': 'value'}
我想通了 struct PropertyTest { @property int x() { return val; } @property void x( int newVal )
我有 REST (Jersey) webservice，它利用了一些编码/解码到/来自 XML 的数据对象。数据对象位于 webservice war 所依赖的单独项目/jar 中。 我使用 MOXy
我正在创建一个 LinkedList 类: function LinkedList(){ ... 有什么区别: this.addNode = function(data){
关于语义的快速问题:) 如果我正在编写一个协议(protocol)，这是首选: // (a) @protocol MyProtocol @property (nonatomic, copy) NSSe
我是一名优秀的程序员,十分优秀！