Basic map
Displaying a simple map
The following code shows a simple example of creating a map. If no option is set, a map centered on Seoul City Hall is created as in the figure below.
- Namespaces
-
Classes
- Base
- naver.maps.LatLng
- naver.maps.LatLngBounds
- naver.maps.Point
- naver.maps.PointBounds
- naver.maps.Size
- KVO
- naver.maps.KVO
- naver.maps.KVOArray
- Map
- naver.maps.Map
- Tile
- naver.maps.CanvasTile
- naver.maps.ImageTile
- naver.maps.Tile
- MapType
- naver.maps.CanvasMapType
- naver.maps.ImageMapType
- naver.maps.MapTypeRegistry
- preset
- naver.maps.NaverMapTypeOptions
- Control
- naver.maps.CustomControl
- Naver Controls
- naver.maps.LogoControl
- naver.maps.MapDataControl
- naver.maps.MapTypeControl
- naver.maps.ScaleControl
- naver.maps.ZoomControl
- Layer
- naver.maps.Layer
- Naver Layers
- naver.maps.BicycleLayer
- naver.maps.CadastralLayer
- naver.maps.LabelLayer
- naver.maps.StreetLayer
- naver.maps.TrafficLayer
- Data Layer
- naver.maps.Data
- naver.maps.Feature
- naver.maps.Geometry
- Overlay
- naver.maps.OverlayView
- Naver Overlays
- naver.maps.Circle
- naver.maps.Ellipse
- naver.maps.GroundOverlay
- naver.maps.InfoWindow
- naver.maps.Marker
- naver.maps.Polygon
- naver.maps.Polyline
- naver.maps.Rectangle
- Submodule: drawing
- naver.maps.drawing.DrawingManager
- Submodule: panorama
- naver.maps.AroundControl
- naver.maps.FlightSpot
- naver.maps.Panorama
- Submodule: visualization
- naver.maps.visualization.DotMap
- naver.maps.visualization.HeatMap
- naver.maps.visualization.WeightedLocation
- Interfaces
-
Statics
- Event
- naver.maps.Event
- Projection
- naver.maps.EPSG3857
- naver.maps.UTMK
- naver.maps.UTMK_NAVER
- Submodule: geocoder
- naver.maps.Service
- naver.maps.TransCoord
- Extended Projection
- naver.maps.EPSG3857Coord
- naver.maps.TM128
- naver.maps.TM128Coord
- naver.maps.UTMK_NAVERCoord
- naver.maps.UTMKCoord
- Submodule: visualization
- naver.maps.visualization.SpectrumStyle
-
Types
- any
- array
- ArrayOfBounds
- ArrayOfBoundsLiteral
- ArrayOfCoords
- ArrayOfCoordsLiteral
- boolean
- Bounds
- BoundsLiteral
- Coord
- CoordLiteral
- DOMEvent
- DOMEventListener
- DrawingOverlay
- FitBoundsOptions
- function
- GeoJSON
- GPX
- HTMLElement
- ImageData
- isDefaultMapType
- KeyboardEvent
- KML
- KVOArrayOfCoords
- LatLngBoundsLiteral
- LatLngBoundsObjectLiteral
- LatLngLiteral
- LatLngObjectLiteral
- LayerRegistry
- limitMaxBounds
- limitMinZoom
- MapEventListener
- MapType
- margin
- null
- number
- object
- OVERLAY_TYPE_ORDER_IN_HOUSE
- padding
- PointArrayLiteral
- PointBoundsArrayLiteral
- PointBoundsLiteral
- PointBoundsObjectLiteral
- PointerEvent
- PointLiteral
- PointObjectLiteral
- SizeArrayLiteral
- SizeLiteral
- SizeObjectLiteral
- string
- TransitionOptions
- Modules
-
Tutorials
- Overview
- Major Characteristics
- Abbreviations
- KVO Design
- Submodule System
- Getting Started
- Get a Client ID
- Hello, World
- Map
- Basics of Creating Maps
- Map Types
- Projections and Coordinate Systems
- Event
- DOM Events
- KVO State Change Notifications
- UI Events
- Control
- Map Controls
- Custom Controls
- Data Display
- Layers
- Data Layers
- Visualizing Data
- Overlay
- Overview
- Markers
- Info Windows
- Shapes
- Ground Overlays
- Custom Overlays
- Panorama
- Basics of Creating Panoramas
- Geocoder
- Calling the Geocode/Reverse Geocode APIs using Geocoder
- Converting between Coordinate Systems using Geocoder
- Drawing
- Basics of Creating a Drawing Tool
-
Examples
- Digest
- Examples
- Map
- Basic map
- Adjusting map options
- Setting map types
- Checking map bounds
- Moving the map
- Using the HTML5 Geolocation API
- Full screen map and mini map
- Map Type
- Tile index grid map type
- Image tile map type
- Creating a custom map type
- Dynamically changing the projection and tile size
- Using two map types together
- Starcraft The Hunters map type
- NAVER Green Factory map type
- Canvas tile map type
- Event
- Basic events
- KVO events
- Overlay’s events
- Controls
- Adding or removing map controls
- Setting map control styles
- Setting map control locations
- Creating cutsom controls
- Layers
- Displaying the NAVER bicycle layer
- Displaying the NAVER cadastral map layer
- Displaying the NAVER live traffic layer
- Displaying the NAVER street view layer
- Creating a custom layer
- DataLayer
- Displaying the GeoJSON data layer
- Displaying the GeoJSON data layer for administrative districts
- Displaying the KML data layer
- Displaying the GPX data layer
- Visualization
- Visualizing a heatmap
- Visualizing a dot density map
- Changing heatmap spectrum
- Creating a weighted heatmap
- Creating a weighted dot density map
- Overlay
- Displaying a custom overlay
- Marker
- Displaying a marker
- Using an image icon
- Using sprite image icons
- Using HTML icons
- Using symbol icons
- Adjusting the size of image icons for retina displays
- Adjusting the size of sprite image icons for retina displays
- Moving a marker to a click point
- Displaying animated markers
- Clustering markers
- Handling overlapping markers
- Setting the interaction area of a marker
- Displaying markers only on the visible area
- Using an event handler for multiple markers
- Infowindow
- Displaying an info window
- Using info window options
- Shapes
- Drawing a rectangle, a circle and an ellipse
- Drawing a polygon and a polyline
- Drawing a polygon with a hole
- Using polygon options
- Using polyline options
- Adding arrowheads to polylines
- Drawing a polygon based on click points
- Drawing a polyline based on click points
- Measuring the distance and area of polylines and polygons
- Ground Overlay
- Displaying a ground overlay
- Panorama
- Creating a basic panorama
- Resizing a panorama
- Handling panorama events
- Displaying markers on a panorama
- Displaying a panorama summary information layer
- Displaying a zoom control on a panorama
- Converting between Street View and Aerial View
- Displaying Aerial View icons
- Connecting a map with a panorama
- Geocoder
- Converting between coordinate systems
- Using the geocode/reverse geocode APIs
- Drawing
- Creating the basic drawing tool
- Using drawing tool options
- Extracting and restoring overlay data