Maptomo API <MaptomoScreen>

Maptomo API  のドキュメントです。

 

Operating environment

Browser

  • Chrome 最新版
  • Firefox 最新版

Sample Program

Engine / Layer

Engine Layer:  code
Leaflet
  • OpenStreetMap: osm
  • OpenStreetMap Monochrome: osm_monochrome
  • 国土地理院 標準地図: gsi_std
  • 国土地理院 淡色地図: gsi_pale
  • 国土地理院 写真: gsi_seamlessphoto
  • 国土地理院 白地図: gsi_blank
  • 国土地理院 陰影起伏図: gsi_hillshademap
  • MIERUNE: mierune
  • MIERUNE MONO: mierune_mono
  • Stamen Toner-Background: toner_background
  • Stamen Toner-Lite: toner_lite
  • Stamen Watercolor: watercolor
  • Esri World Topo Map: esri_world_top
  • Esri Ocean Base Map: esri_ocean_base
  • Geospatil Information Authority of Japan (GSI): gsi_stden
Google Map
※利用には、別途 Google Maps Platform の Maps JavaScript API が必要
  • ROADMAP: google_roadmap
  • SATELLITE: google_satelite
  • HYBRID: google_hybrid
  • TERRAIN: google_terrain

 

Overlay

Engine Overlay: code
ALL
  • OpenRailwayMap: openrailwaymap

 

Class

Class Return Require Description
MaptomoAuth(<Object>certif) <Object>certif * キー情報をもとに、ライセンス認証結果を返す
MaptomoScreen(<Object>certif) -- * キー情報、認証情報をもとに、地図情報のクラスを生成する

 

Methods

地図や図形、ポイントなどを操作するメソッドです。

Method Return Description Counter
draw(<Object>params) -- パラメータをもとに地図を描画する +1
※地図レイヤーを切り替えた時も含む
getMapEngine String 地図エンジンの種類を文字列で返す 0
getMapContainerId String 地図を描画する要素IDを文字列で返す 0
getSelectShape() JSON Object 地図上で選択されているポイント、ライン、ポリゴンのカスタム情報を配列で返す 0
moveLocation([] <point>) -- 指定の座標があればそこを中心に移動し、なければ中心に戻す 0
exportGeoJson() JSON Object 地図上に描画されているデータを配列で返す 0
locationGeocoder(address) JSON Object 住所や地名から地図を移動する(未搭載)

  • 複数リストがある場合には先頭になる
  • 戻り値には経度緯度、地図サイズなど
 0
[未]geoCoder JSON Object 住所文字列からGeocode<lon, lat>を返す --

* Counter: Maptomo API アクセスのカウント数

 

Properties

certif

Property Type Default Description
maptomo String '' MaptomoAPI Key
gmap String '' Google Maps API Key

 

params

Property Type Default Description
container Object <container> container を参照 地図を描画するHTML要素
center [] <point> point を参照 初期の中心座標
engine String 'leaflet' 利用する地図エンジン

  • leaflet: Leafletエンジン
  • gmap: Google Maps API
layer String 'osm' エンジンごとのレイヤーの種類
layerlist [] [] 選択可能なレイヤーの種類のリスト
size Number 16 地図の縮尺サイズ {1..20}
サイズの最小値、最大値はレイヤーによって異なる
lang String 'ja' 言語
option Object <option> option を参照 地図オプション
style Object <style> style を参照 描画する要素のスタイル情報
features [] <features> features を参照 描画する点、線、面の情報

 

Point

Property Type Default Description
coordinates [] * GeoJSONの仕様に則り、配列内は経度(longitude),緯度(latitude)の順番

 

Options

container

Property Type Default Description
id String 'mt-map' 地図を描画する要素ID
height String '600px' 地図の高さサイズ
width String 'auto' 地図の横サイズ
margin String '0px' 利用する地図エンジン

 

option

Property Type Default Description
mode String 'draw'
  • draw: 描画可能
  • show: 閲覧のみ。矩形を操作できない
    描画ボタンは非表示（option.draw = falseになる）
//sidebar Boolean true 描画のスライドの表示/非表示
* 未搭載
zoom Boolean true 拡大縮小ボタンの表示/非表示
present Boolean true 現在地に移動するボタンの表示/非表示
* 利用にはブラウザごとに現在地の認識の許可が必要
draw Boolean true 描画ボタンの表示/非表示
* option.mode = show の際には、falseになる
layer Boolean true レイヤー切り替えボタンの表示/非表示
Layerの一覧
overlay Boolean true オーバーレイ選択の表示/非表示
Overlayの一覧
scale Boolean true 距離の表示/非表示
logo Boolean true Maptomo ロゴの表示/非表示
dragging Boolean true ドラッグで地図の中心地を移動する
touchZoom Boolean true タッチによるズーム操作
scrollWheelZoom Boolean true マウスホイールによるズーム操作
doubleClickZoom Boolean true ダブルクリックによるズーム操作
boxZoom Boolean true [Shift] + ドラッグによるボックスズーム操作
tapOperation Boolean true タップによるズーム操作
keyboardOperation Boolean true キーボードによる操作
miniMap Boolean true * 未搭載
selectColor String '#cc511a' 選択色

 

style

Property Type Default Description
selectedColor String '#cc511a' 選択時の要素カラー
presentColor String '#cc511a' 現在地ポイントのカラー
defalutTitle String 'Map title' 描画時のタイトル名の接頭文字
defalutColor String '#0066ff'
defalutIconClass String 'fas fa-home'
defalutIconSize String 'normal' ※未搭載
opacity Number 0.8
fill Boolean true
drawColor String '#00bb00'

 

features

Property Type Default Description
id Number null データ詳細ページに移動する際に利用するID
type String null 描画スタイル

  • point: 点
  • line: 線
  • polygon: 面
  • geofile: GeoJSON形式のファイル（未搭載）
coordinate [] null 座標
point, line, polygon仕様
popup Boolean true ポップアップを表示するかどうかのフラグ
※falseの場合、title,html,linkがあってもポップアップされない
title String '' ポップアップに表示される文字列
html String '' ポップアップに表示されるHTML形式の文字列
※この値があると、title, linkより優先される
link [] null ポップアップに表示される文字のリンク化
[url,target] ex. ['https://maptomo.com', '_blank']
class String 'fas fa-home' ポイントアイコンを指定
Font Awesome Freeから選択
color String '#cc511a' 選択色
selected Boolean false 選択可否
center [] null 描画矩形の中心座標 point
※pointの場合には、coordinateになる
custom Object {} 選択しているデータを外部連携サービスにJSON形式で返す

 

coordinate

Property Type Example Description
point [] [lng, lat] 描画する点
*GeoJSON仕様（経度、緯度順に注意）
line [[]] [[lng, lat], [lng1, lat1], [.., ..]] 描画する線
*GeoJSON仕様（経度、緯度順に注意）
polygon [[[]]] [[[lng, lat], [lng1, lat1], [.., ..]]] 描画する面
*GeoJSON仕様（経度、緯度順に注意）
geofile [[]] [[url],[url1],[..]] 描画するGeoJSON形式のURL

 

利用している主なライブラリ

Maptomo API 内部のプログラムで利用している主なライブラリはこちらになります。

 

Copyright© Maptomo , 2022 All Rights Reserved.