首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >d3js /环氧of无法读取未定义的属性“长度”

d3js /环氧of无法读取未定义的属性“长度”
EN

Stack Overflow用户
提问于 2017-01-19 10:33:09
回答 1查看 349关注 0票数 1

我真的搞不懂这里出了什么问题。我试图用JSON-数据绘制一个划时代的线条图。

JSON格式化程序和Validator说它是有效的JSON。

Epoch/D3不呈现图表,而是在控制台中的d3.js中得到一个"Uncaught :无法读取未定义的属性‘长度’“。

我尝试了不同版本的d3,最新版本和v3.5.17版本,如本文所述:https://github.com/epochjs/epoch/issues/226

这是我的代码:

代码语言:javascript
复制
<html>

<head>
    <link rel="stylesheet" href="css/epoch.min.css" type="text/css">
    <script src="js/jquery-3.1.1.min.js"></script>
    <script src="js/d3.js"></script>
    <script src="js/epoch.js"></script>
</head>

<body>
    <div id="linechart" class="epoch category20" style="width: 700px; height: 250px"></div>
    <script type="text/javascript">
        $('#linechart').epoch({
            type: 'line',
            axes: ['left', 'right', 'bottom'],
            data: [{"label":"LabelA","value":[{"x":1,"y":7163960},{"x":2,"y":7163960},{"x":3,"y":7164484},{"x":4,"y":7164572},{"x":5,"y":7164908},{"x":6,"y":7167360},{"x":7,"y":7176940},{"x":8,"y":7176880},{"x":9,"y":7176880},{"x":1,"y":7209696},{"x":11,"y":7260416},{"x":12,"y":7287716},{"x":13,"y":7288548},{"x":14,"y":7289324},{"x":15,"y":7289324}]},{"label":"LabelB","value":[{"x":1,"y":2312004},{"x":2,"y":2311828},{"x":3,"y":2373860},{"x":4,"y":2768644},{"x":5,"y":2620956},{"x":6,"y":2705648},{"x":7,"y":2689684},{"x":8,"y":2360368},{"x":9,"y":2360376},{"x":1,"y":2603128},{"x":11,"y":2705996},{"x":12,"y":2830920},{"x":13,"y":2442880},{"x":14,"y":2407872},{"x":15,"y":2386400}]},{"label":"LabelC","value":[{"x":1,"y":2312004},{"x":2,"y":2311828},{"x":3,"y":2373860},{"x":4,"y":2768644},{"x":5,"y":2620956},{"x":6,"y":2705648},{"x":7,"y":2689684},{"x":8,"y":2360368},{"x":9,"y":2360376},{"x":1,"y":2603128},{"x":11,"y":2705996},{"x":12,"y":2830920},{"x":13,"y":2442880},{"x":14,"y":2407872},{"x":15,"y":2386400}]}]
        });

    </script>
</body>    

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-01-19 11:20:35

文档上快速阅读将向您展示,而不是value

代码语言:javascript
复制
data: [{"label":"LabelA","value":[...

一定是values

代码语言:javascript
复制
data: [{"label":"LabelA","values":[...

下面是带有修正代码的演示:

代码语言:javascript
复制
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/epoch/0.8.4/css/epoch.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/epoch/0.8.4/js/epoch.js"></script>
<div id="linechart" class="epoch category20" style="width: 700px; height: 250px"></div>
<script type="text/javascript">
        var linechart = $('#linechart').epoch({
            type: 'line',
            axes: ['left', 'right', 'bottom'],
            data: [{"label":"LabelA","values":[{"x":1,"y":7163960},{"x":2,"y":7163960},{"x":3,"y":7164484},{"x":4,"y":7164572},{"x":5,"y":7164908},{"x":6,"y":7167360},{"x":7,"y":7176940},{"x":8,"y":7176880},{"x":9,"y":7176880},{"x":1,"y":7209696},{"x":11,"y":7260416},{"x":12,"y":7287716},{"x":13,"y":7288548},{"x":14,"y":7289324},{"x":15,"y":7289324}]},{"label":"LabelB","values":[{"x":1,"y":2312004},{"x":2,"y":2311828},{"x":3,"y":2373860},{"x":4,"y":2768644},{"x":5,"y":2620956},{"x":6,"y":2705648},{"x":7,"y":2689684},{"x":8,"y":2360368},{"x":9,"y":2360376},{"x":1,"y":2603128},{"x":11,"y":2705996},{"x":12,"y":2830920},{"x":13,"y":2442880},{"x":14,"y":2407872},{"x":15,"y":2386400}]},{"label":"LabelC","values":[{"x":1,"y":2312004},{"x":2,"y":2311828},{"x":3,"y":2373860},{"x":4,"y":2768644},{"x":5,"y":2620956},{"x":6,"y":2705648},{"x":7,"y":2689684},{"x":8,"y":2360368},{"x":9,"y":2360376},{"x":1,"y":2603128},{"x":11,"y":2705996},{"x":12,"y":2830920},{"x":13,"y":2442880},{"x":14,"y":2407872},{"x":15,"y":2386400}]}]});
</script>

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41739563

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档