Closed icangku closed 6 years ago
You can ensure that every segment in the same line is the same color, by setting chart's setting brightnessStep
to zero:
"brightnessStep": 0,
If you would like all lines to have the same color, you can set graph
's fillColors
to a color setting:
"graph": {
"fillAlphas": 1,
"fillColors": "#5655aa",
// ...
},
Here's an example: https://codepen.io/team/amcharts/pen/36259079a73fb2d503eafe826cc593fc/
I want that every bar of my Gantt chart has the same color if I put green color, every green color has the same color, and the rest color do the same thing
window.AmCharts.makeChart("chartdiv2", { "type": "gantt", "theme": "light", "path": "/../amcharts/", "period": "DD", "dataDateFormat": "YYYY-MM-DD", "marginRight" : 70, "columnWidth": 0.5, "valueAxis": { "type": "date", "guides" : [{ "value": AmCharts.stringToDate(date, "YYYY-MM-DD"), "toValue": AmCharts.stringToDate(date, "YYYY-MM-DD"), "lineAlpha": 0.2, "lineColor": "#bd30ff", "lineThickness": 3, "fillAlpha": 0.1, "fillColor": "#e1423e", "label": day, "inside": false }] }, "brightnessStep": 7, "graph": { "fillAlphas": 1, "lineAlpha": 1, "lineColor": "#bcb1f7", "balloonText": "<b>[[task]]</b>:<br />[[open]] - [[value]]", "customBulletField": "customBullet", "bulletField": "bullet", "bulletSize": 12, "bulletBorderColor" :'#680dd8', 'bulletColor' : '#680dd8', }, "rotate": true, "categoryField": "category", "segmentsField": "segments", "colorField": "color", "startDateField": "start", "endDateField": "end", "dataProvider": response.data, "valueScrollbar":{ "oppositeAxis":true, "offset":10, "scrollbarHeight":10 }, "categoryAxis": { "minorGridEnabled": true }, "chartScrollbar": { "color":"#AAAAAA" }, "chartCursor": { "cursorColor": "#55bb76", "valueBalloonsEnabled": false, "cursorAlpha": 0, "valueLineAlpha": 0.5, "valueLineBalloonEnabled": true, "valueLineEnabled": true, "zoomable": false, "valueZoomable": true }, "export": { "enabled": true, "libs": { "path": "/../amcharts/libs/" } }, "listeners": [{ "event": "clickGraphItem", "method": function(e) { // e.graph.customData holds exactly same segment data as it was defined // in dataProvider // alert('as'); var item = e.graph.customData; if (typeof item.clickTimeout === "undefined") { // This is a first click // Let's time click action - if another click on the same element does not occur within 200ms it will execute item.clickTimeout = setTimeout(function() { item.clickTimeout = undefined; console.log("Clicked", item); }, 200); window.location.href=window.location.origin+'/detail-timeline-product/'+item.link } else { // Timeout is present - it means it's a second consecutive click // on this same segment. Cancel timeout and consider it a double-click clearTimeout(item.clickTimeout); item.clickTimeout = undefined; console.log("Double-clicked", item); } } }] });