highcharts-gantt实现一个工作排版表甘蔗图图表效果代码
代码语言:html
所属分类:图表
代码描述:highcharts-gantt实现一个工作排版表甘蔗图图表效果代码
代码标签: highcharts-gantt 工作 排版表 甘蔗图 图表
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
#container {
max-width: 1200px;
min-width: 800px;
height: 400px;
margin: 1em auto;
}
.scrolling-container {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
</style>
</head>
<body>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/highcharts-gantt.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/exporting.js"></script>
<div class="scrolling-container">
<div id="container"></div>
</div>
<script type="text/javascript">
// Set to 00:00:00:000 today
var today = new Date(),
day = 1000 * 60 * 60 * 24,
map = Highcharts.map,
dateFormat = Highcharts.dateFormat,
series,
cars;
// Set to 00:00:00:000 today
today.setUTCHours(0);
today.setUTCMinutes(0);
today.setUTCSeconds(0);
today.setUTCMilliseconds(0);
today = today.getTime();
cars = [{
model: 'Nissan Leaf',
current: 0,
deals: [{
rentedTo: 'Lisa Star',
from: today - 1 * day,
to: today + 2 * day
}, {
rentedTo: 'Shane Long',
from: today - 3 * day,
to: today - 2 * day
}, {
rentedTo: 'Jack Coleman',
from: today + 5 * day,
to: today + 6 * day
}]
}, {
model: 'Jaguar E-type',
current: 0,
deals: [{
rentedTo: 'Martin Hammond',
from: today - 2 *.........完整代码请登录后点击上方下载按钮下载查看
网友评论0