Apr 11, 2018, 5:04 PM
PolarChart
Greetings to the whole community, I have a problem with the PolarChart.
What I want to achieve is to hide part of PolarChart if the value is 0.
I have a JavaScript function "suprimirEtiquetaPie" that hides part of PolarChart if the value is 0, it worked with version 2.5 but with 4.5.1 it does not work
My code is:
<ext:Panel ID="panelPieChart1" runat="server" ColumnWidth=".5" Border="false" BodyStyle="background-color:white" MarginSpec="0 0 0 40">
<Bin>
<ext:ChartTheme ID="MyChartTema1" runat="server" ThemeName="MiTema1">
<CustomConfig>
<ext:ConfigItem Name="colors" Value="['#008000', '#92C4D1', '#A96D30', '#FF8000', '#E44444', '#008000', '#FF0000', '#035003']" Mode="Raw" />
</CustomConfig>
</ext:ChartTheme>
</Bin>
<Items>
<ext:PolarChart ID="chart1" runat="server" Width="330" Height="340" Animation="true" Shadow="true" InsetPadding="20" Theme="MiTema1">
<Store>
<ext:Store ID="storePermisoEstado" runat="server" AutoDataBind="true">
<Model>
<ext:Model ID="modelPermisoEstado" runat="server">
<Fields>
<ext:ModelField Name="Cant_Hijos" />
<ext:ModelField Name="Estado_Obra_Nombre" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Interactions>
<ext:ItemHighlightInteraction />
<ext:RotateInteraction />
</Interactions>
<Series>
<ext:PieSeries AngleField="Cant_Hijos"
Donut="40"
Highlight="true"
HighlightMargin="10">
<Label Field="Estado_Obra_Nombre" Display="Inside" Orientation="Horizontal" Color="white" FontSize="11px" FontFamily="Helvetica, sans-serif">
<Renderer Fn="suprimirEtiquetaPie" />
</Label>
</ext:PieSeries>
</Series>
</ext:PolarChart>
</Items>
</ext:Panel>
JavaScript:
function suprimirEtiquetaPie(valor) {
var valores = valor.split(",");
var nuevoValor = valores[1].trim();
var estado = valores[0].trim();
if (estado == "En proceso de cumplimiento") {
estado = "En proceso"
}
if (nuevoValor == "0") {
nuevoValor = "";
} else {
nuevoValor = estado + ", " + nuevoValor;
}
return nuevoValor;
}
Please I need your help
What I want to achieve is to hide part of PolarChart if the value is 0.
I have a JavaScript function "suprimirEtiquetaPie" that hides part of PolarChart if the value is 0, it worked with version 2.5 but with 4.5.1 it does not work
My code is:
<ext:Panel ID="panelPieChart1" runat="server" ColumnWidth=".5" Border="false" BodyStyle="background-color:white" MarginSpec="0 0 0 40">
<Bin>
<ext:ChartTheme ID="MyChartTema1" runat="server" ThemeName="MiTema1">
<CustomConfig>
<ext:ConfigItem Name="colors" Value="['#008000', '#92C4D1', '#A96D30', '#FF8000', '#E44444', '#008000', '#FF0000', '#035003']" Mode="Raw" />
</CustomConfig>
</ext:ChartTheme>
</Bin>
<Items>
<ext:PolarChart ID="chart1" runat="server" Width="330" Height="340" Animation="true" Shadow="true" InsetPadding="20" Theme="MiTema1">
<Store>
<ext:Store ID="storePermisoEstado" runat="server" AutoDataBind="true">
<Model>
<ext:Model ID="modelPermisoEstado" runat="server">
<Fields>
<ext:ModelField Name="Cant_Hijos" />
<ext:ModelField Name="Estado_Obra_Nombre" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Interactions>
<ext:ItemHighlightInteraction />
<ext:RotateInteraction />
</Interactions>
<Series>
<ext:PieSeries AngleField="Cant_Hijos"
Donut="40"
Highlight="true"
HighlightMargin="10">
<Label Field="Estado_Obra_Nombre" Display="Inside" Orientation="Horizontal" Color="white" FontSize="11px" FontFamily="Helvetica, sans-serif">
<Renderer Fn="suprimirEtiquetaPie" />
</Label>
</ext:PieSeries>
</Series>
</ext:PolarChart>
</Items>
</ext:Panel>
JavaScript:
function suprimirEtiquetaPie(valor) {
var valores = valor.split(",");
var nuevoValor = valores[1].trim();
var estado = valores[0].trim();
if (estado == "En proceso de cumplimiento") {
estado = "En proceso"
}
if (nuevoValor == "0") {
nuevoValor = "";
} else {
nuevoValor = estado + ", " + nuevoValor;
}
return nuevoValor;
}
Please I need your help
Last edited by jhuamani; Apr 12, 2018 at 5:05 PM.