Skip to content

Instantly share code, notes, and snippets.



Last active Aug 29, 2015
What would you like to do?
OpenStreetMap(EPSG:3857)の上にVector Layer(EPSG:4326)を乗せる (OpenLayers 3)
<!doctype html>
<html lang="ja">
<link rel="stylesheet" href="" type="text/css">
.map {
height: 500px;
width: 100%;
<script src="" type="text/javascript"></script>
<title>WGS84 Vector Layer on OSM</title>
<p>球面メルカトル図法(EPSG:3857)なOpenStreetMapの上に世界測地系(WGS84/EPSG:4326)で指定した位置をプロット、図形を描画する<br />(ViewのProjectionはEPSG:3857のまま)</p>
<div id="map" class="map"></div>
<script type="text/javascript">
var map = new ol.Map({
target: 'map',
renderer: 'canvas',
layers: [
new ol.layer.Tile({
source: new ol.source.OSM
new ol.layer.Vector({
source: new ol.source.GeoJSON({
format: new ol.format.GeoJSON({
defaultProjection: 'EPSG:4326'
projection: 'EPSG:3857',
text: '{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[130.42, 32.35],[134.15, 35.27],[139.43, 35.78],[137.32, 31.37]]]}}'
view: new ol.View({
center: ol.proj.transform([134.15, 35.27], 'EPSG:4326', 'EPSG:3857'),
zoom: 6

This comment has been minimized.

Copy link

@Assimilator Assimilator commented Jan 27, 2015

Great conversion example!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.