甘特图重复TASKS样式

Repeating tasks类型的图表，图形的样式怎么修改了，试了在html标签上加palette属性，但是表现出来还是只有一个颜色

像这样想用不同颜色区分三个区域

目前没有办法支持这种动态的写法

Richard.Ma 发表于 2021-12-13 12:23
是的，加一个series标签即可
比如在线的demo例子中
https://www.grapecity.com/wijmo/demos/Chart/Specia ...

还得麻烦您一下，目前添加一个series标签可以实现多条的显示效果了，假设这个条数不确定，不能确定需要添加几个series标签，所以想问一下series标签可以循环嘛，我试了*ngFor，本来想着既然通过不同的name可以区分，就用循环的某一元素绑定到name上，但是不好用

不客气

Richard.Ma 发表于 2021-12-13 12:23
是的，加一个series标签即可
比如在线的demo例子中
https://www.grapecity.com/wijmo/demos/Chart/Specia ...

原来是这样，没想到name的问题，谢谢

是的，加一个series标签即可
比如在线的demo例子中
https://www.grapecity.com/wijmo/demos/Chart/Special/Gantt/angular

把component.html变成这样，两个series不同名字（可能是这个原因导致没有显示）

1. <div class="container-fluid">
   
2.     <wj-flex-chart #chart [itemsSource]="data" chartType="Bar" bindingX="name" [tooltipContent]="getTooltipContent"
   
3.         [itemFormatter]="ganttItemFormatter" (rendered)="ganttChartRendered(chart, $event)" [palette]="palette">
   
4.         <wj-flex-chart-series binding="start,end" name="s1"></wj-flex-chart-series>
   
5.         <wj-flex-chart-series binding="start,end" name="s2"></wj-flex-chart-series>
   
6.         <wj-flex-chart-axis wjProperty="axisY" [majorGrid]="false" [minorGrid]="true" [reversed]="true">
   
7.         </wj-flex-chart-axis>
   
8.     </wj-flex-chart>
   
9. </div>

复制代码

这样就可以看到效果了，当然，实际使用，你绑定不同的start和end日期字段就行了

Richard.Ma 发表于 2021-12-10 16:37
不客气

你好，我想追问一个问题，如果甘特图Repeating Tasks想做成组合的形式应该怎么做，我试了Bar chart里面的例子在series标签添加这种形式的代码,但是实际没有表现在画面上，data结构上只是在原本的数据里面多加了一套start1和end1

1. <wj-flex-chart-series [chartType]="'Bar'">
   
2.             <wj-flex-chart-series binding="start1,end1">
   
3.             </wj-flex-chart-series>
   
4.         </wj-flex-chart-series>

复制代码

1. data:{ index:0, id:"A1",name: 'Task1', start: new Date(2021, 0, 1,0), end: new Date(2021, 0, 1,1), start1: new Date(2021, 0, 1,0), end1: new Date(2021, 0, 1,2)},

复制代码

不客气

Richard.Ma 发表于 2021-12-10 14:50
好的，也就是说一行里面不同的色块，按platete里的颜色排列是吧
https://www.grapecity.com/wijmo/demos/C ...

解决了，多谢

Richard.Ma 发表于 2021-12-10 14:26
也就是说每一个task 用一个颜色是吧，你可以参考这个例子，在ganttItemFormatter事件中，先设置fill属性， ...

不是每个Y轴对应一个颜色，是同一个Y轴里面不用的颜色，比如说A3，我现在做的数据里包含了三条不同的数据目前，这五条不同的数据我想填充不同的颜色，我把Y轴标签改了这样看能直观点

也就是说每一个task 用一个颜色是吧，你可以参考这个例子，在ganttItemFormatter事件中，先设置fill属性，然后再调用defaultFormatter，

1. engine.fill=this.palette[ht.item.index];
   
2. defaultFormatter();

复制代码

https://www.grapecity.com/wijmo/demos/Chart/Special/Gantt/angular