I can't follow most of your code, but one thing you mention suggests a
possible problem I can address. You say:
And in the layout, I have added this code witch works fine in the public
part and makes me to call twice functions *when I load page or fire any
event:*
<script type = "text/javascript">
google.charts.setOnLoadCallback(function(){
angular.bootstrap(document.body, ["privateProfileModule"]);
});
google.charts.load("current", {packages: ["corechart"]});
</script>
If google.charts.load() is called more than one time, it will complain that
you are calling it more than one time. This is currently a limitation
that we plan to resolve, but for now, you can only call
google.charts.load() one time in a page. If you are not loading any more
packages, then there is no need to call it anyway. But if you do need more
than one package, you currently have to load everything you will need in
one call.
If that doesn't help resolve your problem, I suggest you construct a much
simpler case, as simple as possible, to narrow down the problem. If you
can post it on jsfiddle so we can see it in operation, then we will have a
chance of debugging it.
On Wed, May 18, 2016 at 10:14 AM, <[email protected]> wrote:
> I want to add that if use this code on the head of my layout like in
> public part where ir works.
>
> <script type = "text/javascript">
> google.charts.setOnLoadCallback(function(){
> angular.bootstrap(document.body, ["privateProfileModule"]);
> });
> google.charts.load("current", {packages: ["corechart"]});
> </script>
>
>
> I can see the graphic but I get this error in firefox firebug and then you
> can see how calls to functions are duplicated:
>
>
> Error: google.visualization is undefined
> .link@http://gnsys.local/js/directives/private-google-chart-directives.js:80:8
> $/<@http://gnsys.local/js/angular.min.js:73:31
> aa@http://gnsys.local/js/angular.min.js:73:90
> K@http://gnsys.local/js/angular.min.js:62:39
> g@http://gnsys.local/js/angular.min.js:54:410
> g@http://gnsys.local/js/angular.min.js:54:433
> K@http://gnsys.local/js/angular.min.js:61:488
> g@http://gnsys.local/js/angular.min.js:54:410
> K@http://gnsys.local/js/angular.min.js:61:488
> g@http://gnsys.local/js/angular.min.js:54:410
> g@http://gnsys.local/js/angular.min.js:54:433
> g@http://gnsys.local/js/angular.min.js:54:433
> g@http://gnsys.local/js/angular.min.js:54:433
> K@http://gnsys.local/js/angular.min.js:61:488
> g@http://gnsys.local/js/angular.min.js:54:410
> W/
> <http://gnsys.local/js/angular.min.js:54:410W/><@http://gnsys.local/js/angular.min.js:53:480
> zc/d/
> <http://gnsys.local/js/angular.min.js:53:480zc/d/></<@http://gnsys.local/js/angular.min.js:20:99
> lf/this.$get
> <http://gnsys.local/js/angular.min.js:20:99lf/this.$get></n.prototype.$eval@http://gnsys.local/js/angular.min.js:133:217
> lf/this.$get
> <http://gnsys.local/js/angular.min.js:133:217lf/this.$get></n.prototype.$apply@http://gnsys.local/js/angular.min.js:133:446
> zc/d/
> <http://gnsys.local/js/angular.min.js:133:446zc/d/><@http://gnsys.local/js/angular.min.js:20:57
> e@http://gnsys.local/js/angular.min.js:39:191
> zc/d@http://gnsys.local/js/angular.min.js:19:480
> <http://gnsys.local/js/angular.min.js:39:191zc/d@http://gnsys.local/js/angular.min.js:19:480>
> zc@http://gnsys.local/js/angular.min.js:20:274
> Zd@http://gnsys.local/js/angular.min.js:19:83
> @http://gnsys.local/js/angular.min.js:293:238
> a@http://gnsys.local/js/angular.min.js:174:399
> Hf/c@http://gnsys.local/js/angular.min.js:35:212
> <http://gnsys.local/js/angular.min.js:174:399Hf/c@http://gnsys.local/js/angular.min.js:35:212>
>
> <div class="ng-isolate-scope" column-chart="" columns="rightChart.columns"
> data="rightChart.data" title-chart="rightChart.title" min="rightChart.min"
> max="rightChart.max" v-axis-title="rightChart.vAxis.title"
> tooltip-column="3" is-clicked="false" width="450" height="450"
> style="width: 100%; height: 100%">
> angular.min.js (línea 107)
> GET http://gnsys.local/js/dirPagination.tpl.html
> 200 OK
> 1ms
> angular.min.js (línea 93)
> POST
> http://gnsys.local/privado/report-querys-sql/reporteconsultas/rightpanel
> 200 OK
> 84ms
> angular.min.js (línea 93)
> GET http://gnsys.local/js/dirPagination.tpl.html
> 200 OK
> 295ms
> angular.min.js (línea 93)
> POST
> http://gnsys.local/privado/report-querys-sql/reporteconsultas/rightpanel
> 200 OK
> 90ms
> angular.min.js (línea 93)
> Pagination directive: the pagination controls (id: tQuery) cannot be used
> without the corresponding pagination directive, which was not found at link
> time.
>
>
>
>
> El miércoles, 18 de mayo de 2016, 12:18:20 (UTC+2), [email protected]
> escribió:
>>
>> I've got a terrible problem and I don't know why. I have a web
>> application divided in two parts, one part is public and the other part is
>> private. The public part works fine with Google Charts, but private part
>> works wrong because duplicate calls to other functions!!!
>>
>> To represent chart graphics I have defined the next directive:
>>
>>
>> privateApp.directive("columnChart", function(){
>>
>> return{
>>
>> restrict: "A",
>>
>> scope: {
>>
>> titleChart: "=",
>>
>> data: "=",
>>
>> columns: "=",
>>
>> min: "=",
>>
>> max: "=",
>>
>> vAxisTitle: "=",
>>
>> hAxisTitle: "=",
>>
>> tooltipColumn: "=",
>>
>> isClicked: "=",
>>
>> callbackFn: "&",
>>
>> width: "=",
>>
>> height: "="
>>
>> },
>>
>> link: function(scope, $elm, $attr){
>>
>> var data = new google.visualization.DataTable();
>>
>> //Definimos las columnas que va a tener nuestra tabla de datos
>>
>> for (var i = 0; i < scope.columns.length; i++){
>>
>> data.addColumn(scope.columns[i].tipo, scope.columns[i].nombreColumna);
>>
>> };
>>
>> var widthChart = 400;
>>
>> var heightChart = 400;
>>
>> if (scope.width != null)
>>
>> widthChart = scope.width;
>>
>> if (scope.height != null)
>>
>> heightChart = scope.height;
>>
>> scope.$watch("data", function (newValue, oldValue){
>>
>> scope.options = {
>>
>> width: widthChart,
>>
>> height: heightChart,
>>
>> bar: {groupWidth: "95%"},
>>
>> title: scope.titleChart,
>>
>> legend: {position: "none"},
>>
>> annotations: {
>>
>> alwaysOutside: true
>>
>> },
>>
>> chartArea : {left:50,top:50,width:'90%',height:'80%'},
>>
>> vAxis: {title: scope.vAxisTitle},
>>
>> hAxis: {title: scope.hAxisTitle, textPosition: "out"}
>>
>> };
>>
>> if (scope.data != null){
>>
>> //Eliminamos datos del DataTable
>>
>> data.removeRows(0, data.getNumberOfRows());
>>
>> //Insertamos filas a la tabla
>>
>> for (var i = scope.min; i <= scope.max; i++){
>>
>> data.addRow(scope.data[i]);
>>
>> };
>>
>>
>> var view = new google.visualization.DataView(data);
>>
>> //view.setColumns(cols);
>>
>> view.setColumns([0, 1,
>>
>> {
>>
>> calc: "stringify",
>>
>> sourceColumn: 1,
>>
>> type: "string",
>>
>> role: "annotation"
>>
>> },
>>
>> {
>>
>> calc: "stringify",
>>
>> sourceColumn: scope.tooltipColumn,
>>
>> type: "string",
>>
>> role: "tooltip"
>>
>> }]);
>>
>> var chart = new google.visualization.ColumnChart($elm[0]);
>>
>> //chart.draw(data, scope.options);
>>
>> chart.draw(view, scope.options);
>>
>> if (scope.isClicked){
>>
>> //Detectamos el clic sobre el gráfico
>>
>> google.visualization.events.addListener(chart, "click", selectHandler);
>>
>> }
>>
>> }
>>
>> });
>>
>>
>> scope.$watch("min", function (newValue, oldValue){
>>
>> scope.options = {
>>
>> width: 400,
>>
>> height: 400,
>>
>> bar: {groupWidth: "95%"},
>>
>> title: scope.titleChart,
>>
>> legend: {position: "none"},
>>
>> annotations: {
>>
>> alwaysOutside: true
>>
>> },
>>
>> chartArea : {left:50,top:50,width:'90%',height:'80%'},
>>
>> vAxis: {title: scope.vAxisTitle},
>>
>> hAxis: {title: scope.hAxisTitle, textPosition: "out"}
>>
>> };
>>
>> if (scope.data != null){
>>
>> //Eliminamos datos del DataTable
>>
>> data.removeRows(0, data.getNumberOfRows());
>>
>> //Insertamos nuevos datos en la tabla
>>
>> for (var i = scope.min; i <= scope.max; i++){
>>
>> data.addRow(scope.data[i]);
>>
>> };
>>
>> var view = new google.visualization.DataView(data);
>>
>> view.setColumns([0, 1,
>>
>> {
>>
>> calc: "stringify",
>>
>> sourceColumn: 1,
>>
>> type: "string",
>>
>> role: "annotation"
>>
>> },
>>
>> {
>>
>> calc: "stringify",
>>
>> sourceColumn: scope.tooltipColumn,
>>
>> type: "string",
>>
>> role: "tooltip"
>>
>> }]);
>>
>> var chart = new google.visualization.ColumnChart($elm[0]);
>>
>> chart.draw(view, scope.options);
>>
>> if (scope.isClicked){
>>
>> //Detectamos el clic sobre el gráfico
>>
>> google.visualization.events.addListener(chart, "click", selectHandler);
>>
>> }
>>
>> }
>>
>> });
>>
>> function selectHandler(e){
>>
>> var index;
>>
>> index = parseInt(e.targetID.substring("bar#0#".length,
>> e.targetID.length));
>>
>> scope.callbackFn({arg1: data.getValue(index, 4)});
>>
>> //alert(data.getValue(index, 4));
>>
>> }
>>
>> }
>>
>> };
>>
>> });
>>
>>
>> And in the layout, I have added this code witch works fine in the public
>> part and makes me to call twice functions when I load page or fire any
>> event:
>>
>>
>> <script type = "text/javascript">
>> google.charts.setOnLoadCallback(function(){
>> angular.bootstrap(document.body, ["privateProfileModule"]);
>> });
>> google.charts.load("current", {packages: ["corechart"]});</script>
>>
>>
>> You can check on the next picture the duplicate calls to the functions and
>> the final error that I get.
>>
>>
>>
>> <https://lh3.googleusercontent.com/-Hj-XyKePHKo/VzxBVcxxITI/AAAAAAAAAEg/0yL_KxIxhSYeVwBL8mACTqL0EExfVwbcwCLcB/s1600/Captura%2Bde%2Bpantalla%2Bde%2B2016-05-18%2B12%253A05%253A18.png>
>>
>> I don't have any idea why is happend this!!! Please, help me!!! Thank you in
>> advance!!!
>>
>> --
> You received this message because you are subscribed to the Google Groups
> "Google Visualization API" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To post to this group, send email to
> [email protected].
> Visit this group at
> https://groups.google.com/group/google-visualization-api.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/google-visualization-api/1fe2da3c-e487-42dd-8739-464ba0216bca%40googlegroups.com
> <https://groups.google.com/d/msgid/google-visualization-api/1fe2da3c-e487-42dd-8739-464ba0216bca%40googlegroups.com?utm_medium=email&utm_source=footer>
> .
>
> For more options, visit https://groups.google.com/d/optout.
>
--
Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2>
[email protected] <[email protected]> 5CC, Cambridge MA
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/CAOtcSJP8yoHEgNuhT2K88Darpf7JjVNp0CAiHxQYoKA1%3DkFZwQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
