block by sugi2000 3040987afccbc9e59c0a152433112597

第23回参議院議員通常選挙 比例代表

Full Screen

#第23回参議院議員通常選挙(2013) 比例代表結果

非拘束名簿式比例代表制（改選定数48）の結果です。

データソース -総務省 第23回参議院議員通常選挙結果調

index.html

<!DOCTYPE html>
<meta charset="utf-8">
<style>

body {
  font: 11px sans-serif;
  font-weight: bold;
}

.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

.y.axis text {
  font-weight: normal;
}

.x.axis path, .x.axis line {
  display: none;
}

form {
  position: absolute;
  right: 10px;
  top: 10px;
}

</style>
<body>
  <form>
    <label><input type="radio" name="mode" value="parties">党派別得票数</label>
    <label><input type="radio" name="mode" value="candidates" checked>名簿登載者別得票数</label>
    <label><input type="radio" name="mode" value="winners">当選人数</label>
  </form>

  <script src="https://d3js.org/d3.v4.min.js"></script>
  <script src="https://d3js.org/d3-selection-multi.v0.4.min.js"></script>
  <script src="//labratrevenge.com/d3-tip/javascripts/d3.tip.v0.6.3.js"></script>

  <script>
    var margin = {top: 20, right: 20, bottom: 30, left: 80};
    var width = 860;
    var height = 550;
    var svg = d3.select('body')
        .append('svg')
        .attrs({
          "width": width + margin.left + margin.right,
          "height": height + margin.top + margin.bottom,
        })
      .append('g')
        .attr('transform', 'translate('+margin.left+','+margin.top+')');

    var x = d3.scaleBand()
            .rangeRound([0, width])
            .padding(.1);
    var y = d3.scaleLinear()
            .rangeRound([height, 0]);
    var color = d3.scaleOrdinal(d3.schemeCategory20.reverse());
    var partyColor = d3.scaleOrdinal(d3.schemeCategory10);
    var quotient = function(d) { return d.total / d.denominator; };
    var xAxis = d3.axisBottom(x);
    var yAxis = d3.axisLeft(y);

    var partyKey = '政党';
    var candidateKey = '名簿登録者';
    var votesKey = '得票数';

    var partyVotes;
    var winners;
    var pickTimer;

    d3.csv('result.csv', function(error, data){
      if (error) { throw error; }

      data.forEach(function(d){
        d.party = d[partyKey];
        d.candidate = d[candidateKey];
        d.votes = +d[votesKey];
      });

      var partyData = d3.nest()
        .key(function(d){ return d.party; })
        .key(function(d){ return d.candidate; })
        // .sortKeys(function (a, b) { return d3.descending(a['得票数'], b['得票数']); })
        // .rollup(function(d) { return +d[votesKey]; })
        .entries(data);
        // .map(data);

      // var domain = d3.keys(data[0]).filter(function(d){return d !== partyKey});

      partyData.forEach(function(d){
        var y0 = 0;

        d.values.sort(function(a,b){ return b.values[0].votes - a.values[0].votes; });

        var candidates = d.values.map(function(v){
          return {
            party: d.key,
            name: v.key,
            votes: v.values[0].votes,
            y0: y0,
            y1: y0 += v.values[0].votes,
          };
        });
        // candidates.sort(function(a,b){ return b.votes - a.votes; });
        console.log(candidates);
        d.candidates = candidates;
        d.winners = [];
        d.total = d3.sum(candidates, function(c){return c.votes;});
        d.denominator = 1;
      });

      partyData.sort(function(a,b){ return b.total - a.total; });
      partyData.forEach(function(d){
        if (d.key.length > 6) {
          d.key = d.key.substr(0, 3);
        }
      });
      x.domain(partyData.map(function(d) { return d.key; }));
      y.domain([0, d3.max(partyData.map(function(d){return d.total;}))]);

      console.log(data);
      console.log(partyData);
      // console.log(d3.entries(partyData));

      svg.append("g")
        .attr("class", "x axis")
        .attr("transform", "translate(0," + height + ")")
        .call(xAxis);

      svg.append("g")
          .attr("class", "y axis")
          .call(yAxis)
        .append("text")
          .attr("x", "-2em")
          .attr("y", y(y.ticks(10).pop()))
          .attr("dy", "-2em")
          .attr("text-anchor", "end")
          .attr("fill", "#000")
          .text(votesKey);

      var g = svg.selectAll('.party')
        .data(partyData)
        .enter()
        .append('g')
        .attrs({
          class: function(d){ return 'party ' + d.key; },
          transform: function(d,i) { return 'translate('+ x(d.key) +', 0)' },
        });

      g.selectAll('.votes')
        .data(function(d){ return d.candidates; })
        .enter()
        .append('rect')
        .attrs({
          class: 'votes',
          x: 0,
          y: function(d){ return y(d.y1); },
          width: x.bandwidth(),
          height: function(d){ return y(d.y0) - y(d.y1); },
          fill: function(d){ return color(d.name); },
          opacity: 1,
        });

      partyVotes = g.selectAll('.party-votes')
        .data(function(d){ return [{
          name: d.key,
          total: d.total,
          denominator: d.denominator,
        }]; })
        .enter()
        .append('rect')
        .attrs({
          class: 'party-votes',
          x: 0,
          y: function(d){ return y(quotient(d)); },
          width: 0,
          height: function(d){ return y(0) - y(quotient(d)); },
          fill: function(d){ return partyColor(d.name); },
        });
    });

    function getFirstPartyVotes() {
      var maxVotes = 0;
      var firstParty;
      partyVotes.nodes().forEach(function(d){
        var party = d3.select(d);
        if (quotient(party.data()[0]) > maxVotes) {
          firstParty = party;
          maxVotes = quotient(party.data()[0]);
        }
      });
      // console.log(firstParty, maxVotes);

      return firstParty;
    }

    function pickWinner() {
      var numWinner = d3.selectAll('.winners').nodes().length;
      if (numWinner >= 48) {
        return;
      }
      // var q = d3.queue();

      var firstPartyVotes = getFirstPartyVotes();
      var party = d3.select(firstPartyVotes.node().parentNode);
      var data = party.data()[0];

      data.winners.push({
        name: data.key,
        votes: quotient(data),
        order: numWinner+1,
      });

      var padding = 4;
      var size = x.bandwidth() / 2 - padding * 2;

      var winners = party.selectAll('.winners')
        .data(function(d) {return d.winners; })
        .enter()
        .append('circle')
        .attrs({
          class: 'winners',
          cx: function(d, i) { return padding + ((i % 2) + .5) * (size + padding); },
          cy: function(d, i) { return padding + (Math.floor(i / 2) + .5) * (size + padding); },
          r: 0,
          stroke: '#fff',
          'stroke-width': 2,
          fill: function(d) { return partyColor(d.name); },
        });

      var timer = setTimeout(function(){
        party.selectAll('.winners-order')
          .data(function(d) {return d.winners; })
          .enter()
          .append('text')
          .attrs({
            class: 'winners-order',
            x: function(d, i) { return padding + ((i % 2)+.5) * (size + padding); },
            y: function(d, i) { return padding + (Math.floor(i / 2)+.6) * (size + padding); },
            'text-anchor': 'middle',
            'font-weight': 'bold',
            fill: '#fff',
          })
          .text(function(d,i){return d.order;});
      }, 250);

      data.denominator++;

      partyVotes
        .data(function(d){ return [{
          name: d.key,
          total: d.total,
          denominator: d.denominator,
        }]; })
        .transition()
        .duration(250)
        .attrs({
          y: function(d){ return y(quotient(d)); },
          height: function(d){ return y(0) - y(quotient(d)); },
        });

      winners
        .transition()
        .duration(250)
        .attrs({
          r: size / 2,
        });

        pickTimer = setTimeout(function(){
            pickWinner();
        }, 400);
    }

    d3.selectAll("input").on("change", change);
    function change() {
      removeWinners();
      switch(this.value) {
        case 'parties':
          transitionParties();
          break;
        case 'candidates':
          transitionCandidates();
          break;
        case 'winners':
          transitionParties();
          setTimeout(function(){
              pickWinner();
          }, 1000);
          break;
      }
    }

    function removeWinners() {
      clearTimeout(pickTimer);
      d3.selectAll('.party').data().forEach(function(d){
        d.denominator = 1;
      });
      svg.selectAll('.party').data().forEach(function(d){
        d.winners = [];
      });
      var winners = svg.selectAll('.winners, .winners-order')
        .data([]);
      winners.exit().remove();
    }

    function transitionParties(callback) {
      svg.selectAll('.votes')
        .transition()
        .duration(1000)
        .attrs({
          fill: function(d){ return d3.hsl(partyColor(d.party)).brighter(); },
          // fill: '#f0f0f0',
        });

      // svg.selectAll('.party-votes')
      partyVotes
        .data(function(d){ return [{
          name: d.key,
          total: d.total,
          denominator: d.denominator,
        }]; })
        .transition()
        .duration(1000)
        .attrs({
          width: x.bandwidth(),
          y: function(d){ return y(quotient(d)); },
          height: function(d){ return y(0) - y(quotient(d)); },
        });
        // .call(endall, callback);
    }

    function transitionCandidates() {
      removeWinners();
      svg.selectAll('.votes')
        .transition()
        .duration(1000)
        .attrs({
          fill: function(d){ return color(d.name); },
        });
      svg.selectAll('.party-votes')
        .transition()
        .duration(1000)
        .attrs({
          width: 0,
        });
    }

    function endall(transition, callback) {
      if (!callback) callback = function(){};
      if (transition.size() === 0) { callback() }
      var n = 0;
      transition
          .each(function() { ++n; })
          .each("end", function() { if (!--n) callback.apply(this, arguments); });
    }

    d3.select(self.frameElement).style("height", height + margin.top + margin.bottom + "px");

  </script>
</body>
</html>

result.csv

政党,名簿登録者,得票数
自由民主党,政党名,14080143.000
自由民主党,つげ芳文,429002.906
自由民主党,山田としお,338485.641
自由民主党,佐藤まさひさ,326541.343
自由民主党,石井みどり,294079.739
自由民主党,橋本聖子,279953.190
自由民主党,羽生田たかし,249818
自由民主党,佐藤のぶあき,215506.522
自由民主党,赤池まさあき,208319.530
自由民主党,山東昭子,205779.472
自由民主党,えとうせいいち,204404
自由民主党,石田まさひろ,201109
自由民主党,ありむら治子,191342
自由民主党,宮本しゅうじ,178480
自由民主党,丸山和也,153303
自由民主党,北村つねお,142613
自由民主党,わたなべ美樹,104175.628
自由民主党,木村よしお,98979.184
自由民主党,太田ふさえ,77173
自由民主党,わかさ勝,76829
自由民主党,そのだ修光,65840
自由民主党,大江やすひろ,59376
自由民主党,佐々木洋平,56082.962
自由民主党,きむらりゅうじ,47627.116
自由民主党,伊藤ようすけ,37423.866
自由民主党,金子ぜんじろう,34866
自由民主党,塚原光男,28902.911
自由民主党,あぜもとしょうご,28519
自由民主党,佐竹まさあき,27582.194
自由民主党,米坂ともあき,18078
民主党,政党名,4827158.000
民主党,いそざき哲史,271553
民主党,浜野よしふみ,235917.899
民主党,あいはらくみこ,235636
民主党,大島くすお,191167
民主党,神本みえ子,176290
民主党,吉川さおり,167437.432
民主党,石上としお,152121.783
民主党,かわいたかのり,138830.531
民主党,石井一,123355.118
民主党,さだみつ克之,120782
民主党,とどろき利治,103996
民主党,ツルネンマルテイ,82858
民主党,かの道彦,82404
民主党,やなせ進,53940
民主党,円より子,49008.634
民主党,いがらし文彦,29077
民主党,吉田公一,27890.809
民主党,奥村てんぞう,27284.303
民主党,ささき隆博,24329.529
民主党,たるい良和,13178
日本維新の会,政党名,5191563.306
日本維新の会,アントニオ猪木,356605
日本維新の会,中山恭子,306341
日本維新の会,ギマ光男,40484.066
日本維新の会,藤巻健史,33237
日本維新の会,中野正志,32926
日本維新の会,むろい邦彦,32107
日本維新の会,土田ひろかず,28616
日本維新の会,おくむら慎太郎,27954.554
日本維新の会,桜井よう子,27757.216
日本維新の会,石井よしあき,25986.231
日本維新の会,浅田ますみ,22406
日本維新の会,うえの公成,21457
日本維新の会,石原結實,19097
日本維新の会,松村よしやす,18888
日本維新の会,山崎たい,18130.935
日本維新の会,片岡伸子,16329
日本維新の会,川口ひろし,16079.702
日本維新の会,宮崎ケンジ,15464.075
日本維新の会,くりはら博,14274
日本維新の会,せと健一郎,12768
日本維新の会,矢口けんいち,11327
日本維新の会,富山よしのぶ,10186.114
日本維新の会,石川てるひさ,10147
日本維新の会,伊賀やすお,9269.133
日本維新の会,にへいふみたか,7637
日本維新の会,岩本壮一郎,7167
日本維新の会,遠藤のぶひこ,7061
日本維新の会,松本こういち,6122.171
日本維新の会,竹内栄一,4991
日本維新の会,高田きよこ,2921
公明党,政党名,3333142.000
公明党,山本かなえ,996959.690
公明党,平木だいさく,770682
公明党,かわの義博,703637
公明党,山本ひろし,592815.950
公明党,若松かねしげ,577951
公明党,魚住ゆういちろう,540817
公明党,新妻ひでき,26044.410
公明党,川島信雄,7737.940
公明党,鈴木充,4695.331
公明党,清水定幸,2626
公明党,松葉玲,2332.259
公明党,宮地広助,2327
公明党,雨宮秀樹,1831.569
公明党,鷲岡秀明,1682
公明党,深澤淳,1119
公明党,窪田哲也,1051
公明党,四重田雅俊,631
みんなの党,政党名,4221422.000
みんなの党,川田龍平,117389
みんなの党,山口かずゆき,75000
みんなの党,渡辺みちたろう,50253.413
みんなの党,井上よしゆき,47756.805
みんなの党,かわい純一,39425.249
みんなの党,山本こうじ,37718.087
みんなの党,いしい竜馬,35364.782
みんなの党,本田あきこ,32330.469
みんなの党,梅沢しげお,23035
みんなの党,菅原なおとし,21135
みんなの党,きくちふみひろ,12676
みんなの党,平智之,11927
みんなの党,富岡ゆきお,11305
みんなの党,こさいたろう,10527
みんなの党,ふなびきこうこ,7896
生活の党,政党名,723987.000
生活の党,山岡けんじ,56372.620
生活の党,みやけ雪子,38766.890
生活の党,広野ただし,35554
生活の党,藤原よしのぶ,34568.833
生活の党,東祥三,33146
生活の党,はたともこ,21441.234
日本共産党,政党名,4647765.693
日本共産党,小池晃,134325.222
日本共産党,山下よしき,129149
日本共産党,紙智子,68729.911
日本共産党,井上さとし,50874.765
日本共産党,仁比そうへい,39768
日本共産党,山本陽子,36580.595
日本共産党,あさか由香,8429
日本共産党,木村けんじ,6595.040
日本共産党,池内さおり,6387.512
日本共産党,村上信夫,4545.057
日本共産党,辻源巳,4231
日本共産党,大西オサム,4087
日本共産党,こだか洋,3359.573
日本共産党,ニシヒラ守伸,2875
日本共産党,たけだ良介,2395
日本共産党,江上ひろゆき,2144
日本共産党,井沢孝典,1814.089
社会民主党,政党名,938227.000
社会民主党,又市征治,156155
社会民主党,山シロ博治,112641
社会民主党,矢野あつ子,26278
社会民主党,鴨ももよ,21934
みどりの風,政党名,319700.769
みどりの風,谷岡くにこ,51367
みどりの風,山田正彦,44231.110
みどりの風,井戸川かつたか,15444
新党大地,政党名,398848.000
新党大地,鈴木宗男,62902.333
新党大地,松木けんこう,38721
新党大地,内山あきら,6828.266
新党大地,橋本べん,3643.417
新党大地,町川じゅんこ,3313.385
新党大地,はぎはら仁,2934
新党大地,ささ節子,2647.044
新党大地,前川ひかる,1834
新党大地,田宮かいち,1475
緑の党グリーンズジャパン,政党名,242460.295
緑の党グリーンズジャパン,三宅洋平,176970.480
緑の党グリーンズジャパン,すぐろ奈緒,9109
緑の党グリーンズジャパン,長谷川ういこ,7431
緑の党グリーンズジャパン,木田せつこ,5219.945
緑の党グリーンズジャパン,大野たくお,4577
緑の党グリーンズジャパン,木村ゆういち,4549.357
緑の党グリーンズジャパン,田口まゆ,3308
緑の党グリーンズジャパン,しまざきなおみ,2223
緑の党グリーンズジャパン,尾形けいこ,2014
幸福実現党,政党名,153296.000
幸福実現党,やない筆勝,17010
幸福実現党,トクマ,16797
幸福実現党,いざわ一明,4540.622