[戻る]
新着表示

サイト全面改訂 投稿者:あにねこ 投稿日:2019/07/14(Sun) 12:49:31 No.955

「Web地図を利用したGPSログ表示」を全面的に改訂しました。
(1) 上乗せするGPSデータのファイル形式をKMLからGeoJSONに変更。
(2) GPSファイルをGeoJSONファイルに変換するユーティリティGPX2GeoJSON(GPX→GeoJSONコンバータ)を公開。
(3) OpenLayers、Leaflet、Googleマップ、Bingマップの各々について、GeoJSONを上乗せ表示するルート地図を紹介。
(4) サイトおよびルート地図を記述するHTMLを、XHTML1.0からHTML5に変更。
旧サイト(https://anineco.github.io/gpx2jsgi/)も引き続き閲覧可能です。
最近、ちょこちょこ書き換えていましたが、長雨でインドア生活が続いたおかげ?でまとまった時間がとれ、
一応の完成を見ましたので、アナウンスします。

Re^8: アイコンが非表示 投稿者:マーシー 投稿日:2019/02/13(Wed) 10:00:54 No.952

あにねこさん、おはようございます。

キャッシュクリアしたら表示できました。
ありがとうございました。
お世話になりました。

Re^7: アイコンが非表示 投稿者:あにねこ 投稿日:2019/02/12(Tue) 18:34:20 No.951

私の mac の chrome では表示できました。
ブラウザのキャッシュをクリアして再表示すれば、
アイコンも表示されると思います。

Re^6: アイコンが非表示 投稿者:マーシー 投稿日:2019/02/10(Sun) 10:22:36 No.950

あにねこさん、おはようございます。
データフォルダ修正しました。有り難うございました。
ただIEではアイコンが表示されるのですが、GoogleChromeでは表示されません。
なぜでしょうか?

申し訳ありませんが、今日から2,3日留守になりますので、
その後のお返事で結構です。よろしくお願いします。

Re^5: アイコンが非表示 投稿者:あにねこ 投稿日:2019/02/10(Sun) 00:55:54 No.949

説明がまずくてすみません。
「アイコン変換表」のすぐ前の項目の「データフォルダ」も参照して下さい。
テストURL先の4つのサンプルのうち、2番目のものだけアイコン表示に失敗していますが、
これは ryuo.kml の中のアイコンのURLが http のままです。

地理院地図から Yahoo地図に切替 投稿者:マーシー 投稿日:2019/02/09(Sat) 15:19:33 No.948

地理院地図のデータをそのまま維持しながらyahoo地図に切り替えるには、
(1)Yahoo地図のyahoomap.htmlを用意する。
 次の文をOpenLayersの<head><Script>の適当なところに入れる。

document.getElementById('yahoo').onclick = function() {
center = map.getCenter();
center.transform(proj_3857, proj_4326);
var lat1 = center.lat.toFixed(6);
var lon1 = center.lon.toFixed(6);
var zoom1 = map.getZoom();
var url1 = param.url;
var url2 = "yahoomap.html?";
url2 = url2.concat("lat=",lat1,"&lng=",lon1,"&zoom=",zoom1,"&url=",url1);
var width1 = window.innerWidth;
var height1 = window.innerHeight;
var box1 = "width=" + width1 + ",height=" + height1 + ",resizable=yes";
window.open(url2, '_blank', box1);

(2)次の文を<body><Form>の適当なところに入れる。
<div style="float:left;margin-left:25px;"><input style="color:red" id="yahoo" type="button" value="YahooMap" /></div>
};

アイコンとトラックの軌跡を別々に表示 投稿者:マーシー 投稿日:2019/02/08(Fri) 16:59:19 No.947

(1)アイコンとトラックのURLを別々に用意する
アイコンDataの名前を ○○_i.kml
トラックDataの名前を ○○_t.kml とする

(2) param.url = (param.url.match(/^https?:/) ? '' : baseurl) + param.url;
のあとに
var url_i = param.url;
var url_t = param.url.replace('_i.kml','_t.kml'); ’語尾を入れ替える
を追加する。

(3) var layer = new Y.GeoXmlLayer(param.url);
ymap.addLayer(layer);
icnlayer.execute();
の部分をアイコンとトラックを別々に書く
var icnlayer = new Y.GeoXmlLayer(url_i);
ymap.addLayer(icnlayer);
icnlayer.execute();

var trklayer = new Y.GeoXmlLayer(url_t);
ymap.addLayer(trklayer);
trklayer.execute();

(4)同様に
document.getElementById('gps').onchange = function() {
if (this.checked) {
ymap.addLayer(layer);
layer.execute();
} else {
ymap.removeLayer(layer);
}
};
の部分をアイコンとトラックを別々に書く
document.getElementById('trk').onchange = function() {
if (this.checked) {
ymap.addLayer(trklayer);
trklayer.execute();
} else {
ymap.removeLayer(trklayer);
}
};
document.getElementById('icn').onchange = function() {
if (this.checked) {
ymap.addLayer(icnlayer);
icnlayer.execute();
} else {
ymap.removeLayer(icnlayer);
}
};

(5)<div style="float:left;margin-left:5px;"><input id="gps" type="checkbox" checked="checked" />GPSデータ</div>
の代わりにに次の文を入れる
<div style="float:left;margin-left:5px;"><input id="trk" type="checkbox" checked="checked" />GPStrack</div>
<div style="float:left;margin-left:5px;"><input id="icn" type="checkbox" checked="checked" />Icon</div>

中心十字を表示 投稿者:マーシー 投稿日:2019/02/08(Fri) 16:39:07 No.944

<head>と</head>の間の適当な場所に次の文を入れる

var cross = null;
document.getElementById('crs').onchange = function() {
if (this.checked) {
cross = new Y.CenterMarkControl();
ymap.addControl(cross);
} else {
ymap.removeControl(cross);
cross.destroy();
}
};

(1)の文の前に(2)の部分を入れる。但し(1)(2)の文字は入れない

(1)<div style="float:left;margin-left:5px;"><input id="center" type="button" value="中心座標" /></div>

(2)<div style="float:left;margin-left:5px;"><input id="crs" type="checkbox" />中心十字</div>

備忘録 投稿者:マーシー 投稿日:2019/02/08(Fri) 16:36:54 No.943

yahoomap.htmlを改造して自分の使いやすくしました。
備忘録を投稿したいと思います。まずは先月のあにねこさんの回答から。

<デフォルトを航空写真にする>

ymap.drawMap(new Y.LatLng.fromString(param.lat, param.lng), param.zoom, 'MyTopographicLayerSet');
の行を変更して、
ymap.drawMap(new Y.LatLng.fromString(param.lat, param.lng), param.zoom, Y.LayerSetId.PHOTO);
とする

Re^4: アイコンが非表示 投稿者:マーシー 投稿日:2019/02/08(Fri) 11:49:48 No.942

あにねこさん、こんにちは。
お忙しい所返信ありがとうございます。

gpxejsgi の中の iconlut.xml の中のアイコンの URL を変更しました。
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="iconlut2html.xsl"?>
<!DOCTYPE iconlut SYSTEM "iconlut.dtd" [
<!ENTITY baseurl "https://map.jpn.org/icon/">
]>
でも、発生したKMLファイルは htpp:/ のままです。

それで、KMLファイルを検索(S)→ 置換(R)で htpp:/ → htpps:/ にしました。
やっぱりアイコンは表示されません。
急ぎませんので、よろしくお願いします。テストURLは、以下です。
http://www7b.biglobe.ne.jp/~daigosangakukai/test.htm#

| 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 |

- WebForum -