B4J Question Google Charts Raise Event

Harris

Expert
Licensed User
Longtime User
How do I raise an event to return a result when a line chart item is clicked?
For example, a line point (row, col (x,y) - or preferably index) and have it return the value(s) to my sub...

I would then take this position and plot it on a google map (ie change the map marker color).


B4X:
        google.visualization.events.addListener(chart, 'select', selectHandler);
       
        function selectHandler() {
          var selection = chart.getSelection();
          var message = '';
          for (var i = 0; i < selection.length; i++) {
            var item = selection[i];
            if (item.row != null && item.column != null) {
              var str = data.getFormattedValue(item.row, item.column);
              message += '{row:' + item.row + ',column:' + item.column + '} = ' + str + '\n';
            } else if (item.row != null) {
              var str = data.getFormattedValue(item.row, 0);
              message += '{row:' + item.row + ', column:none}; value (col 0) = ' + str + '\n';
            } else if (item.column != null) {
              var str = data.getFormattedValue(0, item.column);
              message += '{row:none, column:' + item.column + '}; value (row 0) = ' + str + '\n';
            }
          }
          if (message == '') {
            message = 'nothing';
          }
          alert('You selected ' + message);
        //  ${selected} = message;
         
        };

The above produces a nice alert with all the data needed... but how to save as B4J var that I can access?

Thanks
 
Last edited:

Harris

Expert
Licensed User
Longtime User
Web with ABMaterial.
I guess I could save it as a cookie in js and retrieve it in B4J code?
 
Upvote 0

alwaysbusy

Expert
Licensed User
Longtime User
In the javascript (note the eventname must be lowercase):
B4X:
b4j_raiseEvent('page_parseevent', {'eventname': 'yourchartname' + '_chartitemclicked','eventparams': 'message', 'message': message});

in B4J catch it:
B4X:
Sub YourChartName_ChartItemClicked(Message as string)

End sub
 
Upvote 0

Harris

Expert
Licensed User
Longtime User
JS:

B4X:
             b4j_raiseEvent('page_parseevent', {'eventname': 'chart' + '_chartitemclicked','eventparams': 'message', 'message': message});

logs...

B4X:
Page Parse Event: ecmviewPage   - (MyMap) {eventparams=message, message={row:1019,column:1} = 58.8
, eventname=chart_chartitemclicked}
chart item clicked event
Page Parse Event: ecmviewPage   - (MyMap) {eventparams=toastid, toastid=toast6, eventname=page_toastdismissed}

b4j event raised...

B4X:
Sub chart_chartitemclicked(Message As String)

Log(" chart item clicked event")
Toast("Chart clicked: "&Message,5000)


End Sub

Sweet...
Event was raised with params... I can now work with this in whatever fashion I choose.
Beats the heck out of my ill-conceived notion...

Amazing how simple this is when you know what the heck it is you are doing (trying to accomplish).

Thanks!
 
Upvote 0

alwaysbusy

Expert
Licensed User
Longtime User
Nicely done. The trick would now be to make the 'chart' + '_chartitemclicked' variable, so you cna use it for mutiple charts. For that you waould need to know the components id and replace the 'chart' part with it:

something like ${internalID} +'_chartitemclicked' if you use an ABMCustomComponent class.
 
Upvote 0
Top