ecshop二次開發 百度地圖

ecshop二次開發 百度地圖

1.  在ecshop後臺找到文章管理->文章分類->添加文章分類,添加一個頂級分類,叫做“合作單位”,並且讓其顯示在導航欄

2. .在ecshop後臺找到文章管理->文章列表->添加新文章。(文章標題:八維研修學院;文章分類:合作單位;文章重要性:普通;是否顯示:是,等等一些東西完善了)

3.ecshop/languages/zh_cn/admin/article.php   在第56行 添加   $_LANG['baidu_map'] = '百度地圖';

4.ecshop/admin/templates/article_info.htm    在

<span class="tab-back" id="goods-tab">{$lang.tab_goods}</span>

之後添加
<span class="tab-back" id="baidu-tab">{$lang.baidu_map}</span>   

展示效果:

ecshop後臺文章管理->文章列表->編輯文章內容,可以看到導航標籤多了一個百度地圖


5. 在 ecshop/admin/templates/article_info.htm中 在
<form  action="article.php" method="post" enctype="multipart/form-data" name="theForm" οnsubmit="return validate();">

之後添加
<table width="90%" id="baidu-table" style="display: none">
                <tr>
                    <td class="narrow-label">{$lang.baidu_map_info}</td>
                    <td><input type="text" name="point_x" size ="20" maxlength="30" value="{$article.point_x|escape}" />,<input type="text" name="point_y" size ="20" maxlength="30" value="{$article.point_y|escape}" />{$lang.require_field}</td>
                </tr>
            </table>

6..在ecs.article表中添加兩個字段:point_x、point_y,都是varchar類型

7.在ecshop/admin/article.php裏面搜索“插入數據” 把$sql替換成
 $sql = "INSERT INTO ".$ecs->table('article')."(title, cat_id, article_type, is_open, author, "."author_email, keywords, content, add_time, file_url, open_type, link, description,point_x,point_y) "."VALUES ('$_POST[title]', '$_POST[article_cat]', '$_POST[article_type]', '$_POST[is_open]', "."'$_POST[author]', '$_POST[author_email]', '$_POST[keywords]', '$_POST[FCKeditor1]', "."'$add_time', '$file_url', '$open_type', '$_POST[link_url]', '$_POST[description]','$_POST[point_x]','$_POST[point_y]')";

         $db->query($sql);


8. ecshop/admin/article.php中找到if ($exc->edit("title='$_POST[title]'一段
替換成
:

         if ($exc->edit("title='$_POST[title]', cat_id='$_POST[article_cat]', article_type='$_POST[article_type]', is_open='$_POST[is_open]', author='$_POST[author]', author_email='$_POST[author_email]', keywords ='$_POST[keywords]', file_url ='$file_url', open_type='$open_type', content='$_POST[FCKeditor1]', link='$_POST[link_url]', description = '$_POST[description]',point_x = '$_POST[point_x]',point_y = '$_POST[point_y]'", $_POST['id']))


9.在百度地圖座標文本框輸入:116.46;39.92 (分別爲經緯度)

10.ecshop/upload/article.php找到
if(isset($article) && $article['cat_id'] > 2) 替換<pre name="code" class="python">if(isset($article) && $article['cat_id'] > 2)
{
    if($article['cat_id']==13){

        $smarty->display('article_company.dwt', $cache_id);

    }else{

        $smarty->display('article.dwt', $cache_id);

    }


    // $smarty->display('article.dwt', $cache_id);
}



11..在\ecshop\themes\default裏面複製article_pro.dwt改名爲article_company.dwt 下列話添到
<link href="{$ecs_css_path}" rel="stylesheet" type="text/css" />
之後
<style type="text/css">

                   #allmap{width:100%;height:500px;}

         </style>
        {*  ak可以用自己在百度上的祕鑰*}
         <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=KBKXQwI8M5CdH44DbDfNORa9D11WYUG2"></script>

12.在
 {$article.content}
     <!-- {/if} -->
之後添加
<pre name="code" class="python"> <div id="allmap"></div>
     <script type="text/javascript">

         // 百度地圖API功能

         var sContent =

     "<h4 style='margin:0 0 5px 0;padding:0.2em 0'>{$article.title|escape:html}</h4>" +

     "<img style='float:right;margin:4px' id='imgDemo' src='{$article.file_url}' width='139' height='104' title='{$article.title|escape:html}'/>" +

     "<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>{$article.description}</p>" +

     "</div>";

         var map = new BMap.Map("allmap");

         var point = new BMap.Point({$article.point_x},{$article.point_y});

         var marker = new BMap.Marker(point);

         var infoWindow = new BMap.InfoWindow(sContent);  // 創建信息窗口對象

         map.centerAndZoom(point, 15);

         map.addOverlay(marker);

         marker.addEventListener("click", function(){

             this.openInfoWindow(infoWindow);

             //圖片加載完畢重繪infowindow

             document.getElementById('imgDemo').onload = function (){

                 infoWindow.redraw();   //防止在網速較慢,圖片未加載時,生成的信息框高度比圖片的總高度小,導致圖片部分被隱藏

   }

     });

  </script>











發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章