Sep 14, 2016, 7:46 AM
[CLOSED] 3D pie chart: rotate & itemclick (IE vs. Firefox)
Rotating the chart in IE works fine, but in Firefox it will also trigger the ItemClick. The ItemClick works as expected in IE - only when you click (with no rotation action).
How can I fix the Firefox behaviour?
How can I fix the Firefox behaviour?
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
Ext.define('Ext.chart.series.Pie3D', {
override: 'Ext.chart.series.Pie3D',
updateLabelData: function ()
{
return true;
}
});
</script>
<script runat="server">
protected void Page_Load( object sender, EventArgs e )
{
if ( !X.IsAjaxRequest )
{
this.storeDestinations.DataSource = this.Data;
this.storeDestinations.DataBind();
}
}
private object[] Data
{
get
{
return new object[]
{
new object[] { "3m Co", 270 },
new object[] { "Alcoa Inc", 253 },
new object[] { "Altria Group Inc", 217 },
new object[] { "American Express Company", 58 },
new object[] { "American International Group, Inc.", 53 },
new object[] { "AT&T Inc.", 30 },
new object[] { "Boeing Co.", 24 },
new object[] { "Caterpillar Inc.", 21 },
new object[] { "Citigroup, Inc.", 14 },
new object[] { "Exxon Mobil Corp",180 }
};
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager runat="server" />
<ext:Panel runat="server" Width="650" Height="500" Layout="FitLayout">
<Items>
<ext:PolarChart ID="chartDestinations" runat="server" Animation="true" Shadow="true" Flex="1">
<Background Fill="#FFFFFF"></Background>
<LegendConfig runat="server" Dock="Right" BoxStrokeWidth="0" />
<Store>
<ext:Store ID="storeDestinations" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="Destination"></ext:ModelField>
<ext:ModelField Name="Calls"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Interactions>
<ext:RotatePie3DInteraction />
</Interactions>
<Series>
<ext:Pie3DSeries Donut="40" AngleField="Calls" ShowInLegend="true" Highlight="true" Colors="#94AE0A,#115FA6,#A61120,#FF8809,#FFD13E,#A61187,#24AD9A,#7C7474,#A66111,#222222">
<Label Field="Destination" Display="Rotate" Font="16px Arial">
<Renderer Handler="return '';"></Renderer>
</Label>
<Tooltip ID="Tips1" TrackMouse="true" runat="server" Width="220" Height="28">
<Renderer Handler="toolTip.setHtml(record.get('Destination') + ': ' + record.get('Calls'));"></Renderer>
</Tooltip>
<Listeners>
<ItemClick Handler="alert('ItemClick');"></ItemClick>
</Listeners>
</ext:Pie3DSeries>
</Series>
<Plugins>
<ext:ChartItemEvents runat="server" />
</Plugins>
</ext:PolarChart>
</Items>
</ext:Panel>
</form>
</body>
</html>
Last edited by fabricio.murta; Sep 16, 2016 at 7:07 PM.
