directly post the pictures you want to see and the pictures you want to do, and ask for advice
desired style
the code is as follows
< html >
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/echarts.js" ></script>
<script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script>
</head>
<body>
<div id="main" style=" width: 300px; height: 300px;"></div>
<script>
var mycharts = echarts.init(document.getElementById("main"));
var url = "./json/rate.json";
$.get(url).done(function(data){
var pass=data.results.pass;
var total=data.results.total;
var pass1 = parseFloat((parseFloat(pass))/parseFloat(total)).toFixed(2);
var va=10;
console.log(pass1);
option = {
viewMap: {
symbol: "circle",
},
tooltip : {
formatter: "{a} <br/>{b} : {c}%"
},
toolbox: {
feature: {
restore: {},
saveAsImage: {}
}
},
series: [
{
name: "",
type: "gauge",
splitNumber: 0,
axisLabel: {
show: false,
distance: 0,
},
pointer: {
show: false
},
splitLine: {
show: false,
},
axisTick : {
show: false,
},
axisLine: {
lineStyle: {
width: 20,
color: [
[pass1, "-sharp91c7ae"],
[ 1,"-sharpeee"]
]
}
},
title : {
offsetCenter: [0, "10%"], // x, ypx
textStyle: { // TEXTSTYLE
fontWeight: "bolder",
fontSize: 20,
fontStyle: "italic",
// color: "-sharpfff",
}
},
detail : {
offsetCenter: ["-0%", "-25%"], // x, ypx
color:"-sharpff0000",
formatter: va+"%",
textStyle: { // TEXTSTYLE
fontWeight: "bolder",
// color: "-sharpfff"
}
},
data: [
{value: 90, name:""}
]
}
]
}
mycharts.setOption(option);
})
</script>
</body>< / html >