(function() {
  let data = [{party:'CSSD',color:'FF9933',mandate:'56'},{party:'ODS',color:'3366FF',mandate:'53'},{party:'TOP 09',color:'9966CC',mandate:'41'},{party:'KSCM',color:'FF0000',mandate:'26'},{party:'VV',color:'000017',mandate:'24'}];
  d3.select('#rects')
    .append('ul')
    .style('list-style-type', 'none')
    .selectAll('.rect')
    .data(data)
    .enter()
    .append('li')
    .style('background', 'none')
    .style('display', 'inline')
    .append('div')
    .style('display', 'inline-block')
    .style('margin', '5px')
    .style('height', '25px')
    .append('svg')
    .attr('class', 'svgRect')
    .attr('height', 16)
    .attr('width', 170)
    .append('rect')
    .attr('class', 'rect')
    .attr('fill', function (d) { return '#' + d.color; })
    .attr('stroke', '#000')
    .attr('stroke-width', .5)
    .attr('x', 1)
    .attr('y', 1)
    .attr('height', 14)
    .attr('width', 15)
    .select(function () { return this.parentNode })
    .append('text')
    .attr('x', 25)
    .attr('y', 15)
    .text(function (d) { return d.party + ': ' + d.mandate });
})();