我正在使用来自该站点http://mbielnczuk.com/2011/06/jquery-gantt-chart/的 jQuery 插件。
除了宽度和高度有问题外,我能够实现它。示例:http ://www.txtease.com/android/push/login/schedule/mbielan/index.htm
从链接中,您可以看到图表没有填满屏幕。您是否熟悉使用 jQuery.Gantt 并且知道要针对哪个元素来调整宽度和高度?
- 我已将“itemsperpage”参数设置为 17。
根据我的调查,图表的宽度似乎是基于高度的。该数字被划分为分页。
我在 css 中的图表周围放置了宽度和高度样式。只有高度调整为800px。宽度保持不变
甘特图 </script-->
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<script type="text/javascript">
jQuery(function () {
var dataPath = location.href.substring(0, location.href.lastIndexOf('/')+1);
$(".gantt2").gantt({source: dataPath + "js/dataHours.js", navigate: 'scroll', scale: 'hours', maxScale: 'hours', minScale: 'hours', hollydays: ["\/Date(1293836400000)\/","\/Date(1294268400000)\/","\/Date(1303596000000)\/","\/Date(1306274400000)\/","\/Date(1304200800000)\/","\/Date(1304373600000)\/","\/Date(1307829600000)\/","\/Date(1308780000000)\/","\/Date(1313359200000)\/","\/Date(1320105600000)\/","\/Date(1320966000000)\/","\/Date(1324767600000)\/","\/Date(1324854000000)\/","\/Date(1325372400000)\/","\/Date(1325804400000)\/","\/Date(1333836000000)\/","\/Date(1336514400000)\/","\/Date(1335823200000)\/","\/Date(1335996000000)\/","\/Date(1338069600000)\/","\/Date(1339020000000)\/","\/Date(1344981600000)\/","\/Date(1351724400000)\/","\/Date(1352588400000)\/","\/Date(1356390000000)\/","\/Date(1356476400000)\/"]});
//$(".gantt").gantt({source: dataPath + "js/dataDays.js", navigate: 'scroll', scale: 'days', maxScale: 'weeks', minScale: 'days', hollydays: ["\/Date(1293836400000)\/","\/Date(1294268400000)\/","\/Date(1303596000000)\/","\/Date(1306274400000)\/","\/Date(1304200800000)\/","\/Date(1304373600000)\/","\/Date(1307829600000)\/","\/Date(1308780000000)\/","\/Date(1313359200000)\/","\/Date(1320105600000)\/","\/Date(1320966000000)\/","\/Date(1324767600000)\/","\/Date(1324854000000)\/","\/Date(1325372400000)\/","\/Date(1325804400000)\/","\/Date(1333836000000)\/","\/Date(1336514400000)\/","\/Date(1335823200000)\/","\/Date(1335996000000)\/","\/Date(1338069600000)\/","\/Date(1339020000000)\/","\/Date(1344981600000)\/","\/Date(1351724400000)\/","\/Date(1352588400000)\/","\/Date(1356390000000)\/","\/Date(1356476400000)\/"]});
//$(".gantt").gantt({
// source: [{"name":"application","desc":"Lübeck","values":[{"from":"/Date(1293874598708)/","to":"/Date(1354268198708)/","desc":"ID: 10<br/>name: CRM<br/>date: 01.01.2011 to 30.11.2012<br/>description: CRM 4.0", "label":"CRM","customClass":"ganttGreen"}]}],
// navigate: 'scroll', scale: 'days', hollydays: ["\/Date(1293836400000)\/","\/Date(1294268400000)\/","\/Date(1303596000000)\/","\/Date(1306274400000)\/","\/Date(1304200800000)\/","\/Date(1304373600000)\/","\/Date(1307829600000)\/","\/Date(1308780000000)\/","\/Date(1313359200000)\/","\/Date(1320105600000)\/","\/Date(1320966000000)\/","\/Date(1324767600000)\/","\/Date(1324854000000)\/","\/Date(1325372400000)\/","\/Date(1325804400000)\/","\/Date(1333836000000)\/","\/Date(1336514400000)\/","\/Date(1335823200000)\/","\/Date(1335996000000)\/","\/Date(1338069600000)\/","\/Date(1339020000000)\/","\/Date(1344981600000)\/","\/Date(1351724400000)\/","\/Date(1352588400000)\/","\/Date(1356390000000)\/","\/Date(1356476400000)\/"]});
});
</script>
</head>
<body>
<div class="gantt2" style="width: 800px,height: 800px"></div>
</body>
任何帮助表示赞赏!