Question

我想将d3饼图的选定切片值传递给mvc中的控制器。我创建了一个onlick事件，所以当我单击切片时，它必须传递已经存储在var中的值如何做？

`

    var width = 960,
        height = 500,
        radius = Math.min(width, height) / 2;

    var color = d3.scale.ordinal()
        .range(["#98abc5", "#8a89a6", "#7b6888", "#6b486b", "#a05d56", "#d0743c", "#ff8c00"]);

    var arc = d3.svg.arc()
        .outerRadius(radius - 10)
        .innerRadius(0);

    var pie = d3.layout.pie()
        .sort(null)
        .value(function (d) { return d.population; });

    var svg = d3.select("body").append("svg")
        .attr("width", width)
        .attr("height", height)
      .append("g")
        .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

    d3.csv("/temp/data.csv", function (error, data) {

        data.forEach(function (d) {
            d.population = +d.population;
        });

        var g = svg.selectAll(".arc")
            .data(pie(data))
          .enter().append("g")
            .attr("class", "arc");

        g.append("path")
            .attr("d", arc)
            .style("fill", function (d) { return color(d.data.age); })
             .on('click', function (d) {
                 var id = d.data.age;
                 alert(id);
             });

        g.append("text")
            .attr("transform", function (d) { return "translate(" + arc.centroid(d) + ")"; })
            .attr("dy", ".35em")
            .style("text-anchor", "middle")
            .text(function (d) { return d.data.age; })

    });
    </script>`

值存储在var id中，我想将该值传递给我的控制器

Answer 1

使用Javascript：

var url = 'http://localhost/yourhost/yourcontroller/someaction?age=' + id;
$.getJSON(url).done(function(res){
    // do something
});

MVC：

public JsonResult SomeAction(int age){
    // do stuff
}

Answer 2

我尝试过这样做，但是值会直接传递到网页，而不是进入我在控制器中指定的操作方法。

将值从d3饼图传递到mvc中的控制器

2 个答案: