amcharts实现多种雷达图效果
代码语言:html
所属分类:图表
代码描述:amcharts实现多种雷达图效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="http://repo.bfw.wiki/bfwrepo/css/bootstrap.4.3.1.min.css">
<style>
body {
background-color: #fff;
color: #333;
}
[id*=chart] {
width: 100%;
height: 300px;
}
h2 {
margin-top: 0;
}
.amcharts-chart-div {
border: 2px solid #ccc;
background: #fff;
border-radius: 1em;
}
.amcharts-chart-div a {
display: none !important;
}
.amcharts-export-menu {
display: none;
}
.well {
border-radius: 0;
margin-bottom: -1px;
}
@media screen and (max-width: 768px) {
.well {
margin: 1em;
}
}
</style>
</head>
<body translate="no">
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/amcharts.js"></script>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/amcharts-dark.js"></script>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/amcharts-radar.js"></script>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/amcharts-export.min.js"></script>
<link type="text/css" rel="stylesheet" href="http://repo.bfw.wiki/bfwrepo/css/amcharts-export.css">
<div class="container">
<h1>My Skill Levels <small><a href="" title="JavaScript charts">Using amCharts</a></small></h1>
<div class="row">
<div class="well col-sm-6">
<h2>Team</h2>
<div id="chart-general"></div>
</div>
<div class="well col-sm-6">
<h2>Design</h2>
<div id=&quo.........完整代码请登录后点击上方下载按钮下载查看
网友评论0