amcharts实现3d墙线条图表效果-html代码-BFW代码库

amcharts实现3d墙线条图表效果

代码语言：html

所属分类：图表

代码描述：amcharts实现3d墙线条图表效果

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
body {
  background: #5d3bb4;
  padding: 0;
  margin: 0;
}

#chartdiv {
  width: 100%;
  height: 350px;
  background: #5d3bb4;
  background: linear-gradient(to bottom, #626dd4, #5d3bb4);
  color: #fff;
  font-weight: 100;
  overflow: hidden;
}

.amcharts-graph-g4 {
  filter: url(#blur);
}
</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-serial.js"></script>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/amcharts-light.js"></script>
<div id="chartdiv"></div>


<script>
var chart = AmCharts.makeChart("chartdiv", {
  "type": "serial",
  "theme": "light",
  "addClassNames": true,
  "marginLeft": 25,
  "marginRight": 25,
  "marginTop": 45,
  "marginBottom": 0,
  "autoMarginOffset": 15,
  "startDuration": 2,
  "sequencedAnimation": false,
  "dataProvider": [{
    "month": "JAN",
    "value1": 40,
    "value2": 15,
    "value3": 0,
    "value4": 20,
    "color": "#807fd3" },
  {
    "month": "FEB",
    "value1": 10,
    "value2": 15,
    "value3": 0,
    "value4": 0,
    "color": "#6e6abc" },
  {
    "month": "MAR",
    "value1": 40,
    "value2": 15,
    "value3": 0,
    "value4": 20,
    "color": "#807fd3" },
  {
    "month": "APR",
    "value1": 22,
    "value2": 15,
    "value3": 0,
    "value4": 2,
    "color": "#6e6abc" },
  {
    "month": "MAY",
    "value1&q.........完整代码请登录后点击上方下载按钮下载查看