@{layout layout}
@set header{
<style type="text/css">
    .text-right {
        color: black !important;
    }

    .text-right a {
        color: black !important;
    }

    .my-map {
        margin: 0 auto;
        width: 600px;
        height: 350px;
    }

    .my-map .icon {
        background: url(http://lbs.amap.com/console/public/show/marker.png) no-repeat;
    }

    .my-map .icon-cir {
        height: 31px;
        width: 28px;
    }

    .my-map .icon-cir-red {
        background-position: -11px -5px;
    }

    .amap-container {
        height: 100%;
    }

    .iw_poi_title {
        color: #CC5522;
        font-size: 14px;
        font-weight: bold;
        overflow: hidden;
        padding-right: 13px;
        white-space: nowrap
    }

    .iw_poi_content {
        font: 12px arial, sans-serif;
        overflow: visible;
        padding-top: 4px;
        white-space: -moz-pre-wrap;
        word-wrap: break-word
    }

    .amap-info-content {
        color: #000;
    }

    .item a {
        background: rgb(250, 250, 250);
    }

    .item a:hover {
        color: white;
        background: rgb(1, 159, 232);
    }

    .dialog-bg {
        display: none;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(0, 0, 0, 0.4);
    }


    .dialog-bg .img-box {
        width: 400px;
        height: 250px;
        position: fixed;
        left: 50%;
        top: 20%;
        margin-left: -200px;
        margin-top: -125px;
    }

    .dialog-bg .img-box img {
        width: 600px;
        /*height: 100%;*/
    }

    .p_img img {
        width: 385px;
        margin-right: 15px;
        margin-bottom: 15px;
    }
</style>
<script src="http://webapi.amap.com/maps?v=1.3&key=8325164e247e15eea68b59e89200988b"></script>
@}
@set body{
    <div class="page-top">
        <div class="w1800">
            <a href="javascript:;" class="logo"></a>
            
            <ul class="nav">
                <li>
                    <a href="/">首页</a>
                </li>
                <li>
                    <a href="/guanyuqiangda.html">关于我们</a>
                </li>
                <li>
                    <a href="/news/公司新闻/" class="amn3">新闻中心</a>
                </li>
                <li>
                    <a href="/product/" class="amn3">产品中心</a>
                </li>
                <li>
                    <a href="/news/荣誉资质/" class="amn3">荣誉资质</a>
                </li>
                <li>
                    <a href="/chengzhaojiameng.html" class="amn3">诚招加盟</a>
                </li>
                <li>
                    <a href="/lianxiwomen.html" class="amn3">联系我们</a>
                </li>
            </ul>
            <div class="topiphone">
                400-180-2877
            </div>
        </div>
    </div>
    @if d.CurSinglePage.Text == "联系我们"{
        <div class="pagebanner pagebanner5"></div>
        <div class="pageb">
            <div class="w1200">
                <div class="page-title">
                    <h1>CONTACT US</h1>
                    <span>联系我们</span>
                </div>
            </div>
        </div>
        <div class="contacbg">
            <div class="map">
                <div id="mapContainer" style="height: 580px"></div>
            </div>
            <div class="contactcont" style="width: 730px;">
                @{d.CurSinglePage.Body}
            </div>
        </div>
        <script>
           
                var infoWindow, map, level = 17,
                    center = {
                        lng: 120.834226,
                        lat: 27.836677
                    },
                    features = [{
                        type: "Marker",
                        name: " 强大阀门有限公司 ",
                        desc: "温州滨海经济技术开发区二道三路4904号",
                        color: "red",
                        icon: "cir",
                        offset: {
                            x: -9,
                            y: -31
                        },
                        lnglat: {
                            lng: 120.834226,
                            lat: 27.836677
                        }
                    }];

                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.lnglat.length, path = []; j < jl; j++) {
                                    path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[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.lnglat.length, path = []; j < jl; j++) {
                                    path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[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
                        });
                    }
                    var extData = e.target.getExtData();
                    infoWindow.setContent("<h5>" + extData.name + "</h5><div>" + extData.desc + "</div>");
                    infoWindow.open(map, e.lnglat);
                }

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

                loadFeatures();

                map.on('complete', function () {
                    map.plugin(["AMap.ToolBar", "AMap.OverView", "AMap.Scale"], function () {
                        map.addControl(new AMap.ToolBar);
                        map.addControl(new AMap.OverView({
                            isOpen: true
                        }));
                        map.addControl(new AMap.Scale);
                    });
                })

   
        </script>
    @}
    @if d.CurSinglePage.Text != "联系我们"{
        <div class="pagebanner pagebanner1"></div>
        <div class="page">
            <div class="w1200">
                <!-- <div class="about-icon"></div> -->
                <div class="page-title">
                    <h1></h1>
                    <span>@{d.CurSinglePage.Text}</span>
                </div>
                <div class="about-content">
                    @{d.CurSinglePage.Body}
                </div>
            </div>
        </div>
    @}
@}