<?php /*Template Name: 联系我们 */
get_header(); ?>
<div id="luxy">
    <main id="main">
        <div class="g_body n_contact n_pro">
            <div class="n_banner banner">
                <div class="img">
                    <div class="g_bg" style="background-image: url('<?php echo of_get_option('banner_contact'); ?>')">
                    </div>
                </div>
            </div>
            <div class="n_top">
                <div class="g_w">
                    <div class="n_breadcrumb"><a href="<?php echo esc_url( home_url( '/' ) ); ?>">首页</a>><a href="/contact">联系我们</a></div>
                </div>
            </div>
            <div class="n_con">
                <div class="con1" id="link1">
                    <div class="mpa">
                        <div class="text">
                            <div class="g_w">
                                <div class="info">
                                    <b><?php echo of_get_option('company_name'); ?></b>
                                    <div class="p">
                                        <p>
                                            <i class="iconfont icon-dianhua1"></i>电话：<?php echo of_get_option('shouji_tel'); ?>（<?php echo of_get_option('lxr'); ?>）
                                        </p>
                                        <p>
                                            <i class="iconfont icon-youxiang1"></i>邮箱：<?php echo of_get_option('email'); ?>
                                        </p>
                                        <p>
                                            <i class="iconfont icon-dizhi"></i>地址：<?php echo of_get_option('address'); ?>
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div id="wrap" class="my-map">
                            <div id="mapContainer"></div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </main>
</div>
<script src="<?php bloginfo('template_url'); ?>/static/js/maps.js"></script>

<script>
    document.getElementById("head_li_4").className = "active";

    !function () {
        var infoWindow, map, level = 18,
            center = { lng: 121.85, lat: 30.98 },
            features = [{ "icon": "cir", "color": "red", "name": "上海岩投新材料科技有限公司", "desc": "地址：中国(上海)自由贸易试验区临港新片区丽正路1628号4幢1-2层", 
            "lnglat": { "lng": 121.85, "lat": 30.98 }, "offset": { "x": -9, "y": -31 }, "type": "Marker" }];

        function loadFeatures() {
            for (var feature, data, i = 0, len = features.length, j, jl, path; i < len; i++) {
                data = features[i];
                switch (data.type) {
                    case "Marker":
                        feature = new AMap.Marker({
                            map: map, position: new AMap.LngLat(data.lnglat.lng, data.lnglat.lat),
                            zIndex: 3, extData: data, offset: new AMap.Pixel(data.offset.x, data.offset.y), title: data.name,
                            content: '<div class="icon icon-' + data.icon + ' icon-' + data.icon + '-' + data.color + '"></div>'
                        });
                        break;
                    case "Polyline":
                        for (j = 0, jl = data.path.length, path = []; j < jl; j++) {
                            path.push(new AMap.LngLat(data.path[j].lng, data.path[j].lat));
                        }
                        feature = new AMap.Polyline({
                            map: map, path: path, extData: data, zIndex: 2,
                            strokeWeight: data.strokeWeight, strokeColor: data.strokeColor, strokeOpacity: data.strokeOpacity
                        });
                        break;
                    case "Polygon":
                        for (j = 0, jl = data.path.length, path = []; j < jl; j++) {
                            path.push(new AMap.LngLat(data.path[j].lng, data.path[j].lat));
                        }
                        feature = new AMap.Polygon({
                            map: map, path: path, extData: data, zIndex: 1,
                            strokeWeight: data.strokeWeight, strokeColor: data.strokeColor, strokeOpacity: data.strokeOpacity,
                            fillColor: data.fillColor, fillOpacity: data.fillOpacity
                        });
                        break;
                    default: feature = null;
                }
                if (feature) { AMap.event.addListener(feature, "click", mapFeatureClick); }
            }
        }

        function mapFeatureClick(e) {
            if (!infoWindow) { infoWindow = new AMap.InfoWindow({ autoMove: true, isCustom: false }); }
            var extData = e.target.getExtData();
            infoWindow.setContent("<div class='myinfowindow'><h5>" + extData.name + "</h5><div>" + extData.desc + "</div></div>");
            infoWindow.open(map, e.lnglat);
        }

        map = new AMap.Map("mapContainer", { center: new AMap.LngLat(center.lng, center.lat), level: level, keyboardEnable: true, dragEnable: true, scrollWheel: true, doubleClickZoom: true });

        loadFeatures();
    }();
</script>
<?php get_footer(); ?>