Plugin Advanced Custom Fields display values in post page [solved]

i choose Single Post (single.php) to display advance custom fields values in your template.

step 1:

Create Field Group and fields.

My group name is sky group.

My costume fields are Name, Area(Google map marker)

Step 2 

Search for  <?php get_template_part( 'content', 'single' ); ?>  in single.php page.
Add below code line to display custom fields values in to your post page


Step 3

add <b>Name: <?php the_field('name'); ?></b> for display Name field.

Step 4

add

 <div id="view1">
<?php
$location = get_field('area');
if( ! empty($location) ):
?>
<div id="map" style="width: 100%; height: 350px;"></div>
<script src='http://maps.googleapis.com/maps/api/js?sensor=false' type='text/javascript'></script>

<script type="text/javascript">
  //<![CDATA[
    function load() {
    var lat = <?php echo $location['lat']; ?>;
    var lng = <?php echo $location['lng']; ?>;
// coordinates to latLng
    var latlng = new google.maps.LatLng(lat, lng);
// map Options
    var myOptions = {
    zoom: 9,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
   };
//draw a map
    var map = new google.maps.Map(document.getElementById("map"), myOptions);
    var marker = new google.maps.Marker({
    position: map.getCenter(),
    map: map
   });
}
// call the function
   load();
//]]>
</script>
<?php endif; ?>

</div>
for displaying Google map [ source: https://wordpress.org/support/topic/advanced-custom-fields-display-google-map-on-your-theme ]