2014-12-19 2 views
0

Я заинтересован в создании GanttChart. После долгих поисков, я нашел dhtmlxGanttГрафик Ганта с JSF

Я попробовал образец dhtmlxGantt в

http://www.dhtmlx.com/docs/products/dhtmlxGantt/download/dhtmlxGantt.zip

Моя проблема теперь ось диаграммы показывают только день, у вас есть идея, как я могу отобразить потому что мне нужно отображать задачи со временем начала? Вот мой код:

<html xmlns="http://www.w3.org/1999/xhtml" 
     xmlns:h="http://java.sun.com/jsf/html" 
     xmlns:f="http://java.sun.com/jsf/core" 
     xmlns:ui="http://java.sun.com/jsf/facelets"> 

    <h:head> 
     <title>Facelet Title</title> 
    </h:head> 
    <body> 
     Hello from Facelets 

     <h:link type="text/css" rel="stylesheet" 
       href="resources/css/dhtmlxGantt/codebase/dhtmlxgantt.css"/> 
     <script type="text/javascript" language="JavaScript" 
     src="resources/css/dhtmlxGantt/codebase/dhtmlxcommon.js"></script> 
     <script type="text/javascript" language="JavaScript" 
     src="resources/css/dhtmlxGantt/codebase/dhtmlxgantt.js"></script> 
     <script type="text/javascript" language="JavaScript"> /*<![CDATA[*/ 
      function createChartControl(htmlDiv1) { 
       // Initialize Gantt data structures 
       //project 1 

       var project1 = new GanttProjectInfo(1, "Opérateur1", new Date(2010, 5, 11)); 
       var parentTask1 = new GanttTaskInfo(1, "OT1", new Date(2010, 5, 11), 4, 50, ""); 

       var parentTask2 = new GanttTaskInfo(2, "OT2", new Date(2010, 5, 11), 4, 80, ""); 
       project1.addTask(parentTask1); 
       project1.addTask(parentTask2); 
       var project2 = new GanttProjectInfo(2, "Opérateur2", new Date(2010, 5, 11)); 
       var parentTask11 = new GanttTaskInfo(4, "OT1", new Date(2010, 5, 11), 18, 50, ""); 

       var parentTask22 = new GanttTaskInfo(5, "OT2", new Date(2010, 5, 14), 190, 80, ""); 
       project2.addTask(parentTask11); 
       project2.addTask(parentTask22); 

       // Create Gantt control 
       var ganttChartControl = new GanttChart(); 
       // Setup paths and behavior 
       ganttChartControl.setImagePath("resources/css/dhtmlxGantt/codebase/imgs/"); 
       ganttChartControl.setEditable(true); 
       ganttChartControl.showTreePanel(true); 
       ganttChartControl.showContextMenu(true); 
       ganttChartControl.showDescTask(true, 'd,s-f'); 
       ganttChartControl.showDescProject(false, 'n,d'); 


       // Load data structure 
       ganttChartControl.addProject(project1); 
       ganttChartControl.addProject(project2); 

       // Build control on the page 
       ganttChartControl.create(htmlDiv1); 
      }; 
      /*]]>*/ 
     </script> 

     <div style="width:1200px; height:620px; position:relative;" id="GanttDiv"> 
      <script type='text/javascript'></script> 
     </div> 

    </body> 
</html> 
+0

' 'не имеет' href' атрибут как вам похоже, предположили. – Tiny

ответ

0

использовать primefaces тег в XHTML

<p:chart type="bar" model="#{chartView.horizontalBarModel}" style="height:300px"/> 

и код Java

import javax.annotation.PostConstruct; 
import java.io.Serializable; 
import javax.faces.bean.ManagedBean; 

import org.primefaces.model.chart.Axis; 
import org.primefaces.model.chart.AxisType; 
import org.primefaces.model.chart.BarChartModel; 
import org.primefaces.model.chart.HorizontalBarChartModel; 
import org.primefaces.model.chart.ChartSeries; 

@ManagedBean 
public class ChartView implements Serializable { 

private HorizontalBarChartModel horizontalBarModel; 

public HorizontalBarChartModel getHorizontalBarModel() { 
    return horizontalBarModel; 
} 

private BarChartModel initBarModel() { 
    BarChartModel model = new BarChartModel(); 

    ChartSeries boys = new ChartSeries(); 
    boys.setLabel("Boys"); 
    boys.set("2004", 120); 
    boys.set("2005", 100); 
    boys.set("2006", 44); 
    boys.set("2007", 150); 
    boys.set("2008", 25); 

    ChartSeries girls = new ChartSeries(); 
    girls.setLabel("Girls"); 
    girls.set("2004", 52); 
    girls.set("2005", 60); 
    girls.set("2006", 110); 
    girls.set("2007", 135); 
    girls.set("2008", 120); 

    model.addSeries(boys); 
    model.addSeries(girls); 

    return model; 
} 

private void createHorizontalBarModel() { 
    horizontalBarModel = new HorizontalBarChartModel(); 

    ChartSeries boys = new ChartSeries(); 
    boys.setLabel("Boys"); 
    boys.set("2004", 50); 
    boys.set("2005", 96); 
    boys.set("2006", 44); 
    boys.set("2007", 55); 
    boys.set("2008", 25); 

    ChartSeries girls = new ChartSeries(); 
    girls.setLabel("Girls"); 
    girls.set("2004", 52); 
    girls.set("2005", 60); 
    girls.set("2006", 82); 
    girls.set("2007", 35); 
    girls.set("2008", 120); 

    horizontalBarModel.addSeries(boys); 
    horizontalBarModel.addSeries(girls); 

    horizontalBarModel.setTitle("Horizontal and Stacked"); 
    horizontalBarModel.setLegendPosition("e"); 
    horizontalBarModel.setStacked(true); 

    Axis xAxis = horizontalBarModel.getAxis(AxisType.X); 
    xAxis.setLabel("Births"); 
    xAxis.setMin(0); 
    xAxis.setMax(200); 

    Axis yAxis = horizontalBarModel.getAxis(AxisType.Y); 
    yAxis.setLabel("Gender");  
} 

}` 

`