ArcGIS Custom Infowindow

1 define ([2"Dojo/evented",3"Dojo/on",4"Dojo/query",5"Dojo/_base/declare",6"Dojo/dom-construct",7"Dojo/dom-attr",8"Dojo/_base/array",9"Dojo/dom-style",Ten"Dojo/_base/lang",  One"Dojo/dom-class", A"Dijit/_templatedmixin",/*In order to use the HTML template I copied in the first step*/ -"Esri/domutils", -"Esri/infowindowbase", the"Esri/geometry/screenpoint", -"Esri/geometry/screenutils",/*for accurate translation of geographic coordinates and screen coordinates*/ -"Esri/geometry/webmercatorutils", -"Dojo/text!. /htmltemplate/bubblepopup.html " +     ], -     function(evented, + On , A Query, at Declare, - Domconstruct, - Domattr, - Array, - Domstyle, - Lang, in Domclass, - _templatedmixin, to Domutils, + infowindowbase, Screenpoint, Screenutils, webmercatorutils, template) { -         varShowmappoint =NULL;/*is a global variable used to record the location of the popup's geographic coordinates .*/ the         returndeclare ([Infowindowbase, evented, _templatedmixin], { *  $Templatestring:template,/*a property of the _templatemixin module that is used to save the HTML template*/Panax Notoginseng_events: [],/*is an array that stores the associated events and releases the registered events when the popup is released*/ -Constructorfunction(parameters) { theLang.mixin ( This, parameters); +             }, A_createinfowindowinstance:function(map) { the                  This. Domnode = Domconstruct.create ("div", {id: ' Infopanel '}, Map.id + "_root"); +                  This. domnode.innerhtml = ' <div id= ' infoheader ' ></div><div id= ' infocontent ' ><table></table ></div> '; -                 //This.domNode.innerHTML = this.templatestring; $                  This. _content = Query ("#infoPanel #infoContent"); $                  This. _title = Query ("#infoPanel #infoHeader"); -                  This. _flash = Query ("#infoPanel. Flash"); -                 //Hide Initial display theDomutils.hide ( This. Domnode);  -                  This. isshowing =false;Wuyi             }, theSetmap:function(map) { -                  This. inherited (arguments);//invokes the same name method in the parent class (base class) Wu                  This. _events = []; -                  This. _createinfowindowinstance (map); About  $                  This. _events.push (Map.on ("Pan", Lang.hitch ( This,function(evt) { -                     if( This. isshowing) { -                          This. _showinfowindow (evt.extent); -                     } A                 }))); +  the                  This. _events.push (Map.on ("Zoom-start", Lang.hitch ( This,function(evt) { -                      This. Hide (); $                 }))); the  the                  This. _events.push (Map.on ("Zoom-end", Lang.hitch ( This,function(evt) { the                     if( This. isshowing) { the                          This. _showinfowindow (evt.extent); -                     } in                 }))); the             }, theUnsetmap:function(map) { About                  This. inherited (arguments); theArray.foreach ( This. _events,function(event) { the Event.remove (); the                 }); +             }, -Settitle:function(title, className) { the                  This. _title.foreach (function(node) {Bayinode.innerhtml =title; the domclass.remove (node); the domclass.add (node, className); -                 }); -             }, theSetContent:function(content) { the                  This. _content.foreach (function(node) { thenode.innerhtml =content; the                 }); -             }, the_showinfowindow:function(extent) { the                 if(Showmappoint = =NULL)return; the                 varShowscreenpoint = Screenutils.toscreengeometry (Extent, This. Map.width, This. Map.height, showmappoint);94Domstyle.set ( This. Domnode, { the"Left": (showscreenpoint.x) + 7 + "px", the"Top": (SHOWSCREENPOINT.Y) + 7 + "px" the                 });98  AboutDomutils.show ( This. Domnode); -                  This. isshowing =true;101                  This. OnShow ();102             },103Showfunction(location) {104Showmappoint =Location ; the                 if(Webmercatorutils.canproject (Location, This. Map)) {106Showmappoint = Webmercatorutils.project (location, This. map);107                 }108                 if(showmappoint.spatialreference) {109                     varScreenpoint = This. Map.toscreen (showmappoint); theDomstyle.set ( This. Domnode, {111"Left": (screenpoint.x) + 7 + "px", the"Top": (SCREENPOINT.Y) + 7 + "px"113                     }); the                 } the                 //Display the Info window theDomutils.show ( This. Domnode);117                  This. isshowing =true;118                  This. OnShow ();119             }, -Hidefunction () {121                 if( This. isshowing) {122Domutils.hide ( This. Domnode);123                      This. isshowing =false;124                      This. Onhide (); the                 }126             },127Resizefunction(width, height) { -Domstyle.set ( This. _content, {129"width": Width + "px", the"Height": Height + "px"131                 }); the             },133Removefunction () {134                  This. Hide ();135Showmappoint =NULL;136             },137Destroyfunction () {138Domconstruct.destroy ( This. Domnode);139             } $         });141});

ArcGIS Custom Infowindow