WEBVTT 00:00.080 --> 00:01.040 Welcome back. 00:01.280 --> 00:04.880 We talked before about the initial camera position. 00:05.040 --> 00:09.880 Now we're going to customize and discuss the camera position. 00:09.920 --> 00:17.440 The camera position in Google Maps determines what part of the map is visible to the user and how it's 00:17.440 --> 00:18.400 displayed. 00:18.560 --> 00:21.640 Zoom level, tilt burning, and so on. 00:21.680 --> 00:28.160 A camera position consists of target the lat long latitude longitude. 00:28.200 --> 00:32.440 The camera is pointing at the zoom level. 00:32.480 --> 00:34.440 Higher is more zoomed in. 00:34.760 --> 00:39.840 Tilt the angle of the camera zero straight down and the bedding. 00:39.880 --> 00:43.600 The orientation zero means north up. 00:43.760 --> 00:49.360 In the previous videos, we created a variable called camera position state. 00:49.360 --> 00:52.640 Here we have it and remember camera position state. 00:52.640 --> 00:59.320 And we set the position to camera position from lat long and we set it to Singapore. 00:59.400 --> 01:08.230 If we run the application without the restrictions that we put, let me remove the restrictions by making 01:08.750 --> 01:13.470 those parameters, command those parameters and run the app. 01:13.670 --> 01:15.630 Let me keep the map type. 01:15.750 --> 01:16.550 Run again. 01:16.550 --> 01:22.510 And here we have Singapore which is the camera position, the initial camera position. 01:22.510 --> 01:28.590 And we talked about the initial camera zoom level that we set it to. 01:28.630 --> 01:34.310 For F we can make it 1514 till 21. 01:34.350 --> 01:34.910 Okay. 01:35.030 --> 01:39.630 Now I want from you to focus with me as I did before. 01:39.910 --> 01:49.950 When longer clicking on the map, the marker is displayed with a title and we can add a blue marker 01:49.950 --> 01:50.830 on the map. 01:51.070 --> 02:03.510 Now I want to use the camera position state in order to zoom in and navigate to the newly created marker. 02:03.630 --> 02:12.910 So if I create a new marker in India with a long click on the map, I need to move the camera to center 02:12.910 --> 02:15.990 it and make it, for example, to the level. 02:16.030 --> 02:20.310 Zoom level 14 and make it as a central marker. 02:20.550 --> 02:27.750 So if I add a new marker here, nothing changed in terms of camera position. 02:27.790 --> 02:28.310 Okay. 02:28.510 --> 02:37.870 Now we're going to move the camera to the newly created one and make an animation to zoom in to 14 uh, 02:38.910 --> 02:40.230 14 f zoom level. 02:40.270 --> 02:40.710 Okay. 02:40.870 --> 02:47.630 In the Google map parameters and on map, click on map long click. 02:47.950 --> 02:51.510 We need to animate camera to new position. 02:51.550 --> 02:54.630 Okay, start with scoop. 02:54.910 --> 03:00.150 I'm using coroutine scoop in order to make camera animations. 03:00.150 --> 03:03.030 So outside the Google map. 03:03.070 --> 03:08.310 Create a new coroutine scoop for camera animations. 03:08.350 --> 03:10.750 Remember coroutine scoop? 03:10.990 --> 03:15.700 Now I'm gonna use this scoop in order to make the animation. 03:15.700 --> 03:19.860 So this is scoop dot launch inside it. 03:20.020 --> 03:24.300 Use the camera position state dot animate. 03:24.540 --> 03:30.580 This function allows us to animate the camera to the newly created position. 03:30.740 --> 03:38.420 If we go to the animate function, we need to pass the update and the duration milliseconds. 03:38.420 --> 03:47.060 In order to do that, we need to create a camera update and pass the camera update and the newly created 03:47.340 --> 03:50.940 value and position camera update. 03:50.940 --> 04:01.220 Factory dot new camera position and here set the camera position from lat long camera position target. 04:01.220 --> 04:08.500 You need to get this camera position that contains the target, zoom and tilt parameters. 04:08.500 --> 04:15.860 If we open the camera position we have lat long which is the target zoom which is a float tilt which 04:15.860 --> 04:18.930 is a is afloat and the burning, which is a float. 04:18.930 --> 04:24.210 So those are the camera position parameters that we need to pass. 04:24.410 --> 04:33.610 So here go to the target, specify the target which is the newly created lat long of the newly created, 04:33.650 --> 04:36.490 uh long long clicked marker. 04:36.530 --> 04:47.770 Zoom level 14 F tilt zero degrees straight down and burning, which is zero F okay, which is north 04:47.810 --> 04:48.250 up. 04:48.290 --> 04:56.610 Let me write this down north up, straight down street level zoom, which is 14 F. 04:56.770 --> 05:03.290 Now we need to specify another parameter which is the duration. 05:03.290 --> 05:12.210 So as I told you in the camera position animate we have two parameters the camera update and the duration 05:12.210 --> 05:13.450 in milliseconds. 05:13.650 --> 05:22.520 Specify the duration which is 1000 which means one second okay one second animation. 05:22.520 --> 05:27.840 Let me run our application and see if there is any change or any error. 05:28.000 --> 05:38.880 If I log click on Australia and you can see that the newly created marker is created on Australia and 05:39.040 --> 05:50.920 the map is navigated to zoom level 14 with a new camera animation, and we set the tilt to zero degrees 05:50.920 --> 05:53.080 and the bearing zero f. 05:53.320 --> 05:58.840 Let me create a new a new long click marker in India. 05:58.840 --> 06:00.360 And here we go. 06:00.800 --> 06:06.560 We are zooming into the street level zoom in India. 06:06.760 --> 06:07.280 Okay. 06:07.480 --> 06:16.360 Let me create another um, like zoom level, make it as eight, which is good in order to make it better. 06:16.360 --> 06:22.600 Also, you can um, specify the same zoom level of your Google map. 06:22.800 --> 06:27.680 So if we scroll up, we can notice that the zoom level was four. 06:27.720 --> 06:28.960 We can make it four. 06:29.080 --> 06:30.400 Not a big deal. 06:30.720 --> 06:37.120 So let me go to China and I love to go to Beijing. 06:37.280 --> 06:39.720 So long click and here we go. 06:39.880 --> 06:42.120 You can control the zoom level. 06:42.120 --> 06:45.640 You can control the birding, the tilt and so on. 06:45.880 --> 06:47.680 Let me show you the tilt. 06:47.920 --> 06:50.440 I'll set it to 30 degrees. 06:50.440 --> 06:51.080 Tilt. 06:51.080 --> 06:55.840 And the north up would be for example, 30 degrees. 06:55.880 --> 06:57.360 Again run. 06:57.400 --> 06:58.760 Make a new marker. 06:58.840 --> 07:00.240 Uh, on Australia. 07:00.280 --> 07:01.160 Long click. 07:01.160 --> 07:01.880 And here we go. 07:01.920 --> 07:09.240 You can see we are tilting the map 30 degrees and the birding set it up to 30 degrees. 07:09.240 --> 07:18.400 You can notice the, uh, the north up and the needle is tilted 30 degrees and not, uh, directly to 07:18.440 --> 07:19.480 the north. 07:19.520 --> 07:28.320 Okay, so this is a full customization of camera position and how we animate the camera to the newly 07:28.320 --> 07:29.320 created markers.