$(function() { $('ul.dtc-worldlocation li').find('img').each(function() { $(this).on("click", function() { hoverc = $(this).next(); if(hoverc.hasClass('is-open')){ hoverc.removeClass('is-open').addClass('is-close').next().slideToggle(); }else{ hoverc.removeClass('is-close').addClass('is-open').next().slideToggle(); } }); }); $('ul.dtc-worldlocation li').find('span.dtc-btn-cancel-a').each(function() { $(this).on("click", function() { hoverc = $(this).parent(); if(hoverc.hasClass('is-open')){ hoverc.removeClass('is-open').addClass('is-close').next().slideToggle(); }else{ hoverc.removeClass('is-close').addClass('is-open').next().slideToggle(); } }); }); /*---------------------------- ** ナビゲーション固定 **---------------------------- */ $(function () { var fixedClass = 'is-fixed'; var $target = $('.dtc-nav-local-a').addClass(fixedClass); var docHeight, scrollPosition, footerHeight; $(window).on('scroll', function () { docHeight = $(document).height(); // ドキュメントの高さ scrollPosition = $(window).height() + $(window).scrollTop(); // ウィンドウ最下部のスクロール位置 footerHeight = $('#footer').innerHeight(); // フッターの高さ if (docHeight - scrollPosition < footerHeight) { $target.removeClass(fixedClass); } else { $target.addClass(fixedClass); } }); }); /*---------------------------- ** Google Map World Map **---------------------------- */ $(function () { if (!$('#dtc-map-world').length) { return; } var canvas = document.getElementById('dtc-map-world'); var latlng = [ { name: 'Tokyo', url: '/jp/about/corporate/facilities/dtc/', lat: 35.656311, lng: 139.756705 , zIndex: 2 }, { name: 'Osaka', url: '/jp/about/corporate/facilities/dtc/', lat: 34.693272, lng: 135.493588 , zIndex: 1 }, { name: 'Munich', url: '/emeia/cocreating-program', lat: 48.176463, lng: 11.592553 , zIndex: 1 }, { name: 'NewYork', url: '/us/cocreation-2018/', lat: 40.753042, lng: -73.972129 , zIndex: 1 } ]; var map, marker; // オプションの指定 map = new google.maps.Map(canvas, { zoom: 2.5, // 拡大比率 center: latlng[0], // 表示枠内の中心座標 scrollwheel: false, // 拡大縮小 styles: [{ elementType: 'labels', stylers: [{ visibility: 'off' }] }, { elementType: 'all', stylers: [{ saturation: -200 }, { hue: '#000' }, { lightness: 50 }, { gamma: 0.5 }] },{ elementType: 'geometry', featureType: "water", stylers: [ { hue: '#000' }, { lightness: 65 }, { gamma: 0.5 },{ saturation: -200 }] }] }); // マーカーのインスタンスの作成 var marker = []; var infoWindow = []; for (var i = 0; i < latlng.length; i++) { marker[i] = new google.maps.Marker({ position: latlng[i], map: map, zIndex:latlng[i].zIndex }); infoWindow[i] = new google.maps.InfoWindow({ // 吹き出しの追加 content: '
', // 吹き出しに表示する内容 zIndex:latlng[i].zIndex }); markerEvent(i); // マーカーにクリックイベントを追加 } // マーカーにクリックイベントを追加 function markerEvent(i) { marker[i].addListener('click', function() { // マーカーをクリックしたとき infoWindow[i].open(map, marker[i]); // 吹き出しの表示 }); } google.maps.event.addDomListener(window, 'load', function () { setMap() }); google.maps.event.addDomListener(window, 'resize', function () { setMap() }); function setMap(){ // ピンを中央にする var center = map.getCenter(); google.maps.event.trigger(map, 'resize'); map.setCenter(center); // 全拠点が表示されるよう調整 var window_width = window.innerWidth?window.innerWidth: $(document).width(); if (window.matchMedia('(max-width:480px)').matches) { // SPサイズの処理 map.setZoom(0.5) } else if (window.matchMedia('(max-width:1280px)').matches) { // TABからPCサイズまでの処理 map.setZoom(2.5 * window_width / 1280); } else { // PCサイズの処理 map.setZoom(2.5); } } }); /*---------------------------- ** Google Map Tokyo **---------------------------- */ $(function () { if (!$('#dtc-map-tokyo').length) { return; } var canvas = document.getElementById('dtc-map-tokyo'); var latlng = new google.maps.LatLng(35.656311, 139.756705); // 中心の位置座標 var map, marker; // オプションの指定 map = new google.maps.Map(canvas, { zoom: 16, // 拡大比率 center: latlng, // 表示枠内の中心座標 scrollwheel: false, // 拡大縮小 styles: [{ stylers: [{ // 色の変更 saturation: -200 }, { hue: '#000' }, { lightness: 50 }, { gamma: 0.5 }] }] }); // マーカーのインスタンスの作成 marker = new google.maps.Marker({ map: map, // 地図 position: latlng // 位置座標 }); // ピンを中央にする google.maps.event.addDomListener(window, 'resize', function () { var center = map.getCenter(); google.maps.event.trigger(map, 'resize'); map.setCenter(center); }); }); /*---------------------------- ** Google Map Osaka **---------------------------- */ $(function () { if (!$('#dtc-map-osaka').length) { return; } var canvas = document.getElementById('dtc-map-osaka'); var latlng = new google.maps.LatLng(34.693272, 135.493588); // 中心の位置座標 var map, marker; // オプションの指定 map = new google.maps.Map(canvas, { zoom: 16, // 拡大比率 center: latlng, // 表示枠内の中心座標 scrollwheel: false, // 拡大縮小 styles: [{ stylers: [{ // 色の変更 saturation: -200 }, { hue: '#000' }, { lightness: 50 }, { gamma: 0.5 }] }] }); // マーカーのインスタンスの作成 marker = new google.maps.Marker({ map: map, // 地図 position: latlng // 位置座標 }); // ピンを中央にする google.maps.event.addDomListener(window, 'resize', function () { var center = map.getCenter(); google.maps.event.trigger(map, 'resize'); map.setCenter(center); }); }); /*---------------------------- ** Google Map Munich **---------------------------- */ $(function () { if (!$('#dtc-map-munich').length) { return; } var canvas = document.getElementById('dtc-map-munich'); var latlng = new google.maps.LatLng(48.176463, 11.592553); // 中心の位置座標 var map, marker; // オプションの指定 map = new google.maps.Map(canvas, { zoom: 15, // 拡大比率 center: latlng, // 表示枠内の中心座標 scrollwheel: false, // 拡大縮小 styles: [{ stylers: [{ // 色の変更 saturation: -200 }, { hue: '#000' }, { lightness: 50 }, { gamma: 0.5 }] }] }); // マーカーのインスタンスの作成 marker = new google.maps.Marker({ map: map, // 地図 position: latlng // 位置座標 }); // ピンを中央にする google.maps.event.addDomListener(window, 'resize', function () { var center = map.getCenter(); google.maps.event.trigger(map, 'resize'); map.setCenter(center); }); }); /*---------------------------- ** Google Map New York **---------------------------- */ $(function () { if (!$('#dtc-map-newyork').length) { return; } var canvas = document.getElementById('dtc-map-newyork'); var latlng = new google.maps.LatLng(40.753042, -73.972129); // 中心の位置座標 var map, marker; // オプションの指定 map = new google.maps.Map(canvas, { zoom: 14, // 拡大比率 center: latlng, // 表示枠内の中心座標 scrollwheel: false, // 拡大縮小 styles: [{ stylers: [{ // 色の変更 saturation: -200 }, { hue: '#000' }, { lightness: 50 }, { gamma: 0.5 }] }] }); // マーカーのインスタンスの作成 marker = new google.maps.Marker({ map: map, // 地図 position: latlng // 位置座標 }); // ピンを中央にする google.maps.event.addDomListener(window, 'resize', function () { var center = map.getCenter(); google.maps.event.trigger(map, 'resize'); map.setCenter(center); }); }); });