Legend hidden when inserted as a child component.

[hpmohan]

Hi team,

1. Is it possible to always show the tooltip without a mouseover?
2. When the same doughnut chart is inserted as a child component, the legends are not visible anymore. Is it a bug?

Steps to Reproduce:

• copy the DOUGHNUT chart code sample from LWCC samples.
• Paste the same into a component and view the same from a community.
• Legends are visible.
• Create another component and put the above component as a child cmp.
• Legends are no longer visible

[victorgz]

Hi @hpmohan , thanks for using the library !

I'm trying to reproduce the error from my side but it seems working fine. If I understood well, your problem could be reproduced with this configuration:

Parent cmp

<template>
	<div class="slds-card">
		<h1>Parent Component</h1>
		<c-child-chart></c-child-chart>
	</div>
</template>

Child cmp

<template>
	<div class="slds-card" style="border: 1px solid lightgrey">
	<h1>Child component</h1>
		<c-chart type="doughnut" responsive="true">
			<c-dataset labels='["OK", "WARNING", "CRITICAL", "UNKNOWN"]'>
				<c-data label="# of Tomatoes" detail="[12, 19, 3, 5]" backgroundcolor='[
					"rgba(14, 110, 206, 1)",
					"rgba(45, 156, 237, 1)",
					"rgba(104, 206, 238, 1)",
					"rgba(150, 242, 238, 1)"]'>
				</c-data>
			</c-dataset>
			<c-title text="Doughnut Chart"></c-title>
			<c-legend position="left"></c-legend>
			<c-arc-configuration bordercolor="rgba(7, 62, 146, 0.7)"></c-arc-configuration>
		</c-chart>
	</div>
</template>

When I place the parent component in a community page, the chart is displayed with the legend:

• Can you please try the code above and let us know please?
• Just to double-check: are you using a LWR site?