Darksergio

Untitled

Sep 20th, 2014
204
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1.  
  2. /* funzione per donutchart animato */
  3. function drawDonutChart(element, percent, width, height,c1, c2,name)
  4. {
  5.              
  6.     var duration   = 2000;
  7.  
  8.     var  color = d3.scale.ordinal()
  9.            .range([c1,c2]);
  10.  
  11.     var dataset = {
  12.           lower: calcPercent(0),
  13.           upper: calcPercent(percent)
  14.         },
  15.         radius = Math.min(width, height) / 2,
  16.         pie = d3.layout.pie().sort(null),
  17.         format = d3.format(".0%");
  18.  
  19.     var arc = d3.svg.arc()
  20.           .innerRadius(radius - radius/4)
  21.           .outerRadius(radius);
  22.  
  23.     var svg = d3.select(element).append("svg")
  24.           .attr("id",name)
  25.           .attr("width", width+5)
  26.           .attr("height", height+5)
  27.           .append("g")
  28.           .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");
  29.  
  30.  
  31.     var path = svg.selectAll("path")
  32.           .data(pie(dataset.lower))
  33.           .enter().append("path")
  34.           .attr("fill", function(d,i) { return color(d+i); })
  35.           .attr("d", arc)
  36.           .each(function(d) { this._current = d; }); // store the initial values
  37.  
  38.     var text = svg.append("text")
  39.           .attr("text-anchor", "middle")
  40.           .attr("dy", ".35em")                  
  41.          .attr("fill", function(d) { return color(d); })
  42.           .attr("font-size", 40)
  43.           .attr("font-weight",900);
  44.  
  45.  
  46.       var progress = 0;
  47.       var timeout = setTimeout(function () {
  48.         clearTimeout(timeout);
  49.         path = path.data(pie(dataset.upper)); // update the data
  50.         path.transition().duration(duration).attrTween("d", function (a) {
  51.           // Store the displayed angles in _current.
  52.           // Then, interpolate from _current to the new angles.
  53.           // During the transition, _current is updated in-place by d3.interpolate.
  54.           var i  = d3.interpolate(this._current, a);
  55.           var i2 = d3.interpolate(progress, percent);
  56.           this._current = i(0);
  57.           return function(t) {
  58.             text.text( format(i2(t) / 100) );
  59.             return arc(i(t));
  60.           };
  61.         }); // redraw the arcs
  62.       }, 200);
  63.     }
  64.  
  65.  
  66. function calcPercent(percent) {
  67.   return [percent, 100-percent];
  68. }
  69.  
  70.  
  71. function drawStarPath(element,width,height,data)
  72.   {
  73.       var parseDate = d3.time.format("%d/%m/%Y");
  74.       var sd = Object.keys(data).length;  
  75.       var xmin = parseDate.parse(data[0].data);
  76.       var xmax = parseDate.parse(data[sd-1].data);
  77.    
  78.       var svg = dimple.newSvg(element,width,height);
  79.       svg.attr("id","starPath");
  80.       var myChart = new dimple.chart(svg, data);
  81.       myChart.x = 20;
  82.       myChart.width = (width/100)*95;
  83.      
  84.       var xAxis = myChart.addTimeAxis("x", "data","%d/%m/%Y","%b/%y");
  85.       xAxis.addOrderRule("Date");
  86.       xAxis.timePeriod = d3.time.months;
  87.       xAxis.timeInterval = 2;
  88.       xAxis.overrideMin  = d3.time.month.offset(xmin,-1);
  89.       xAxis.overrideMax  = d3.time.month.offset(xmax,+1);
  90.       xAxis.title = null;
  91.      
  92.       var yAxis = myChart.addMeasureAxis("y", "voto");
  93.       yAxis.overrideMin=18;
  94.       yAxis.title = null;
  95.            
  96.       var line = myChart.addSeries(null, dimple.plot.line);
  97.       line.lineWeight = 3;
  98.       line.lineMarkers = true;
  99.      
  100.      
  101.  
  102.       myChart.draw(3000);
  103.      
  104.       // creazione array id nodi
  105.       var keys = [];
  106.  
  107.       for (var i = 0; i < data.length; i++)
  108.          keys.push(line._positionData[i].key);  
  109.    
  110.  
  111.     // associazione id->dato
  112.     for (var i = 0; i < data.length; i++) {
  113.          data[i].key = keys[i];  
  114.     }
  115.      
  116.       line.getTooltipText = function(e)
  117.       {
  118.  
  119.         //acquisizione chiave associata
  120.         var key = e.key;
  121.  
  122.         // ricerca dato e assegnazione tooltip
  123.         for (var i = 0; i < data.length; i++)
  124.         {
  125.              if (data[i].key === key)
  126.  
  127.                  // Define the tooltip content.
  128.                  return [
  129.                      "nome: "+ data[i].nome,
  130.                      "voto: "+ e.yValue,
  131.                      "data: "+ data[i].data
  132.                  ];
  133.         }
  134.  
  135.       };
  136.  
  137.    
  138.   }
Advertisement
Add Comment
Please, Sign In to add comment