中級プログラマの自宅でPHP ブログ

自宅用ポータルシステム「MyHome Portal」をオープンソースで公開。MyHome Portalの説明とエンハンス情報。

備忘録:Google Maps Javascript API:主要なスポット(POI)情報ウィンドウを表示させない方法。

Google Maps Javascript APIで作成した地図の主要なスポットをマウスでクリックすると、ポップアップで情報ウィンドウが表示される。

これを、POI(point of interest)と呼ぶ。

f:id:ok2nd:20190823084818j:plain

この情報ウィンドウを表示させないためには、Mapオブジェクトの初期化オプションでclickableIconsプロパティをfalseにする。

map = new google.maps.Map(document.getElementById('map'), {
	zoom: number,
	....
	clickableIcons: false
});

Mapオブジェクトの生成後はマップオブジェクト(map)に対して、次のメソッドを使ってオン/オフを設定できる。

map.setClickableIcons(false);

ChromeのFlash Playerサポート終了に伴い、MyHome Portal「ID管理」修正。

Google ChromeFlash Playerサポートが2020年12月で終了します。

MyHome Portal「ID管理」で、[C]ボタンを押すとクリップボードにIDやパスワードをコピーする機能をFlash Playerを使って実現していました。

f:id:ok2nd:20190810113553j:plain

この機能を、Flash Playerを使わず、JavaScriptで実現する方法に変更します。

MyHome Portalの新バージョンでのパッケージ提供はしません。以下のモジュールを直接修正願います。

【id-manager/list-my-template.php

【id-manager/view-idpass.php

2つのモジュールのclipSetBtn()を以下のように書き換えます。

function clipSetBtn(id, text) {
	var e = document.createElement('textarea');
	e.textContent = text;
	document.body.appendChild(e);
	e.select();
	document.execCommand('copy');
	e.remove();
}

【id-manager/_include_idpass.php

以下の部分を3箇所とも、onmouseoverからonClickに変更します。

onmouseover="clipSetBtn(

↓↓↓

onClick="clipSetBtn(

Google Maps API)マーカーラベルに使っているchart.apis.google.comが使えなくなった。

MyHome Portalのコンテンツの一部でGoogle Maps APIを使った地図があるが、その地図でマーカーラベルにchart.apis.google.comサービスを利用していたが、2019.3.14よりサービス停止になってしまった。

代替案を探したところ、MarkerWithLabelというのが見つかった。

詳細は以下のブログに。

f:id:ok2nd:20190320183626p:plain

MyHome Portal ホームページをGitHubに移行。

無料レンタルサーバー「StarServer Free」が、3か月ごとに契約更新の手続きが必要になってしまった。

ということで、MyHome Portal ホームページをGitHubに移行。

http://ok2nd.starfree.jp/

↓↓↓↓↓

https://ok2nd.github.io/myportal/

 

なお、このブログでリンクしているWebページで、URLが、

http://ok2nd.me/...

になっているのは、以下のサーバーに置き換えてアクセスしてください。

http://ok2nd.sakura.ne.jp/...

クロスドメイン(CORS:Cross-Origin Resource Sharing)問題の回避方法。PHP。

画像ファイルを別サイトから取り込んでcanvas処理をしようとして、クロスドメインにひっかかった。

file_get_contents()を使うことで回避できた。別ページにURLを渡して、file_get_contents()で読み込んだものを返してやる。

詳細は以下のブログで。