[Google Maps Mobile] Google Maps Mobile - I am completely clueless

[Google Maps Mobile] Google Maps Mobile - I am completely clueless

  
Forge Component
(9)
Published on 11 Oct (10 days ago) by Labs
9 votes
Published on 11 Oct (10 days ago) by Labs

Hi everybody,

I've been using the OutSystems platform for almost 2 weeks now, really starting to get the hang of it. Worked my way though a lot of the online courses and have watched almost every video on their channel! For someone like me who has no experience in any programming/coding/app development its been really rewarding to figure out how to achieve what I want to do.

I've been playing around making basic apps using out-of-the-box components and following the To Do and Planet guides but i'm now trying to make an using Google Maps Mobile. I just cant figure out what i'm supposed  to do with it to get it to function and be able to manipulate it.

I tried to use it when I first started using outsystems, but even now that I have some understanding of the platform and have looked at anything related on the forums but I don't know where to put it, how to use it and how to interpret the documentation on google. Completely clueless!

If anyone would be so kind to direct me to any documentation i may not have caught? This one I found: 

http://apps.outsystems.com/GoogleMapsDemo/Instructions.aspx still leaves me confused as it's Web specific. Or if there's no other documentation, perhaps a walkthrough on how to use it in a basic way like programming address input? 


PS. Also took a look at the Uber app, still unsure.


Thank you!


Hello OZOZ

Without any kind of experience prior to OutSystems, you may do good by going a little slower.
For example, the link you provided is for WEB, not mobile. Things will be just a little bit different, but enough to be misleading and cause a lot of frustration.

To make things worse, while it is not mandatory to understand JavaScript, it would be of greate help, as some of the things you may need to do will require JavaScript.

I recommend take a look in this app in forge: 

https://www.outsystems.com/forge/component/1943/google-maps-plugin-demo/

It is for a different component (Google Maps Plugin), but it is an example, so you can see it working and investigate the code.

Hope this can help you advance in your studies.

Good programing!

Hi Ozoz,

Here's a few quick steps to get you up and running:

  1. Install the GoogleMapsMobile component from the Forge;
  2. Create a new Mobile App or open an existing one;
  3. Reference the Map Block from GoogleMapsMobile;
  4. Create a new Mobile Screen;
  5. Add the Map Block to the Screen (e.g. by dragging it onto the canvas);
  6. Set the right Input Parameters for the Map Block:
    1. APIKey is a valid API key that you must request from Google (see e.g. here);
    2. Specify a valid CenterLatitude and CenterLongitude. If you omit this, you'll see a grey area only;
    3. Specify a valid ZoomLevel (e.g. 16);
    4. Specify a Handler for the MapOnError event. Inside the Screen Action, put a Message that shows the ErrorMessage Input Parameter. This helps you tracking down any errors the map produces.

After these steps you should have a full screen Google Maps map on a mobile screen. From there you can start playing with it, Google around for all the options etc.

Eduardo Jauch wrote:

Hello OZOZ

Without any kind of experience prior to OutSystems, you may do good by going a little slower.
For example, the link you provided is for WEB, not mobile. Things will be just a little bit different, but enough to be misleading and cause a lot of frustration.

To make things worse, while it is not mandatory to understand JavaScript, it would be of greate help, as some of the things you may need to do will require JavaScript.

I recommend take a look in this app in forge: 

https://www.outsystems.com/forge/component/1943/google-maps-plugin-demo/

It is for a different component (Google Maps Plugin), but it is an example, so you can see it working and investigate the code.

Hope this can help you advance in your studies.

Good programing!

Hi Eduardo,

Yes i'm realizing that even with so much documentation available on Google's end in regards to using their api's etc, as it's not OutSystems specific and dealing with a lot of code it does leave me very frustrated because I don't understand! I'm able to create a screen with a map with lat/long values and it was successful, but other than that im still lost. I took a look at the forge component you linked and it looked promising, however I get an "undefined is not an object (evaluating 'plugin.google.maps')" error. Even then, trying to deconstruct the app and understand seemed futile for me. 

Like you said I need to go a little slower and understand things better. I will look into learning Javascript as I see it referenced a lot. Do you have any other tips on what I should be learning to help me implement this into my app?


Thank you for your advice!


Kilian Hekhuis wrote:

Hi Ozoz,

Here's a few quick steps to get you up and running:

  1. Install the GoogleMapsMobile component from the Forge;
  2. Create a new Mobile App or open an existing one;
  3. Reference the Map Block from GoogleMapsMobile;
  4. Create a new Mobile Screen;
  5. Add the Map Block to the Screen (e.g. by dragging it onto the canvas);
  6. Set the right Input Parameters for the Map Block:
    1. APIKey is a valid API key that you must request from Google (see e.g. here);
    2. Specify a valid CenterLatitude and CenterLongitude. If you omit this, you'll see a grey area only;
    3. Specify a valid ZoomLevel (e.g. 16);
    4. Specify a Handler for the MapOnError event. Inside the Screen Action, put a Message that shows the ErrorMessage Input Parameter. This helps you tracking down any errors the map produces.

After these steps you should have a full screen Google Maps map on a mobile screen. From there you can start playing with it, Google around for all the options etc.


Hi Kilian,

I should have mentioned I was able to do this when first trying the component, as its required input (decimal/integer) is pretty straightforward. Nonetheless, a big thank you for your step by step, I wish there was a guide like this for everything!

For the API key, I created an account and had one sitting there since I started using OutSystems. In the input I entered my API key as "Alzaxxxxx". If im honest, I don't know what to do with it from there. When I load up my app, I head over to the dev console on google and see if anything I changing, but my guess is that because I'm not actually doing anything with the maps in the application apart from specifying the lat/long and zoom, nothing is being fed back to the console/api?

I tried looking into something that seems simple enough like creating a marker on the map, and when I hover over the input i see "Required Type: MapMarker List". I did a search for this and the "MapMarker" structure showed up. I can see that within the structure area are all the variables(?) needed to create a marker on the map like lat/long, address and marker options. Am I wrong in thinking that I would need to feed data into those structure entities(?), then feed that list into the "Markers" in the main component?

If so, there's my problem, I wouldn't know how to do that! Any documentation you can point me to so i can get a better overall understanding?

Okay so a little update:

I created a local variable and set the data type to "MapMarker". From this, when I now look at the variable, I see all the parameters:


Then I created a screen action and added an "assign". My thought here is that if the screen action were assigned to a button for example, when you press that button it would assign the values into that list. For example:


Then after doing that, I would go to the maps component and set the "Marker" input to the variable I just created:

Now I get the error above. This is the way that makes the most sense to me at the moment, am I completely off or on the right track?

Thank you

Hi Ozoz,

I think at this point your general OutSystems skills are lacking. A "List" of things is a very basic concept in OutSystems, and if you're confused by the difference between a Structure and a List of that Structure, I would strongly advise you to take the online courses available here, so you're a bit more proficient in the very basics of the Platform.

Kilian Hekhuis wrote:

Hi Ozoz,

I think at this point your general OutSystems skills are lacking. A "List" of things is a very basic concept in OutSystems, and if you're confused by the difference between a Structure and a List of that Structure, I would strongly advise you to take the online courses available here, so you're a bit more proficient in the very basics of the Platform.

Hi Kilian,

I feel that's fair to say. I think i was getting a bit ahead of myself as I had an app idea revolving around the use or Google Maps and wanted to get started on using it as soon as possible. I will go back to basics and complete these courses, hopefully once i'm done i'll understand what needs doing. I appreciate your help very much.

Solution

I understand how you feel, OutSystems is a great and easy-to-learn platform, and apps can be created much easier than using, say, Java on Android, but you need at least some backing knowledge. I'm sure once you've completed the courses, everything will fall into place and you'll be building apps in no-time :).

Solution

I will be back with the same questions if all else fails!

No problem, we'll be hear waiting :).