amcharts实现甘蔗图交互效果-html代码-BFW代码库

amcharts实现甘蔗图交互效果

代码语言：html

所属分类：图表

代码描述：amcharts实现甘蔗图交互效果

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

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

<style>
#chartdiv {
	width		: 1080px;
	height		: 400px;
	font-size	: 10px;
}
</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>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/amcharts-gantt.js"></script>
<div id="chartdiv"></div>

<script>
AmCharts.useUTC = true;
var chart = AmCharts.makeChart("chartdiv", {
  "type": "gantt",
  "theme": "light",
  "marginRight": 40,
  "period": "hh",
  "dataDateFormat": "YYYY-MM-DD",
  "balloonDateFormat": "JJ:NN",
  "columnWidth": 0.25,
  "valueAxis": {
    "type": "date",
    "minimum": 7,
    "maximum": 31,
    "fontSize": 10,
    "titleFontSize": 18 },

  "balloon": {
    "adjustBorderColor": true,
    "borderThickness": 2,
    "shadowAlpha": 0,
    "color": "#353535",
    "cornerRadius": 3,
    "fillColor": "#FFFFFF" },

  "categoryAxis": {
    "fontSize": 10,
    "fillColor": "#ededed" },

  "brightnessStep": 10,
  "graph": {
    "fillAlphas": 1,
    "balloonText": "<b>[[task].........完整代码请登录后点击上方下载按钮下载查看