Question

我正在使用c3 + d3 + javascript在网页中创建折线图。我设法创建一个在本地工作正常的代码，但当我将其上传到我的服务器时，代码停止工作。我解释下面的问题：

问题：c3.generate在上传到服务器时不会抛出错误

JSFiddle ：http://jsfiddle.net/xq6wmyvp/10/

var chart;
function initialize(path) {
    try {
        c3.generate({
            bindto: '#chart',
            data: {
                x: 'label',
                url: path,
                type: 'line',
            },
            axis: {
                x: {
                    type: 'categories',
                    label: {
                        text: 'days',
                    },
                },
                y: {
                    label: {
                        text: 'yield',
                    },
                    tick: {
                        format: d3.format(".2%")
                    }
                }
            },
        });
    } catch (err) {
        return false;
    }
    return true;
}
var path1 = 'https://gist.githubusercontent.com/SamMorrowDrums/f571240047c0344a4af8/raw/433eae455570b64edcdc7ece39416b468b612f49/test.csv';
alert(initialize('blabla'));

代码说明：代码（在小提琴中）有一个函数，使用某些数据用线图初始化图表。数据的路径作为该函数的变量给出（称为'initialize（path）'）。此函数使用c3.generate来创建图形。如果数据不可用或不存在，c3.generate会抛出错误（这在本地有效，但在上传到服务器时没有 - 这就是问题），函数（initialize）返回false。如果数据存在，则加载图形并且'initialize'返回true。

将代码上传到服务器后，

问题重述：，即使数据不可用/不存在，函数'initialize（path）'也只返回'true'。

我不知道如何解决这个问题。你能帮助我吗？谢谢你的阅读！

（Github链接到问题：https://github.com/masayuki0812/c3/issues/960）

Answer 1

正如我在评论中所述，在引擎盖下，c3正在使用d3.xhr来检索数据。这是一个异步调用，意味着它在你的try块之外。

可能的解决方法包括：

1。）将其修复在c3 source code第1903行，您会看到错误被删除。

2。）创建一个global error handler

3.）不要使用c3的url选项。发出您自己的d3 xhr请求（以正确的方式处理错误），如果成功，则使用columns选项调用c3.generate。这就是我的方式。

d3.csv("path/to/file.csv", function(error, json) {
  if (error){
      // handle error properly
      return;
  }
  c3.generate({
    ...
  });
});

c3.generate不抛错误

1 个答案: