0

アメリカから地図を作成しようとしています。マップが州の境界とともに表示されたら、クリックして郡の境界を表示したい これがマップの表示方法です。

var width = 960,
    height = 500,
    centered;

var path = d3.geo.path();

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

svg.append("rect")
    .attr("class", "background")
    .attr("width", width)
    .attr("height", height)
    .on("click", loadcounties);

var g = svg.append("g")
    .attr("id", "states");

d3.json("readme.json", function(json) {
  g.selectAll("path")
      .data(json.features)
     .enter().append("path")
      .attr("d", path)
      .on("click", loadcounties);
});

そして、これが私が地域をロードするために使用する関数です（ここではアラバマのみ）：

function loadcounties (d) {
    var id = d3.select(this).attr("name");
    var bbox = this.getBBox();

    if (id == "Alabama") {
   d3.json("alabamacounties.json", function(json) {
          g.selectAll("path")
              .data(json.features)
              .enter()
              .append("path")
              .attr("d", path);
                  });
}

}

アラバマを単独で表示しようとすると機能しますが、機能としては機能しません。私が間違っていることのアイデアはありますか?ありがとう

4

1 に答える 1

1

これが私がそれを解決した方法です：

function loadstate(d) {

var g = svg.append("g")
        .attr("id", "counties");

        switch (d.id){

        case "01" : 
          jsoncounty="countiesjson/01.json";
        break;

すべての状態について次のようにします。

d3.json(jsoncounty, function(json) {
        g.selectAll("path")
            .data(json.features, function(d,i) { return d+i; })
            .enter()
            .append("path")
            .attr("d", path)
            .on("click",text)
            .append("title")
            .text(function(d) { return d.properties.NAME; });
    });
于 2013-06-06T14:49:34.337 に答える