/* var myChart31 = echarts.init(document.querySelector(".echart31"))
 */
$(function(){  
  new7()   //基础设施建设
  jianshe()  //建设中的数据





});  

//基础设置


var chartDom1 = document.getElementById('main1');
var myChart1 = echarts.init(chartDom1);

var chartDom2 = document.getElementById('main2');
var myChart2 = echarts.init(chartDom2);

var chartDom3 = document.getElementById('main3');
var myChart3 = echarts.init(chartDom3);




function jiantu(a,b,c){
var chartDom = document.getElementById('main');
var myChart = echarts.init(chartDom);
  var option = {
    tooltip: {
      trigger: "item",
      show: true,
      showContent: true,
    },
    // legend: {
    //   top: "5%",
    //   left: "center",
    //   itemStyle: {
    //     tooltip: true,
    //   },
    // },
    series: [{
      // name: "Access From",
      type: "pie",
      radius: ["70%", "90%"],
      avoidLabelOverlap: false,
      label: {
        show: true,
        // position: "center",
      },
      itemStyle: {
        color: "#3D9DF4",
      },
      emphasis: {
        label: {
          show: true,
          fontSize: "40",
          fontWeight: "bold",
        },
        itemStyle: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: "rgba(0, 0, 0, 0.5)",
        },
      },
      labelLine: {
        show: false,
      },
      data: [
        {
          value: a,
          name: (a/a*100).toFixed(0) + "%" ,
          label: {
            position: "center",
            fontSize: 16,
          },
        },
        {
          value: a-a,
          // name: "43%",
          itemStyle: {
            color: "#EEEEEE",
          },
          label: {
            position: "center",
            fontSize: 16,
          },
        },
    ],
    }, ],
  }
myChart.setOption(option)
}


function jiantu1(a){
var option1 = {
  tooltip: {
    trigger: "item",
    show: true,
    showContent: true,
  },
  // legend: {
  //   top: "5%",
  //   left: "center",
  //   itemStyle: {
  //     tooltip: true,
  //   },
  // },
  series: [{
    // name: "Access From",
    type: "pie",
    radius: ["70%", "90%"],
    avoidLabelOverlap: false,
    label: {
      show: true,
      // position: "center",
    },
    itemStyle: {
      color: "#3D9DF4",
    },
    emphasis: {
      label: {
        show: true,
        fontSize: "40",
        fontWeight: "bold",
      },
      itemStyle: {
        shadowBlur: 10,
        shadowOffsetX: 0,
        shadowColor: "rgba(0, 0, 0, 0.5)",
      },
    },
    labelLine: {
      show: false,
    },
    data: [
      {
        value: a,
        name: (a/a*100).toFixed(0) + "%" ,
        label: {
          position: "center",
          fontSize: 16,
        },
      },
      {
        value: a-a,
        // name: "43%",
        itemStyle: {
          color: "#EEEEEE",
        },
        label: {
          position: "center",
          fontSize: 16,
        },
      },
  
  ],
  }, ],
}

myChart1.setOption(option1)
}


function jiantu2(a){


var option2 = {
  tooltip: {
    trigger: "item",
    show: true,
    showContent: true,
  },
  // legend: {
  //   top: "5%",
  //   left: "center",
  //   itemStyle: {
  //     tooltip: true,
  //   },
  // },
  series: [{
    // name: "Access From",
    type: "pie",
    radius: ["70%", "90%"],
    avoidLabelOverlap: false,
    label: {
      show: true,
      // position: "center",
    },
    itemStyle: {
      color: "#3D9DF4",
    },
    emphasis: {
      label: {
        show: true,
        fontSize: "40",
        fontWeight: "bold",
      },
      itemStyle: {
        shadowBlur: 10,
        shadowOffsetX: 0,
        shadowColor: "rgba(0, 0, 0, 0.5)",
      },
    },
    labelLine: {
      show: false,
    },
    data: [
      {
        value: a,
        name: (a/a*100).toFixed(0) + "%" ,
        label: {
          position: "center",
          fontSize: 16,
        },
      },
      {
        value: a-a,
        // name: "43%",
        itemStyle: {
          color: "#EEEEEE",
        },
        label: {
          position: "center",
          fontSize: 16,
        },
      },
  ],
  }, ],
}
myChart2.setOption(option2)

}


function  jiantu3(a){


var option3 = {
  tooltip: {
    trigger: "item",
    show: true,
    showContent: true,
  },
  // legend: {
  //   top: "5%",
  //   left: "center",
  //   itemStyle: {
  //     tooltip: true,
  //   },
  // },
  series: [{
    // name: "Access From",
    type: "pie",
    radius: ["70%", "90%"],
    avoidLabelOverlap: false,
    label: {
      show: true,
      // position: "center",
    },
    itemStyle: {
      color: "#3D9DF4",
    },
    emphasis: {
      label: {
        show: true,
        fontSize: "40",
        fontWeight: "bold",
      },
      itemStyle: {
        shadowBlur: 10,
        shadowOffsetX: 0,
        shadowColor: "rgba(0, 0, 0, 0.5)",
      },
    },
    labelLine: {
      show: false,
    },
    data: [
      {
        value: a,
        name: (a/a*100).toFixed(0) + "%" ,
        label: {
          position: "center",
          fontSize: 16,
        },
      },
      {
        value: a-a,
        // name: "43%",
        itemStyle: {
          color: "#EEEEEE",
        },
        label: {
          position: "center",
          fontSize: 16,
        },
      },
  ],
  }, ],
}
myChart3.setOption(option3)

}


function new7(){
   let url = "http://118.178.224.202:8024/api/new7"
   $.get(url,function(data){
     $(".total").html(data.data[0].total)
     $(".total1").html(data.data[0].total1)
     $(".total2").html(data.data[0].total2)
     $(".total3").html(data.data[0].total3)
     $(".total4").html(data.data[0].total4)

     $(".now").html(data.data[0].now)
     $(".now1").html(data.data[0].now1)
     $(".now2").html(data.data[0].now2)
     $(".now3").html(data.data[0].now3)
     $(".now4").html(data.data[0].now4)
     $(".area").html(data.data[0].area)
   })
}

function jianshe(){
	let url = "http://118.178.224.202:8024/api/road-c"
	$.get(url,function(data){

  console.log("得到的元数据",data)


	  $(".continue").html(data.data[0].continue)
	  $(".work").html(data.data[0].work)
	  $(".finish").html(data.data[0].finish)

	  $(".increase").html(data.data[0].increase)
	  $(".construction").html(data.data[0].construction)
	  $(".invest").html(data.data[0].invest)
	  $(".construction2").html(data.data[0].construction2)


    jiantu(data.data[0].continue,data.data[0].work,data.data[0].finish)
    jiantu1(data.data[0].increase)
    jiantu2(data.data[0].construction)
    jiantu3(data.data[0].construction2)

	})
}