Question

在Meteor中开始了一个项目，并根据大气中的说明添加了d3包。

然后想尝试在hello.html页面的<body>中添加此示例的代码（旋转地球仪）

<script src="//d3js.org/d3.v3.min.js"></script>
<script src="//d3js.org/topojson.v1.min.js"></script>
<script>

var width = 960,
    height = 600;

var radius = height / 2 - 5,
    scale = radius,
    velocity = .02;

var projection = d3.geo.orthographic()
    .translate([width / 2, height / 2])
    .scale(scale)
    .clipAngle(90);

var canvas = d3.select("body").append("canvas")
    .attr("width", width)
    .attr("height", height);

var context = canvas.node().getContext("2d");

var path = d3.geo.path()
    .projection(projection)
    .context(context);

d3.json("world.json", function(error, world) {
  if (error) throw error;

  var land = topojson.feature(world, world.objects.land);

  d3.timer(function(elapsed) {
    context.clearRect(0, 0, width, height);

    projection.rotate([velocity * elapsed, 0]);
    context.beginPath();
    path(land);
    context.fill();

    context.beginPath();
    context.arc(width / 2, height / 2, radius, 0, 2 * Math.PI, true);
    context.lineWidth = 2.5;
    context.stroke();
  });
});

d3.select(self.frameElement).style("height", height + "px");

</script>

我复制了.JSON文件的数据并将其复制到公共目录中。数据已经过检查并且有效。

启动应用程序时，出现此错误： SyntaxError：JSON解析错误：无法识别的令牌'＆lt;'在线localhost：26。

这意味着必须加载关于第15个脚本Meteor的应用程序块。

有人有想法吗？

PS还在脚本标签中指定了utf-8字符集......没有帮助

编辑：

这是完整的hello.html页面

<head>
    <title>hello world</title>
</head>

<body>
  <script>

      var width = 960,
              height = 600;

      var radius = height / 2 - 5,
              scale = radius,
              velocity = .02;

      var projection = d3.geo.orthographic()
              .translate([width / 2, height / 2])
              .scale(scale)
              .clipAngle(90);

      var canvas = d3.select("body").append("canvas")
              .attr("width", width)
              .attr("height", height);

      var context = canvas.node().getContext("2d");

      var path = d3.geo.path()
              .projection(projection)
              .context(context);

      d3.json("world.json", function(error, world) {
          if (error) throw error;

          var land = topojson.feature(world, world.objects.land);

          d3.timer(function(elapsed) {
              context.clearRect(0, 0, width, height);

              projection.rotate([velocity * elapsed, 0]);
              context.beginPath();
              path(land);
              context.fill();

              context.beginPath();
              context.arc(width / 2, height / 2, radius, 0, 2 * Math.PI, true);
              context.lineWidth = 2.5;
              context.stroke();
          });
      });

      d3.select(self.frameElement).style("height", height + "px");
  </script>

    {{>hello}}
</body>

<template name="hello">
        <button>Left</button>
        <button>Right</button>
</template>

Answer 1

问题是您正在尝试从本地目录加载外部文件。

在Meteor中，文件从/ public目录提供：

在Meteor项目中创建 / public 目录

将var thumbnails = document.getElementsByClassName("small"); var previewImage = document.getElementById("large"); var caption = document.getElementById("captionText"); for(var key in thumbnails) { console.log(key + " -> " + thumbnails[key].src); console.log(typeof thumbnails[key].addEventListener); thumbnails[key].addEventListener("click", function(){ previewImage.src = thumbnails[key].src; caption.innerHTML = thumbnails[key].alt; }); }文件放入其中

并将d3 repo脚本放在world.json部分

中

编辑：

完整档案：

<head>

来自world.json https://raw.githubusercontent.com/mbostock/topojson/master/examples/world-50m.json

Answer 2

根据我的经验，此错误的最常见原因是Web服务器正在返回HTML页面（通常是错误页面）而不是预期的Javascript文件。当浏览器尝试将HTML解析为JS时，它会在第一个pd.DataFrame({c: pd.DataFrame(df[c]).max(axis=1) for c in df.columns.unique()}) dx_0 dx_25002 dx_25041 dx_25061 dx_25081 dx_3569 dx_40391 dx_42822 \ 0 0 1 1 0 1 0 0 0 1 1 1 1 0 1 0 0 0 2 0 1 1 0 1 1 0 0 3 0 1 0 1 1 0 0 1 4 0 1 1 0 1 0 0 1 5 1 0 0 0 0 0 1 0 dx_5856 0 1 1 0 2 1 3 1 4 0 5 1符号上失败。

检查开发人员工具的“网络”选项卡，查看哪些脚本实际上返回的是HTML响应。然后找出该请求导致错误的原因（错误的URL，拼写错误，忘记将该文件检入源代码控制等等）。

无法识别的令牌＆lt;

2 个答案: