Implement Google Maps JS on WordPress

First of all enqueue the Google Maps API js in the right way. look for a function which is hooked on wp_enqueue_scripts and wp_enqueue_script() to enqueue Google Maps API

function wp_mk_scripts() {
    if ( is_singular() ) {
        wp_enqueue_script( 'wp-mk-maps-js', 'https://maps.googleapis.com/maps/api/js', array( 'jquery' ), null, true );
        wp_enqueue_script( 'wp-mk-gmaps-function', get_stylesheet_directory_uri() . '/js/maps.js', array( 'jquery' ), null, true );
    }
}
add_action( 'wp_enqueue_scripts', 'wp_mk_scripts' );

then in your theme_folder/js/maps.js paste the map code between <script></script> tags in Style Google Maps

Now call the <div id="map"></div> div anywhere in the template to display the map.