Leaflet.js functionを使って、地図の表示する位置やズームを変更したい

##やりたいこと
シングルページでLeaflet.jsをつかって地図を表示させているのですが、ボタンに紐付けたfunctionが、呼ばれた時に表示されている地図の中心座標やズームを変更したい

##実際に書いたコード

'use strict'

var centerLat = 38.455739;
var centerLog = 141.275939;
var centerZoom = 11;
var bounds_leftLat = 38.528695;
var bounds_leftLon = 141.137838;
var bounds_rightLat = 38.204734;
var bounds_rightLon = 141.606216;



var bounds_all = [
    [bounds_leftLat, bounds_leftLon],[bounds_rightLat, bounds_rightLon]
]

var map = L.map('map', {
    center: [centerLat, centerLog],
    zoom: centerZoom,
    maxBounds: bounds_all
});

var tileLayer = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{
    attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
    maxZoom: 20,
    autoClose:false
    });
    tileLayer.addTo(map);

    function oshika() {
        console.log('oshika')
        var centerLat = 38.298091;
        var centerLog = 141.505714;
        var centerZoom = 14;
        var bounds_leftLat = 38.410894;
        var bounds_leftLon = 141.441078;
        var bounds_rightLat = 38.258873;
        var bounds_rightLon = 141.572570;

        var bounds_all = [
            [bounds_leftLat, bounds_leftLon],[bounds_rightLat, bounds_rightLon]
        ]
        
        var map = L.map('map', {
            center: [centerLat, centerLog],
            zoom: centerZoom,
            maxBounds: bounds_all
        });

        var tileLayer = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{
        attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
        maxZoom: 20,
        autoClose:false
        });
        tileLayer.addTo(map);
    }