雷达图表系列DE可拖动[关闭]

Question

我有一个关于海图雷达（或蜘蛛）D3 Draggable 的问题。

我想为这个可拖动的雷达图添加其他系列：http://tupel.cl/graficos/ejemplo1/demo.html

如何为这个例子添加点可拖动？： http://graves.cl/radar-chart-d3/（代码）

Answer 1

这是添加点可拖动的功能

var RadarChart = {
  draw: function(id, d, options) {
    var cfg = {
      radius: 6,
      w: 600,
      h: 600,
      factor: 1,
      factorLegend: .85,
      levels: 3,
      maxValue: 0,
      radians: 2 * Math.PI,
      opacityArea: 0.5,
      color: d3.scale.category10()
    };
    if ('undefined' !== typeof options) {
      for (var i in options) {
        if ('undefined' !== typeof options[i]) {
          cfg[i] = options[i];
        }
      }
    }
    cfg.maxValue = Math.max(cfg.maxValue, d3.max(d.map(function(o) {
      return o.value
    })));
    var allAxis = (d.map(function(i, j) {
      return i.axis
    }));
    var total = allAxis.length;
    var radius = cfg.factor * Math.min(cfg.w / 2, cfg.h / 2);


    d3.select(id).select("svg").remove();
    var g = d3.select(id).append("svg").attr("width", cfg.w).attr("height", cfg.h).append("g");

    var tooltip;

    drawFrame();
    var maxAxisValues = [];
    drawAxis();
    var dataValues = [];
    reCalculatePoints();

    var areagg = initPolygon();
    drawPoly();

    drawnode();


    function drawFrame() {
      for (var j = 0; j  Math.abs(maxY)) {
          newY = maxY;
        }
        newValue = (newY / oldY) * oldData.value;
      } else {
        var slope = oldY / oldX;
        newX = d3.event.dx + parseFloat(dragTarget.attr("cx")) - 300;

        if (Math.abs(newX) > Math.abs(maxX)) {
          newX = maxX;
        }
        newY = newX * slope;

        var ratio = newX / oldX;
        newValue = ratio * oldData.value;
      }

      dragTarget
        .attr("cx", function() {
          return newX + 300;
        })
        .attr("cy", function() {
          return 300 - newY;
        });

      d[oldData.order].value = newValue;
      reCalculatePoints();
      drawPoly();
    }
  }
};