給帝國CMS任意模型加上百度地圖標注功能。
第一步:首先在模型建立三個字段:
字段名:map_x 字段類型:DOUBLE
字段名:map_y 字段類型:DOUBLE
字段名:map_z 字段類型:TINYINT 最好設置個默認值13 14左右,是調(diào)整縮放級別的
系統(tǒng)模型該選的都選上,比如錄入項、投稿項、可增加、可修改、內(nèi)容模版。
第二步:修改系統(tǒng)模型表單模版
把這三個字段的代碼刪除改成:
> width=’16%’ height=25 bgcolor=’ffffff’>標注地圖 >
bgcolor=’ffffff’> href="javascript:void(0)" onclick="showOrHide(1)">點擊地圖標注> > >
然后在底部添加以下代碼:
>
<div style="width:520px;height:340px;border:1px solid gray" id="container"></div>
<script type="text/javascript">
var sContent =
"<h4 style=’margin:0 0 5px 0;padding:0.2em 0′>[!--title--]</h4>" +
"<img style=’float:right;margin:4px’ id=’imgDemo’ src=’[!--titlepic--]‘ width=’139′ height=’104′ title=’[!--title--]‘/>" +
"<p style=’margin:0;line-height:1.5;font-size:13px;text-indent:2em;width:320px;’>[!--smalltext--]…</p>" +
"</div>";
var map = new BMap.Map("container");
var point = new BMap.Point([!--map_x--], [!--map_y--]);
var marker = new BMap.Marker(point);
var infoWindow = new BMap.InfoWindow(sContent); // 創(chuàng)建信息窗口對象
map.centerAndZoom(point, [!--map_z--]);
map.addOverlay(marker);
marker.addEventListener("click", function(){
this.openInfoWindow(infoWindow);
//圖片加載完畢重繪infowindow
document.getElementById(‘imgDemo’).onload = function (){
infoWindow.redraw();
}
});
</script>
至此,地圖標注功能便做好了。
版權(quán)聲明: 本站資源均來自互聯(lián)網(wǎng)或會員發(fā)布,如果侵犯了您的權(quán)益請與我們聯(lián)系,我們將在24小時內(nèi)刪除!謝謝!
轉(zhuǎn)載請注明: 帝國CMS添加百度地圖標注方法