dojo甘特图插件扩展gantt chart

这几天，又加了两个新功能，一个是，打开甘特图的时候，默认显示转到今天的位置，而不是项目开始日期，一个是加入了一个甘特图的里程碑功能。真相图如下



默认显示今天的比较简单，在ganttchart.js中加入一个函数即可
goToToday: function(){
var a=newDate();
var b=newDate(this.startDate);
//this meansproject start date is after today
if(b>a){
return;
}
varc=Math.round((a - b) / 1000 / 60 / 60 / 24);
vard=(c/this.totalDays)*this.maxTaskEndPos;
//this meansthe project should be finished before today
if(d>this.maxTaskEndPos){
return;
}
this.contentData.scrollLeft = d;
},
显示甘特图里程碑的功能，则是新增了一个ganttMilestoneItem.js的文件，用以记录里程碑的一些信息，可以扩展，我用的是公司项目里的一些参数，代码如下：
define("dojox/gantt/GanttMilestoneItem",[
"dojo/_base/declare",
"dojo/domReady!"
],function(declare){
returndeclare("dojox.gantt.GanttMilestoneItem",[],{
constructor:function(configuration){
//id isrequired
this.id =configuration.id;
this.name =configuration.name || null;
this.startDate = configuration.startDate || new Date();
this.endDate= configuration.endDate || null;
this.percentage = configuration.percentage || 0;
this.description = configuration.description || null;
this.lastUpdate = configuration.lastUpdate || null;
this.gatewayNo = configuration.gatewayNo || null;
this.parentProjectId = configuration.parentProjectId || null;
this.gatewayStatus = configuration.gatewayStatus || null;
this.onTrackStatus = configuration.onTrackStatus || null;
}
});
});
然后在ganttchart.js中，新增一个画里程碑的函数
addMilestoneInPanelTime: function(row){
var date =new Date(this.startDate);
date.setDate(date.getDate() + parseInt(row.cells.length));
var newCell= domConstruct.create("td",{
align:"center",
vAlign:"middle",
className:"ganttDayNumber",
innerHTML:this.pixelsPerDay > 20 ? "" : "",
innerHTMLData: String(date.getDate()),
data:row.cells.length
},row);
domStyle.set(newCell,"width",this.pixelsPerDay + "px");
//show themilestone rhombus :Hu Wei
for(vari=0;i
var nowDay=date.getFullYear() + '-' + (date.getMonth()+1) + '-' +date.getDate();
// if theday is a milestone's end date,the show the rhombus and thetoolTip
if(nowDay==this.milestone[i].endDate)
{
domClass.add(newCell,"ganttMilestone");
domAttr.set(newCell,'milestoneIndex',i);
this._events.push(
on(newCell,"mouSEOver",lang.hitch(this,function(event){
var dayTime= event.target || event.srcElement;
var index =domAttr.get(dayTime,"milestoneIndex");
vartooltip='id : '+this.milestone[index].id+'
name : '+this.milestone[index].name+'
startDate : '+
this.milestone[index].startDate+'
endDate : '+this.milestone[index].endDate+'
percentage : '+
this.milestone[index].percentage+'
description : '+this.milestone[index].description+'
lastUpdate : '+
this.milestone[index].lastUpdate+'
gatewayNo : '+this.milestone[index].gatewayNo+'
parentProjectId : '+
this.milestone[index].parentProjectId+'
gatewayStatus : '+this.milestone[index].gatewayStatus+'
onTrackStatus : '+
this.milestone[index].onTrackStatus;
dijit.showTooltip(tooltip,newCell,["above","below"]);
}))
);
this._events.push(
on(newCell,"mouSEOut",function(event){
var dayTime= event.target || event.srcElement;
dayTime&& dijit.hideTooltip(dayTime);
}))
);
}
}
},
然后，下面新增一个调用的函数
addMilestone: function(ganttMilestoneItem){
//add themilestone items :Hu Wei
this.milestone.push(ganttMilestoneItem);
},
setMilestone: function(){
var tblTime= this.panelTime.firstChild.firstChild;
varnewMilestoneRow = tblTime.insertRow(tblTime.rows.length);
for(var i =0; i < this.totalDays; i++){
this.addMilestoneInPanelTime(newMilestoneRow);
}
}
最后在页面中调用即可
var gmi1=new GanttMilestoneItem({
id:1,
name:'1',
startDate:'2012-9-11',
endDate:'2013-9-12',
percentage:50,
description:'1 description',
lastUpdate:'2013-3-23',
gatewayNo:'1-01',
parentProjectId:'',
gatewayStatus:'1 gateway status',
onTrackStatus:'1 on track status'
});
var gmi2=new GanttMilestoneItem({
id:1,
endDate:'2013-11-2',
onTrackStatus:'1 on track status'
});
var gmi3=new GanttMilestoneItem({
id:1,
endDate:'2013-8-19',
onTrackStatus:'1 on track status'
});
ganttChart.addMilestone(gmi1);
ganttChart.addMilestone(gmi2);
ganttChart.addMilestone(gmi3);
ganttChart.setMilestone();
同样的，需要的代码的，四个字，请联系我！！