FacetChart line shadows

[Niels_EMP]

How do i remove the shadows on the data lines in a FacetChart of type LINE?

FacetChart.setShowShadows(false) does not work.

[Niels_EMP]

I think I figured it out.

I set dataLineProperties to a DrawLine with a Shadow with blur set to 0.

Is this the intended way to remove shadows or is there an easier way?

public class EMPFacetChart extends FacetChart
{
	public EMPFacetChart(){
		super();
		DrawLine dataLineProperties = new DrawLine();
		Shadow shadow = new Shadow();
		shadow.setBlur(0);
		shadow.setOffset(new Point(0, 0));
		dataLineProperties.setShadow(shadow);
		this.setDataLineProperties(dataLineProperties);
	}
}

I have another question though.
I want to align the title of the chart to the left, but I can't figure out how.
I have fiddled around with the titleproperties DrawLabel but nothing seems to work.

/Niels

[Isomorphic]

Could you clarify how you want the title displayed - all the way on the left side of the chart?

If so, alignment properties won't do this since the DrawLabel for the title is only created to be as large as the title itself.

Two approaches:

1. Don't have the chart show a title at all, and create the title with an ordinary Label outside the Chart.

2. Use the approach shown in the "Adding Extra Elements" Chart sample to draw your own DrawLabel for the title.

[Niels_EMP]

I wanted it all the way to the left.

I got it working using the "Adding New Elements" example:

	protected class EMPFacetChart extends FacetChart
	{
		public EMPFacetChart(final String title){
			super();
			this.setWidth100();
			this.setHeight(400);
			this.setChartRectMargin(10);
			this.setPadding(10);
			this.setBandedBackground(false);
			this.setDataColors("#ADC2E5", "#527EBE", "#002F6B", "#88A96E", "#62BA97", "#BE1E2D", "#F47D55", "#FCC169", "#BE9C6E", "#AEAE98");
			this.setBackgroundColor("#FFFFFF");
			this.setShowShadows(false);
			this.setUseAutoGradients(false);
			
			// Set title to something other than empty string or blank space to prevent graph from growing into new title.
			this.setTitle(".");
			
			// Set title font color to white to hide it
			DrawLabel titleProperties = new DrawLabel();
			titleProperties.setLineColor("#FFFFFF");
			titleProperties.setFontFamily("agendaregular, Verdana, Arial, sans-serif");
			this.setTitleProperties(titleProperties);
			
			// Remove column/bar outline
			DrawRect barProperties = new DrawRect();
			barProperties.setLineOpacity(0);
			
			this.setBarProperties(barProperties);
			// Wider bar margin
			this.setBarMargin(20);
			
			// Remove dataline shadow
			Shadow shadow = new Shadow();
			shadow.setBlur(0);
			shadow.setOffset(new Point(0, 0));
			
			DrawLine dataLineProperties = new DrawLine();
			dataLineProperties.setLineWidth(5);
			dataLineProperties.setShadow(shadow);
			this.setDataLineProperties(dataLineProperties);
			
			// Disable right-click contextmenu
			this.addShowContextMenuHandler(new ShowContextMenuHandler() {
				@Override
				public void onShowContextMenu(ShowContextMenuEvent event) {
					event.cancel();
				}
			});
			
			// Insert title
			this.addChartBackgroundDrawnHandler(new ChartBackgroundDrawnHandler() {
				
				@Override
				public void onChartBackgroundDrawn(ChartBackgroundDrawnEvent event) {
					DrawLabel newTitle = new DrawLabel();
					newTitle.setContents(title);
					newTitle.setLineColor("#000000");
					newTitle.setFontFamily("agendaregular, Verdana, Arial, sans-serif");
					
					EMPFacetChart.this.addDrawItem(newTitle, true);
				}
			});
		}
	}

The only slight problem is that when I set the original title to the empty string, the data rect of the chart expands and covers my new DrawItem title.

I solved this by setting the original title to "." and painting it white like the background. This there a more elegant solution to this?

Thanks for the help.

/Niels

[Isomorphic]

A blank space or  

[Niels_EMP]

A blank space gave the same result as an empty string, and   just showed up as the title.

[Isomorphic]

Ah, sorry, the problem is that the FacetChart measures the rendered size of the title and leaves just enough space to fit it. If the title is blank text, the browser reports its rendered height as very small, so too little room is left for your title.

Your solution is fine, another would be to increase the top-side padding.

[Niels_EMP]

Okay, thanks.

I'll just stick to my solution.