Map

TsgcHTMLComponent_Map — Delphi, C++ Builder 및 .NET에서 OpenStreetMap 또는 CartoDB 타일과 사용자 자신의 마커, 팝업 및 툴팁을 갖춘 인터랙티브 Leaflet.js 지도를 렌더링합니다.

한눈에 보기

TsgcHTMLComponent_Map

Leaflet.js 지도 컨테이너와 이를 초기화하는 스크립트를 내보내는 매핑 컴포넌트입니다. 중심, 줌 및 타일 제공자를 설정하고, 마커를 추가한 다음, HTML 속성을 읽습니다.

컴포넌트 클래스

TsgcHTMLComponent_Map

렌더링

Leaflet.js 지도 + 타일 레이어

패밀리

차트 및 시각화

언어

Delphi, C++ Builder, .NET

QuickStart

중심을 맞추고, 마커를 넣고, 렌더링하기

CenterLatitude, CenterLongitude 및 Zoom을 설정하고, TileProvider를 선택하고, 각 지점에 대해 AddMarker를 호출한 다음, HTML을 읽습니다.

uses
  sgcHTML_Enums, sgcHTML_Component_Map;

var
  oMap: TsgcHTMLComponent_Map;
begin
  oMap := TsgcHTMLComponent_Map.Create(nil);
  try
    oMap.CenterLatitude := 40.4168;
    oMap.CenterLongitude := -3.7038;
    oMap.Zoom := 12;
    oMap.Height := '420px';
    oMap.TileProvider := mtCartoDB;

    oMap.AddMarker(40.4168, -3.7038, 'Madrid', 'Head office');
    oMap.AddMarker(41.3851, 2.1734, 'Barcelona');

    WebModule.Response := oMap.HTML;   // Leaflet map + markers
  finally
    oMap.Free;
  end;
end;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Map.hpp

TsgcHTMLComponent_Map *oMap = new TsgcHTMLComponent_Map(NULL);
try
{
  oMap->CenterLatitude = 40.4168;
  oMap->CenterLongitude = -3.7038;
  oMap->Zoom = 12;
  oMap->Height = "420px";
  oMap->TileProvider = mtCartoDB;

  oMap->AddMarker(40.4168, -3.7038, "Madrid", "Head office");
  oMap->AddMarker(41.3851, 2.1734, "Barcelona");

  String html = oMap->HTML;   // Leaflet map + markers
}
__finally
{
  delete oMap;
}

using esegece.sgcWebSockets;

var map = new TsgcHTMLComponent_Map();
map.CenterLatitude = 40.4168;
map.CenterLongitude = -3.7038;
map.Zoom = 12;
map.Height = "420px";
map.TileProvider = TsgcHTMLMapTileProvider.mtCartoDB;

map.AddMarker(40.4168, -3.7038, "Madrid", "Head office");
map.AddMarker(41.3851, 2.1734, "Barcelona");

string html = map.HTML;   // Leaflet map + markers

레퍼런스

주요 속성 및 메서드

가장 자주 사용하게 되는 멤버.

중심 및 줌

CenterLatitude와 CenterLongitude(Double)는 초기 보기를 설정합니다. Zoom(기본값 13)은 줌 레벨을 설정합니다.

타일

TileProvider(TsgcHTMLMapTileProvider)는 mtOpenStreetMap, mtCartoDB(라이트) 또는 mtCartoDBDark를 선택합니다.

마커

Markers(TsgcHTMLMapMarkers)는 핀을 담습니다. 각 TsgcHTMLMapMarker는 Latitude, Longitude, PopupText, TooltipText 및 Color를 갖습니다.

마커 추가

AddMarker(aLat, aLng, aPopup, aTooltip)는 핀을 넣습니다. 팝업은 클릭 시 열리고 툴팁은 호버 시 표시됩니다.

크기 조정

Height('420px' 같은 CSS 길이)는 지도 높이를 제어합니다. MapID는 컨테이너의 요소 id를 설정합니다.

출력

HTML은 Leaflet 스타일시트 링크, 지도 <div> 및 초기화 스크립트를 반환합니다 — 제공하거나, 페이지 템플릿의 BodyContent에 할당하십시오.

리소스

계속 살펴보기

	모든 sgcHTML 컴포넌트60개 이상의 컴포넌트 전체 기능 매트릭스를 둘러보십시오.	열기
	무료 체험판 다운로드30일 체험판에는 60.HTML 데모 프로젝트가 포함됩니다.	열기
	가격전체 소스 코드가 포함된 Single, Team 및 Site 라이선스.	열기

Map