-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hi All, I am new to ZUl and trying to implement the below code.
<zk xmlns:h="native">
<window id="win" border="none" width="100%" height="100%"
hflex="min" style="background-color:green">
<h:script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></h:script>
<h:script type="text/javascript">
google.charts.load("current", {packages:["corechart"]});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Task', 'Hours per Day'],
['Automation', 11],
['Manual', 2],
['Report', 2],
['Payroll', 2],
['MISC', 7]
]);
var options = {
title: 'My Daily Work Activities',
is3D: true,
};
var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
chart.draw(data, options);
}
</h:script>
</window>
</zk>
However whenever I am running this code I am not getting. I am able to see only the screen which is showing processing. Can anyone please help me in executing this code or let me any other way to implement Javascript.
Hello Anubhav,
Please find below a working example i built from various sources:
<zk xmlns:h="native" xmlns:zk="zk" xmlns:w="client">
<window>
<html>
</html>
<timer repeats="true" delay="600000" onTimer=""/>
<vlayout>
<hlayout style="text-align:center"><label style="font-size:16px" value="Google Chart Pie"></label></hlayout>
<h:div id="chart_div" style="width: 900px; height: 500px;"></h:div>
<script type="text/javascript" src="http://www.google.com/jsapi?fake=.js"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Task', 'Hours per Day'],
['Work', 11],
['Eat', 2],
['Commute', 2],
['Watch TV', 2],
['Sleep', 7]
]);
var options = {
title: 'My Daily Activities'
};
alert(document.getElementById('chart_div'));
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</vlayout>
</window>
</zk>
Best Regards,
Darksu
Asked: 2016-07-19 09:28:44 +0800
Seen: 72 times
Last updated: Jul 24 '16
How to deactivate load on demand in a tree component?
How to remove html code from response
Facing issue in masking on phone [closed]
coerceFromString_ override no longer works from 6.5.1 [closed]
Execute Javascript on component visible
Is there a way to resolve view model properties as input to client side javascripts?