Colors of my new chart dissapear after clearAll

Suite and Optimus Suite 5
#1

Hi,
I have a chart where I add two series to it. I want to remove a serie when I click on a button, but I have read that it wasn’t possible. So What i will do is repaint the graph without adding the second serie.

when I click on a button it call a function that I made:

function filter(cat,color){ chart.clearAll(); chart = createChart(cat,color); chart.load("../../../ProcessDescriptor/descriptor/L2/HRB/HRB_grafiek_woon_werk_provwoonpl_cat.xml"); }

this will clear my previous chart and will recreate my chart calling the function createChart():

[code]function createChart(cat,colorBar){
chart = new dhtmlXChart({
view: “bar”,
container: document.getElementById(“chart1”),
value: “#”+cat+“#”,
color: colorBar,
width: 40,
label: “#”+cat+“#”,

    tooltip: {template: "#"+cat+"#"}
    ,xAxis: { width: 120,template: "#cprov_rr#",title:"Aantallen per provincie van de woonplaats"	}
	
	,legend: { width: 20,
				align: "center",
				valign: top,
				marker: {type: "round",
						width: 10},
				values: [{text: "Offr", color: "#FF0000"},
						 {text: "OOffr", color: "#6699FF"},
						 {text: "Vrijw", color: "#FFFF66"}
						 
						 ]}
	});
return chart;

}[/code]

Now I don’t add the two series. It works a bit, but not everything. I see the tooltip and the label of the bars like I want, but the bars itself doesn’t appear. See picture docs.google.com/file/d/0B3-Cnf0 … 001elVxN3c

#2

Hi
To redraw thу chart you don’t need to use clearAll, you can just parse the data again
See my sample

[code]

Label template html,body { height: 100%; margin: 0px; overflow: hidden; } 
    </style>
    <script>
        function doOnLoad(){
            formData = [{
                type: "settings",
                position: "label-left",
                inputWidth: 100
            }, {
                type: "input",
                name: "inp1",
                value: 20
            },  {
                type: "input",
                name: "inp2",
                value: 30
            },  {
                type: "input",
                name: "inp3",
                value: 40
            }, {
                type: "button",
                value: "Count",
                id: "btn",
                name: "btn",
                width: 105
            }, {
                type: "button",
                value: "Clear",
                id: "btn_cl",
                name: "btn_cl",
                width: 105
            }];
            myForm = new dhtmlXForm("form1", formData);
            pieChart =  new dhtmlXChart({
                    view:"pie",
                    container:"chart1",
                    value:"#sales#",
                    label:function(obj){
                        var sum = pieChart.sum("#sales#");
                        var text = Math.round(parseFloat(obj.sales)/sum*100)+"%";
                        return "<div class='label' style='border:1px solid "+obj.color+"'>"+text+"</div>";
                    },
                    color:"#color#",
                    legend:{
                        width: 75,
                        align:"right",
                        valign:"middle",
                        template:"#month#"
                    }
                });
            my_dataset = [
                { sales: 20, month:"area1", color: "#ee3639" },
                { sales: 30, month:"area2", color: "#ee9e36" },
                { sales: 40, month:"area3", color: "#eeea36" }
            ];
            pieChart.parse(my_dataset,"json");


            myForm.attachEvent("onButtonClick", function(id){
                if(id=="btn"){
                    my_dataset[0].sales = myForm.getItemValue("inp1");
                    my_dataset[1].sales = myForm.getItemValue("inp2");
                    my_dataset[2].sales = myForm.getItemValue("inp3");
                    pieChart.parse(my_dataset,"json");
                }
                if(id=="btn_cl"){
                    pieChart.clearAll();
                }
            })
        }
    </script>
</head>
<body onload="doOnLoad()">
    <div id="chart1" style="width:400px;height:350px;border:1px solid #A4BED4; float: left"></div>
    <div id="form1" style="width:110px;height:170px;border:1px solid #FFC000; float: left; margin-left: 10px; text-align: center">
        Change the values and click the button
    </div>
</body>
[/code]