WEBVTT 00:00.080 --> 00:00.800 Welcome back. 00:00.800 --> 00:06.480 In this video we're going to learn how to configure the initial camera position in Google Maps. 00:06.480 --> 00:15.160 When using Google Maps, we need to set and configure the initial camera position, which determines 00:15.160 --> 00:23.440 where the map will be centered and at what zoom level when it first loads. 00:23.680 --> 00:35.080 If we load our application, it loads at the equator, and at this zoom level we can make zoom at what 00:35.360 --> 00:36.560 whatever we want. 00:36.600 --> 00:44.440 But the initial loading is at this zoom level and at this position. 00:44.440 --> 00:51.120 Let me create here Singapore coordinates the latitude and longitude. 00:51.120 --> 00:56.400 Here you can notice that Singapore is of type lat long. 00:56.600 --> 01:03.720 The lat long represents a geographic location with latitude and longitude. 01:04.000 --> 01:11.360 If we go to the latitude declaration, we can notice that the latitude is of type double and the longitude 01:11.360 --> 01:13.240 is of type double. 01:13.400 --> 01:22.040 So this type of variables represent a geographic location with latitude and longitude. 01:22.080 --> 01:30.280 We can set the let 1.35 and the long longitude 103.87. 01:30.320 --> 01:30.800 Okay. 01:30.960 --> 01:43.720 Now let me determine the zoom level and the camera position val camera position state equals to remember 01:43.840 --> 01:53.160 camera position state set the position equals to camera position dot from lat long zoom. 01:53.480 --> 02:02.360 We need to set the latitude which is the Singapore and the zoom level which is ten F. 02:02.520 --> 02:06.650 Let me explain before running the camera position. 02:06.650 --> 02:16.570 If we click Ctrl and left mouse defines the viewport of the map, including the target, the target 02:16.570 --> 02:17.330 which is the. 02:18.050 --> 02:21.450 It's of type lat, long latitude and longitude. 02:21.730 --> 02:26.970 Zoom level float between 0 and 21. 02:27.130 --> 02:35.770 Tilt angle of a view 0 to 90 degrees and burning 0 to 360 degrees. 02:36.050 --> 02:46.050 The remember camera position state a composable function that creates and remembers the camera state. 02:46.090 --> 02:54.330 Okay, so here we have the longitude and latitude zoom Singapore and ten F. 02:54.370 --> 02:56.130 This is the starting point. 02:56.370 --> 03:00.810 This is the lat long zoom ten F zoom okay. 03:00.850 --> 03:04.090 In order to assign this attribute. 03:04.130 --> 03:07.730 and this parameter to the Google map. 03:07.970 --> 03:17.570 Here we need to set the camera position state to the camera position state variable that we created 03:17.570 --> 03:18.210 before. 03:18.250 --> 03:22.530 Okay, so what we did here, we created two things. 03:22.890 --> 03:30.170 The first one is the Singapore which is the lat long variable latitude and longitude. 03:30.210 --> 03:34.370 This is for Singapore and the camera position state. 03:34.770 --> 03:40.810 This determines the camera position and the zoom level of our Google map. 03:41.010 --> 03:48.210 The first thing is centered Singapore and the zoom level is ten F. 03:48.450 --> 03:57.330 In order to use this zoom and camera position state, we use the camera position state parameter and 03:57.330 --> 04:01.050 assign it to the variable that we just created here. 04:01.090 --> 04:07.730 Let me stop the app, run it again, and you can notice that we are centered. 04:07.730 --> 04:15.850 Our map is centered in Singapore and the zoom level is set it to ten. 04:16.490 --> 04:17.050 Okay. 04:17.250 --> 04:20.130 This is our application. 04:20.130 --> 04:29.930 This is how we set the initial state, the initial position and the initial zoom level of our Google 04:30.090 --> 04:30.690 map. 04:30.730 --> 04:31.250 Okay. 04:31.450 --> 04:34.610 You can set it to for example, five F. 04:34.770 --> 04:36.330 Let me check it again. 04:36.450 --> 04:39.330 You can notice that we are zooming out. 04:39.490 --> 04:45.250 If we increase it to like 20 for example run it again. 04:45.290 --> 04:47.130 Here we zoomed in. 04:47.250 --> 04:47.810 Okay. 04:47.970 --> 04:49.970 Scroll up zoom out. 04:50.010 --> 04:52.610 We can notice that we are on Singapore. 04:52.650 --> 04:53.210 Okay. 04:53.410 --> 04:59.970 So this is how we define the initial state of our Google map. 05:00.090 --> 05:03.250 Also we can define other variables. 05:03.490 --> 05:05.170 Let me show you here. 05:05.210 --> 05:10.210 Let me comment this and let me create here. 05:10.250 --> 05:15.370 Val camera position I can make it as my camera position. 05:15.370 --> 05:19.730 My camera position equals to remember. 05:19.850 --> 05:26.930 And here create a new camera position variable having four parameters. 05:27.210 --> 05:31.170 The target lat long which is Singapore. 05:31.410 --> 05:43.810 The zoom level equals to 15 f, the blurring equals to 45 f and tilt equals to 30 f. 05:43.850 --> 05:44.610 Import. 05:44.610 --> 05:54.650 Remember we have the target Singapore zoom 15 f close up view blurring 45 F rotated 45 degrees. 05:54.810 --> 05:57.930 Tilt 30 degrees angle view. 05:58.130 --> 06:00.490 Let me remove those parameters. 06:00.610 --> 06:04.130 Maybe you didn't recognize them. 06:04.410 --> 06:06.650 And this is good okay. 06:06.970 --> 06:09.740 Now let's move to that camera position state. 06:09.740 --> 06:19.340 And here use the remember camera position state and set the position to my camera position. 06:19.340 --> 06:21.140 Run again and here we go. 06:21.180 --> 06:26.700 You can notice that we are on uh Singapore position. 06:26.700 --> 06:29.460 We have 15 f close up view. 06:29.500 --> 06:37.220 You can notice the streets are visible 40 F rotated 45 degrees from north. 06:37.260 --> 06:46.700 You can notice that north, uh, needle is 45 degrees tilted and bearing 30 degrees 30 degrees angle 06:46.740 --> 06:47.300 view. 06:47.540 --> 06:52.740 If you move up, you can notice that we are tilted 30 degrees. 06:53.060 --> 06:53.580 Okay. 06:53.780 --> 06:57.700 This is our initial camera position. 06:57.700 --> 07:02.660 We configure, uh, some basic things like zoom, tilt blurring. 07:02.660 --> 07:06.500 And the most important thing which is the initial position.