Hi Guys,
The below extension points will make you X-axis labels font size, font style, thinkness, alignment & angled.
Resources :
1) http://redmine.webdetails.org/projects/5/wiki/FAQ_Main_Changes_New_Features_CCC_v2
2) http://forums.pentaho.com/showthread.php?165604-X-Axis-Lables-distance-from-Axis
extensionPoints:
{
baseAxisLabel_textAngle: -1.6,
baseAxisLabel_textBaseline: 'middle',
baseAxisLabel_textAlign: 'right',
baseAxisFont = "bold 13px sans-serif";
}
baseAxisFont: "12px sans-serif"
orthoAxisFont: "12px sans-serif"
extensionPoints:
["xAxisLabel_font","14px Serif"],
["xAxisLabel_textStyle","#b09a54"],
["yAxisRule_strokeStyle","rgba(0,0,0,0)"],
["yAxisLabel_font","14px Serif"],
["yAxisLabel_textStyle","#b09a54"],
["yAxisTick_strokeStyle","rgba(0,0,0,0)"],
["yAxisTicks_strokeStyle","rgba(0,0,0,0)"],
["bar_fillStyle",function(d){ return this.parent.index+1984 == anoParam?"#004767":"#b09954"}]],
extensionPoints:
"bar_fillStyle",function(d){ return
dashboardland.getColorForValue(render_bestsellerChart.chart.dataEngine.getVisibleCategories()
[this.parent.index]) }]
["barLabel_textStyle","#FFFFFF"],
["barLabel_font","16px sans-serif"],
["barLabel_text",function(d){return Math.round(parseInt(d)/1000000) + "M"}],
["barLabel_top",function(d) { return this.target.height()/3}]]
1. Remove x , y axis ... remove border
* By default when you create a chart you will get X-axis and Y-axis so you need not explicitly add X-axis and Y-axis.
* Removing X-axis :
Add below Extension Points :
xAxisRule_strokeStyle ='#e9f1f4';
xAxisTicks_strokeStyle = '#e9f1f4';
xAxisEndLine_strokeStyle='#ccd8dd';
* Removing Y-axis : Set below property to the chart component.
Ortho Axis Visible = False
* To remove the border of the chart set below property to the chart component
plot2FrameVisible=False
2. Print values vertically on X-axis
* Add below Extension points :
baseAxisLabel_textAngle=1.6
baseAxisLabel_textBaseline='middle'
baseAxisLabel_textAlign='right'
3. how to remove ticks of Axis ?
* Removing ticks can be achivable by setting below property
baseAxisTicks= False
4. what is ortho axis , orthoaxis 2 ?
Ortho Axis is nothing but Y axis.
Orthoaxis 2 is nothing but 2nd Y axis . i.e., you can treat it as a y axis right of the chart when you develop a mixed chart
(i.e., mixed chart = a bar chart + a line chart).
extensionPoints:
[["xAxisRule_strokeStyle","#e9f1f4"],
["yAxisRule_strokeStyle","#e9f1f4"],
["xAxisTicks_strokeStyle","#e9f1f4"],
["yAxisTicks_strokeStyle","#e9f1f4"],
["xAxisGrid_strokeStyle","#e9f1f4"],
["yAxisGrid_strokeStyle","#e9f1f4"],
["xAxisEndLine_strokeStyle","#ccd8dd"],
["yAxisEndLine_strokeStyle","#ccd8dd"],
["line_lineWidth","3"],
["dot_fillStyle","#FFFFFF"]],
Hide X-Axis lebels in a CCC line chart
preExecution
function() {
this.chartDefinition.yAxisLabel_visible = false;
}
No comments:
Post a Comment