ReferenceError:未定义dc

时间:2016-08-05 04:05:39

标签: dc.js crossfilter

我在尝试运行涉及交叉过滤器,d3和dc的教程时遇到问题。我面临的问题类似于this。当我将代码调整到建议的解决方案时。我仍然收到错误

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/dc/1.7.0/dc.js"></script>
<script type="text/javascript" src="https://rawgithub.com/NickQiZhu/dc.js/master/web/js/crossfilter.js"></script>
</head>

<body style="background-color: #CBD0E7">
</body>
<div id="graphdiv"></div>
<div id="legenddiv"></div>
<div id="chart-line-hitsperday"></div>
    <script type="text/javascript">
  var data = [
  {date: "2011-11-14T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab"},
  {date: "2011-11-14T16:20:19Z", quantity: 2, total: 190, tip: 100, type: "tab"},
  {date: "2011-11-14T16:28:54Z", quantity: 1, total: 300, tip: 200, type: "visa"},
  {date: "2011-11-14T16:30:43Z", quantity: 2, total: 90, tip: 0, type: "tab"},
  {date: "2011-11-14T16:48:46Z", quantity: 2, total: 90, tip: 0, type: "tab"},
  {date: "2011-11-14T16:53:41Z", quantity: 2, total: 90, tip: 0, type: "tab"},
  {date: "2011-11-14T16:54:06Z", quantity: 1, total: 100, tip: 0, type: "cash"},
  {date: "2011-11-14T16:58:03Z", quantity: 2, total: 90, tip: 0, type: "tab"},
  {date: "2011-11-14T17:07:21Z", quantity: 2, total: 90, tip: 0, type: "tab"},
  {date: "2011-11-14T17:22:59Z", quantity: 2, total: 90, tip: 0, type: "tab"},
  {date: "2011-11-14T17:25:45Z", quantity: 2, total: 200, tip: 0, type: "cash"},
  {date: "2011-11-14T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "visa"}
]; 

        var instance = crossfilter(data);

        var parseDate = d3.time.format("%m/%d/%Y").parse;

        data.forEach(function(d) {
            d.date = parseDate(d.date);
            d.total = d.http_404 + d.http_302 + d.http_200;
        });

        print_filter("data");

        var dateDim = instance.dimension(function(d) { return d.date; });
        var hits = dateDim.group().reduceSum(function(d) { return d.total; });
        var minDate = dateDim.bottom(1)[0].date;
        var maxDate = dateDim.top(1)[0].date;
        var hitslineChart = dc.lineChart("#chart-line-hitsperday");  // reference error number 1 is here.

        hitslineChart
            .width(500).height(200)
            .dimension(dateDim)
            .group(hits)
            .x(d3.time.scale().domain([minDate,maxDate])); 

        dc.renderAll();

        function print_filter(filter){
            var f=eval(filter);
            if (typeof(f.length) != "undefined") {}else{}
            if (typeof(f.top) != "undefined") {f=f.top(Infinity);}else{}
            if (typeof(f.dimension) != "undefined") {f=f.dimension(function(d) { return "";}).top(Infinity);}else{}
            console.log(filter+"("+f.length+") = "+JSON.stringify(f).replace("[","[\n\t").replace(/}\,/g,"},\n\t").replace("]","\n]"));
        } 

    </script>
    </html>

我收到以下错误:

"data(12) = [
  \
    {\"date\":null,\"quantity\":2,\"total\":null,\"tip\":0,\"type\":\"cash\"},
  {\"date\":null,\"quantity\":1,\"total\":null,\"tip\":100,\"type\":\"visa\"}
]"
"error"
"ReferenceError: dc is not defined
    at https://null.jsbin.com/runner:32:29"

0 个答案:

没有答案