(function() {
  let percent =   62.60,
      w = 120,
      h = 100,
      outerRadius = (w / 2) - 10,
      innerRadius = 15,
      lang = 'EN'
  let arc = d3.arc()
    .innerRadius(innerRadius)
    .outerRadius(outerRadius)
    .startAngle(0)
    .endAngle(Math.PI)
  let arcLine = d3.arc()
    .innerRadius(innerRadius)
    .outerRadius(outerRadius)
    .startAngle(0)
  let svg = d3.select("#chart")
    .append("svg")
    .attr('width', w)
    .attr('height', h)
    .attr('class', 'shadow')
    .append('g')
    .attr('transform', 'translate(' + w / 2 + ',' + h / 2 + ')')
  let path = svg.append('path')
    .attr('d', arc)
    .attr('transform', 'rotate(-90)')
    .attr('stroke', '#666666')
    .attr('stroke-width', '1')
    .style('fill', '#ececec')
  let pathForeground = svg.append('path')
    .datum({
      endAngle: 0
    })
    .attr('d', arcLine)
    .attr('transform', 'rotate(-90)')
    .style('fill', '#0059A9')
    .transition()
    .duration(1000)
    .ease(d3.easeLinear)
    .call(arcTween, percent)
  function arcTween(transition, newValue) {
    let progressCount = d3.select("#semiCircleCount")
    transition.attrTween("d", function(d) {
      let interpolate = d3.interpolate(d.endAngle, ((Math.PI)) * (newValue / 100)),
        interpolateCount = d3.interpolate(0, newValue)
      return function(t) {
        d.endAngle = interpolate(t)
        progressCount.text(interpolateCount(t).toFixed(2).replace(/\./g, lang === "CZ" ? ',' : '.') + ' %')
        return arcLine(d)
      }
    })
  }
})()
