Cómo insertar su propio mapa de área pequeña en una página web

3. la página (De hecho, se puede colocar en cualquier lugar de la página)

/Crear e inicializar la función de mapa:

function?initMap(){

createMap();//crear mapa

setMapEvent();//establecer eventos de mapa

addMapControl (); //agregar controles al mapa

addMarker();//agregar marcador al mapa

}

//función createMap:

function?createMap(){

var?map?=?new?BMap.Map("dituContent");//Crear un mapa en el contenedor de mapas de Baidu

var? point?=?new?BMap.Point(115.949652,28.693851);//Definir las coordenadas del punto central

map.centerAndZoom(point,18);//Establecer el punto central y las coordenadas del mapa y colocarlos en el mapa Mostrar el mapa en el contenedor

window.map?=?p>

map.enableScrollWheelZoom();//Enable ScrollWheelZoom

map.enableKeyboard();/ /Habilita las teclas arriba/abajo/derecha/izquierda/izquierda del teclado para mover el mapa

}

//Función de agregar control de mapa:

function?addMapControl( ){

//Agregar control de zoom al mapa

var?BMap.NavigationCo

ntrol({anchor:BMAP_ANCHOR_TOP_LEFT,type. BMAP_NAVIGATION_CONTROL_LARGE});

map.addControl(ctrl_nav);

//Agregar control de miniaturas al mapa

var ?OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});

map.addControl(ctrl_ove);

Agregar control de zoom al mapa

var? ctrl _sca?=?new?BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});

map.addControl(ctrl_sca);

}

// Etiqueta Matriz de puntos

var?markerArr?=?{title："Baiheng Network",content："Tel:0791-88117053
Móvil:15079002975",point: "115.950312|28.693447",isOpen: 1,icono:{w:23,h:25,l:46,t:21 ,x:9,lb:12}} ];

//createmarker

función ?addMarker(){

for(var?i=0;i

var?json?=?markerArr[i];

var?p0?=?json.point.split("|")[0];

var?p1?=?json.point.split("|")[1 ] ;

var?iconImg?=?createIcon(json.icon);

var?marker?=?new?BMap.Marker(point,{icon:iconImg}); ?iw?=?createInfoWindow(i); var?label?=?new?BMap.Label(json.title,{"offset":new?BMap.Size(json.icon.lb-json.icon.x+ 10, -20)}); marcador.setLabel(etiqueta);

map.addOverlay(marcador);

label.setStyle({

borderColor: "# 808080",

color: "#333",

cursor: "puntero"

}); (función(){

var ?index ?=?i;

var?_w?=?createInfoWindow(i);

var?_marker?=?marker;

_marker.addEventListener (" haga clic",función(){

this.openInfoWindow(_iw); }); _iw.addEventListener("open",función(){

_marker.getLabel() .hide (); }) _iw.addEventListener("cerrar",función(){

_marker.getLabel().display(); })

laboratorio

el.addEventListener("clic",function(){

_marker.openInfoWindow(_iw); })

if(!!json.isOpen){

label.hide();

_marker.openInfoWindow(_iw); })

If(!openInfoWindow(_iw);

} })()

}

}

//createInfoWindow

función?createInfoWindow(i){

var?json ?=?markerArr[i];

var?iw?=?new?BMap.InfoWindow(""?+?json.title?+?" "+?json.content+"