Wordpress Yahoo!地図対応ショートコード

Google Map回避のため。

/**
 * Yahoo!地図対応ショートコード
 *
 * [map id="map1" w="600" h="300" z="16" address="住所" marker="yes" infowindow="吹き出し"]
 * [map id="map1" w="600" h="300" z="16" lat="北緯" lon="東経"]
 *
 * Yahoo! JavaScriptマップAPI
 * https://developer.yahoo.co.jp/webapi/map/openlocalplatform/v1/js/
 * Yahoo! JavaScriptマップAPIサンプル
 * https://developer.yahoo.co.jp/sample/map/sample5.html
 */

define("YAHOO_APPID", "XXXXXXXXXX");

function ymap_header() {
    echo '<script src="https://map.yahooapis.jp/js/V1/jsapi?appid=' . YAHOO_APPID . '" type="text/javascript" charset="UTF-8"></script>';
    echo '<script type="text/javascript" charset="UTF-8">';
    echo 'var ymap = [];';
    echo 'var ycenter;';
    echo '</script>';
}
add_action('wp_head', 'ymap_header');

function ymap_shortcode($attr = array())
{
    $attr = shortcode_atts(array(
        'id'  => 'map',
        'w'   => '400',
        'h'   => '300',
        'lat' => 35.6578759,  //日本経緯度原点付近
        'lon' => 139.7414501, //日本経緯度原点付近
        'z'   => '15',  //1～20
        'address' => '',
        'marker'  => '',
        'infowindow' => '',
    ), $attr);
    $html = '
    <div id="' .$attr['id'] . '" style="width:' . $attr['w'] . 'px;height:' . $attr['h'] . 'px;"></div>
    ';
    $html .= '
    <script type="text/javascript">
        ymap["' . $attr['id'] . '"] = new Y.Map("' . $attr['id'] . '");
        ycenter = new Y.LatLng(' . $attr['lat'] . ', ' . $attr['lon'] . ');
        ymap["' . $attr['id'] . '"].drawMap(ycenter, ' . $attr['z'] . ');
        ymap["' . $attr['id'] . '"].addControl(new Y.LayerSetControl());
        ymap["' . $attr['id'] . '"].addControl(new Y.SliderZoomControlVertical());
        ';

    if($attr['address'] != '') {
        //住所検索あり
        $html .= '
        var address = \'' . $attr['address'] . '\';
        var geocoder = new Y.GeoCoder();
        geocoder.execute( { query : address } , function( result ) {
            if ( result.features.length > 0 ) {
                ymap["' . $attr['id'] . '"].drawMap(result.features[0].latlng );
                ';
        if ($attr['marker'] !='') {
            $html .= '
                ymap["' . $attr['id'] . '"].addFeature(new Y.Marker(result.features[0].latlng));
                ';
        }
        if($attr['infowindow'] != '') {
            $html .= '
                ymap["' . $attr['id'] . '"].openInfoWindow(result.features[0].latlng, "' . $attr['infowindow'] . '");
                ';
        }
        $html .= '
            } else {
                $("#' . $attr['id'] . '").after("<p style=\"color:red;font-weight:bold\">住所「' . $attr['address'] . '」が見つかりません。<a href=\"https://map.yahoo.co.jp/\" target=\"_blank\">Yahoo!地図</a>で検索可能な住所を設定してください。住所が見つからない場合は、経緯度で指定します（lat:緯度 北緯○度、lon:経度 東経○度）。</p>");
            }
        });
        ';
    } else {
        //住所検索なし
        if ($attr['marker'] !='') {
            $html .= '
        ymap["' . $attr['id'] . '"].addFeature(new Y.Marker(ycenter));
        ';
        }
        if ($attr['infowindow'] != '') {
            $html .= '
        ymap["' . $attr['id'] . '"].openInfoWindow(ycenter, "' . $attr['infowindow'] . '");
        ';
        }
    }
     $html .= '</script>';
     return $html;
}
add_shortcode('map', 'ymap_shortcode');