Ошибка синтаксического анализа D3.js — поворот ортогональной проекции карты

У меня есть ортогональная проекция карты мира в D3 и с использованием TopoJSON. Я раскрашиваю страны при каждой загрузке данных, вызывая этот код. Земной шар постоянно вращается.

Моя проблема в том, что во время вращения я получаю сообщение об ошибке:

Ошибка

>> Ошибка: проблема с разбором d="" >> в d3.v3.min.js:1

для каждого:

    .attr("d", path);

Сначала я думал, что это зависит от скрипта topojson, потому что есть разные версии. Но это не так.

javascript-код:

инициализируем свойства глобуса/проекции:

svg.append("defs").append("path")
.datum({type: "Sphere"})
.attr("id", "sphere")
    .attr("d", path);

...

svg.append("path")
    .datum(graticule)
    .attr("class", "graticule")
    .attr("d", path);

прочитать данные из json и tsv и добавить земли и страны:

queue()
    .defer(d3.json, "world-110m.json")
    .defer(d3.tsv, "world-country-names.tsv")
    .await(ready);

function ready(error, world, names) {

        var countries = topojson.feature(world, world.objects.countries).features,;
            i = -1,
            n = countries.length;

          countries.forEach(function(d) { 
            var tryit = names.filter(function(n) { return d.id == n.id; })[0];
            if (typeof tryit === "undefined"){
              d.name = "Undefined";
              console.log(d);
            } else {
              d.name = tryit.name; 
            }
          });

        var country = svg.selectAll(".country").data(countries);
        country
        .enter().insert("path", ".graticule")
          .attr("id", function(d){ 
                return "c" + d.id;  
          })
          .attr("d", path);

        svg.insert("path", ".graticule")
          .datum(topojson.mesh(world, world.objects.countries, function(a, b) { return a !== b; }))
          .attr("class", "boundary")
          .attr("d", path);

    }

вращение земного шара:

var velocity = .03,
    then = Date.now();

d3.timer(function() {  
    var angle = velocity * (Date.now() - then);  
    projection.rotate([angle,0,0]);  
    svg.selectAll("path")  
      .attr("d", path.projection(projection));  

}); 

person user123456789    schedule 01.07.2013    source источник
comment
Очень сложно получить хорошие ответы на SO с гигантским блоком кода. Можете ли вы сузить это до той части, которая выдает ошибку? Какой путь вызывает затруднения?   -  person nrabinowitz    schedule 01.07.2013
comment
Ой, извини. Теперь я удалил несколько строк, где уверен, что ошибки нет, и разделил код на секции. Может быть, теперь это немного более читабельно :/   -  person user123456789    schedule 01.07.2013
comment
Итак, все вызовы .attr("d", path) не работают? Это говорит о том, что вы не связываете ожидаемые данные - попробуйте обернуть path в функцию, чтобы вы могли проверить ввод...   -  person nrabinowitz    schedule 01.07.2013


Ответы (1)


Это известная ошибка WebKit. У меня та же проблема, похоже, это никак не влияет на рендеринг svg.

Всему, что находится за пределами clipAngle, присваивается d="", что, как я считаю, должно быть допустимым нулевым значением, но помечается как ошибка.

person nverba    schedule 04.07.2013
comment
Вы можете проверить это, временно удалив clipAngle из вашей проекции. - person nverba; 04.07.2013