Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

after resizing piecharts with transition_duration 0 , the opacity is still 0 #3204

Open
tjohannto opened this issue May 4, 2023 · 1 comment

Comments

@tjohannto
Copy link

tjohannto commented May 4, 2023

Description

I have a constant reproducible error when using the resize function if the chart is a piechart. Although I set the transition_duration to 0 before calling the resize function, the chart has an opacity of 0 immediately after calling the function.
The problem occurs when I have multiple charts in one dashboard. These charts have different chart types, but the error only occurs with pie charts.
With single piecharts the error occurs only extremely rarely.

This resize function is used in an export process using Promises and right now the SVG is not visible when exporting.

We have this issue since update to a version >= v3.7. Before that it worked properly

Steps to check or reproduce

in principle, this is what I am using:

const charts: Array<HTMLDivElement> = d3Select("#content-area").selectAll("div.chart-container").nodes() as Array<HTMLDivElement>;
const promiseArray: Array<IChartExportPromise> = chartsArray.map((chart: HTMLElement, chartIndex: number) => {
	const node: SVGElement = d3Select(chart).select("div.chart").select('svg').node() as SVGElement;
	//dummy size, normally this is being computed
	const chartWidth: number = 1920
	const chartHeight: number = 1080;
	return new Promise(resolve => {

		const nodeSelection: d3Selection<SVGElement, any, HTMLDivElement, any> = d3Select(node);
		//fix weird backfill
		nodeSelection.selectAll("path").attr("fill", "none");

		let svgString: string;
		// the bb chart object is allocated to the HTML element using angularJS
		const bbChart: ChartModel = angularElement((node.parentNode as HTMLDivElement)).data();
		
		//resize to adapt/change aspect ratio
		const transition:number = bbChart.config('transition_duration');
        bbChart.config('transition_duration', 0)
        bbChart.resize({
          height: chartHeight,
          width: chartWidth
        });
		//added for testing, did not have any effect
        bbChart.flush(false);
        bbChart.config('transition_duration', transition);

		svgString = bbChart.export();
		[...]       
    });
});
@netil
Copy link
Member

netil commented May 8, 2023

Hi @tjohannto, can you provide reproducible working example?

From your comment, it seems affected by some changes from v3.7 and the issue can happen with the combination of different option. To figure out the cause, need reproducible generation option.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants