Mac って何?それって美味しいの?

マイコンと呼ばれた時代から現在まで、使用記から何から何でも。

iMac Mid2011に除外されたmacOSとWindows10をインストール

iMac 21.5インチ core i5 Mid2011にWindows10をインストールしたところ、

ブートループ問題とオンボードサウンド問題が起こりました。

iMac 12,1 Windows 10 Boot Loop – Fix Intel Graphics issue | zZq Franchise Internationale

対応策が紹介されていますが、めんどうそうですよね。

しかし、OpenCore Legacy Patcher(OCLP)を使って、

除外されたMontereyとWindows10のデュアルOSマシン(別のiMac Mid2011)では

問題なく動いています。

OCLPはMetal非対応のMacに Big sur や Monterey をインストールする方法として

利用させていただいていますが、BOOTCAMPのWindows10にも恩恵があったことに

気付かされました。

もし、macOSはHigh Sierraなどの対象内OSに留めておきたいならば、

OCLPのsettingでnative model をチェックしてBuild Installすれば、

OCLPでも起動できます。

 

MSOfficeの別のファイルからコピー貼り付けでフォントが変わってしまう事象について

知り合いから「あるExcelブックのシート1つを、別のExcelブックへコピーして」と頼まれた。

こんなの簡単、っとシートを別のブックへシートそのままコピーすると、セルの高さが変わってしまい用紙に収まらなくなった。

なぜ?

調べるとフォントが変わっていた。そのためExcelがフォントに合わせ、勝手にセルの高さを変えていたのだ。

これと近い事象を見つけた。

https://answers.microsoft.com/ja-jp/msoffice/forum/all/excel2016%E3%81%A7%E8%B2%BC%E3%82%8A%E4%BB%98/02bd57cc-3949-4669-ae49-d3eed1dc043f

 

f:id:yummac:20220330180916p:plain

テーマのフォント

f:id:yummac:20220330180949j:plain

セルのフォント


コピー元のテーマフォントは ”MS Pゴシック” だが、コピー先のテーマフォントは ”游ゴシック” だった。

単純にテーマフォントを同じ ”MS Pゴシック” にすればいいんじゃない?

でも、コピーしてきたシート以外の、別のシートのフォントにも影響するんじゃ困るよね。

じゃ、コピー前にテーマフォントじゃなく ”MS Pゴシック” に変更しよう。

シートのセルを全選択、フォントを変更。

テキストボックスもあるので、それも全選択してフォント変更。

そして、シートを別のブックへコピーする。

ふぅ、うまくいった。セルの高さ変わってない。

でも、改ページプレビューでは、なぜか収まってない。

うーむ。なぜ?

青い破線を移動して、改ページ位置を指定してみると収まった。

 

でもこの方法、コピー元でテーマフォント以外のフォントも使っていたら、全選択で変更しちゃったらダメだよね。Wordとか、テーマフォント以外のフォントも使うよね。

ちまちま選択してフォントを変更するとかやりたくない、絶対。

憎いテーマ、こいつを使わない方法はないのか?

まてよ、このテーマって昔のWordやExcelには無かったよね。

コピー元をExcel97-2003 5.0/95ブック形式で別名保存してやれば、テーマを使わない書式で保存できるのでは?

お、うまくいった!

今後は ”.doc” ”.xls" 形式で作ろうかなぁ。

Windows IIS で WordPress + Cesium

開発およびテストでは、Windows10 Pro のローカルマシン上に、XAMPPで簡易サーバーを構築し、WordPressを動かしていました。

本番環境は、私が「Linuxではなく、Windowsのほうがサクッと(構築)できて、メンテナンスもしやすいのでは?」と提言してしまったため、Windows Serverで運用することになりました。まったく調べもせず、経験も無く。

本番への移行手順の確認のため、ローカルマシンにWindows IISの設定、MySQLPHPWordPressを個々にインストールし、テスト環境を構築します。

WordPressの設定、子テーマやプラグインのインストールも終わり、サンプルデータの入ったサイトを動かしてみる。

ん?Cesiumが・・・
KMLファイルのロードで引っかかっていてコースが表示されない。

IISのファイルアクセス権限か何かか?と思い、そのあたりの設定をいじってみるが変わらない。これで、しばらく途方に暮れる。

そして、ネット上を彷徨ったのちに見つけた!

javascript - ASP.net mvc application hosted on server fails to load cesium map resource - Stack Overflow

これと同様の事象ではないか?
リンク先のweb.configを入れてみる。
やった!コースが表示された!

ああ、これで先に進める。

Cesiumで自転車ツアーのデモ

 

yummac.hatenablog.jp

その後、頑張って作りました。
ソースコードは、整理できてから公開したいと思います。

WordPress

  • GPX形式からKML形式、CZML形式変換プラグイン(管理画面)
  • 固定ページや投稿にCesiumを埋め込むショートコード作成

Cesium

  • ボタンおよび説明枠を追加
  • 自転車を走らせる3Dツアー機能を追加
  • 不具合対策 

Cesiumを使った、GarminサイクルGPSのルート表示と
その3Dツアー表示のデモムービーです。

youtu.be

ラインをクリックするとコース名と記事リンクが表示されます。
TOURボタンをクリックで自転車ツアーが始まります。
CAMボタンで、カメラ位置を真上(方角固定)/鳥瞰図(バードビュー)切り替え。
+-5xボタンでツアー速度を増減できるようにしました。

youtu.be

私のPCのパワー不足でレンダリングに時間を要しますが、
なかなか楽しめ、見ていて飽きないです。

コースのファイルサイズが大きい、あるいは
コースの本数が増えると読み込みが遅くなる、
Cesiumが起動しなくなる点をどう克服するかが課題です。

GarminサイクルGPSデータを地図上に表示してWordPress投稿とリンク(Cesium編)

 

 

yummac.hatenablog.jp

 

初めてで何もわからないので、とりあえずCesiumを動かしてみる。

XAMPP + WordPressアドオン でローカルサーバ環境は構築済みなので、
Cesiumをダウンロードし解凍後、
ローカルサーバへコピーするだけでインストール完了。

私は、テスト作業のしやすさやWordPressとの連携も考慮し、
WordPressのuploads下にcesiumを設置した。

北海道地図株式会社さんのスライドショーを参照し、動かしてみる。
やはり最初はHelloworld。おお!動く動く!
ちょっと遊んで、実装の仕様を考える。

やりたいこと

  • WordPressの固定ページに、Cesiumで日本地図を表示。
  • GarminのサイクルGPSデータを使って、地図上にラインを引く。
  • 地図上のラインをクリックすると、投稿記事へのリンクが表示される。

 

最初、WordPressの固定ページにCesiumのスクリプトを埋め込み、
テーマヘッダに必要な記述を追加する方法で実現した。
でも、インラインフレームで設置する方が、簡単で幸せだった。

GarminConnectでエクスポート可能な形式はGPXとFIT。
しかし、Cesiumでは両形式とも対応していません。
とりあえず、Googleマイマップ編でインポートしたものを、
Cesiumで対応しているKML形式で出力します。

KMLファイルを読み込んで表示するスクリプトです。

var viewer = new Cesium.Viewer('cesiumContainer');
var BikeRoot = viewer.dataSources.add(Cesium.KmlDataSource.load('./bikeroot.kml'));
viewer.zoomTo(BikeRoot);

 

f:id:yummac:20210104174233p:plain

f:id:yummac:20210104174253p:plain


なかなか悪くない。はじめてにしては上出来だ。

3D表示を活かし、動きのあるものへと改造意欲が湧いてくる。
が、いくつかの問題にも直面するのであった。

GarminサイクルGPSデータを地図上に表示してWordPress投稿とリンク(Googleマイマップ編)

 

yummac.hatenablog.jp

 

FacebookからWordPressへ引っ越しで、並行して作業していた内容になります。

移行しようとしているFacebookの記事、
一番の目的は「日本の各地を自転車で走ったときの日記」
を別のサイトにまとめたいわけですが、
「自転車で走行したルートを日本地図に描いて、
それをクリックすると対応しているFacebookの記事ページに飛ぶ」ということを、
クリッカブルマップではなくFlashを使って作っていたようで、
それもWordPress移行時に実現してほしいとのことでした。

WordPressでも同様の機能を実現するにあたり
走行記録ごとに走行ラインをエディタで描きリンクを張る、
という面倒なことは避けたい。やりたくない。

なら、走行ルートのライン表示は、GarminのサイクルGPSのデータを使おう。
地図は、サイトに埋め込みやすいGoogleマップでどうだろう。
マイマップならGPXファイルをインポート可能だ。

記事リンク付きマップの作成手順

  1. GarminConnectからGPX形式でコースデータを出力
  2. Googleマイマップ「レイヤーを追加」「インポート」でGPXファイルをインポート
  3. 出発地と目的地は邪魔なため削除(ラインだけ残る)
  4. 「編集」で説明欄に投稿記事のURLを貼り付ける(自動でリンクになる)
  5. 必要なだけ1から4の繰り返し
  6. マイマップ「自分のサイトに埋め込む」でiframeのHTMLを生成
  7. WordPressの固定ページに生成したHTMLを埋め込む

f:id:yummac:20201231190511p:plain

Googleマイマップ


とりあえず、作りこみの手間をかけずに実現する方法で、暫定的に良しと思った。
が、しばらくして問題に直面する。

GPXファイルは5MBが上限で、それを超えるファイルはインポートできない。
また、レイヤーは10個までで、1つの地図上に10コースまでとなる。

10個じゃ、ぜんぜん足りない。あと、5MB超えるのも結構ある。

他の方法を調べているうちに、あるサイトのプレゼンテーション資料を目にする。

Cesium?3D Mapping?こんなのが無料で使えるの?!しかも簡単そう。

それから、Cesiumを使って目的の機能を開発していくことになります。 

yummac.hatenablog.jp

 

FacebookからWordPressへの引っ越し(JSONファイル編)

 

yummac.hatenablog.jp

 FacebookからエクスポートしたJSONファイル、最初は何もわからず(資料がないんだもん)、データ構造を解析して投稿を抽出していました。
その後のGraphAPIでは、リファレンスが用意されており、またGraphAPIエクスプローラを利用することで、データ構造を確認しながら開発しました。
エクスポートしたJSONファイルのデータ構造と、GraphAPIで取得できるデータ構造、異なる部分もありますが、わかってしまえばそんなに苦ではありませんでした。

データの取得は、file_get_contentsでJSONファイルを読み込む。
日本語デコード("\u00xx")は正規表現で置換する。(正規表現ちんぷんかんぷんですが)
データの階層の違い、attachments構造の違いに合わせコーディングする。
画像や動画は、Facebookからエクスポートしたファイルを解凍し、フォルダごとWordPressのuploadsにアップロードしておく。投稿データのattachmentsをもとに、メディア登録する。

 

//実行時間制限延長(秒) 0は無制限 このスクリプトのみ有効
$maxtime = 3600;
ini_set("max_execution_time",$maxtime);

// アップロード用ディレクトリのパスを取得。
$wp_upload_dir = wp_upload_dir();

//Facebook jsonfile
$jsonfile = 'wordpress uploads下にアップロードしたjsonfile';
$graphNode = file_get_contents($wp_upload_dir['baseurl'].$jsonfile);

//facebook日本語マルチバイトデコード"\n00xx"-"%xx"に置換してURLDecode
$patterns = '/\Q\u\E00([0-9A-Fa-f]{2})/';
$graphNode = preg_replace_callback($patterns, 
        function ($matches) {
            return rawurldecode('%' . $matches[1]);
        }, $graphNode);

$json = json_decode($graphNode,true);
if(json_last_error() !== JSON_ERROR_NONE){
    // エラー処理
} else {
    if (array_key_exists('group_posts',$json)) {
        //グループ投稿jsonはgroup_posts,activity_log_dataを削って階層同じにする
        $json = $json['group_posts']['activity_log_data'];
    }
}

//jsonfileからの場合
$feed = $json; //そのまま

foreach ( $feed as $feeddata ) {
    //attachments
    //$feeddata['attachments'][0]['data']下の配列にあります。存在チェック要。
    //         ['attachments'][0]['data'][n]['media']['uri']にダウンロードしたファイル名で入っています。
    //メディア登録するコードを記述します。
    //$atthtml = '<img src="{$url}" >'; //メディア登録した画像や動画を投稿に埋め込むHTMLを作成しよう。

    //insertpost
    $post_content = $feeddata['data'][0]['post'] . $atthtml;
    $post_title = mb_strimwidth($post_content,0,20,"..."); //Facebookの投稿はタイトル無いので。

    $post = array(
        'post_content'   => $post_content, // 投稿の全文。
        'post_title'     => $post_title, // 投稿のタイトル。
        'post_status'    => 'publish', // 公開ステータス。デフォルトは 'draft'。
        'post_type'      => 'post', // 投稿タイプ。デフォルトは 'post'。
        'post_date'      => wp_date("Y-m-d H:i:s",$feeddata['timestamp']) // 投稿の作成日時。
    );

    // 投稿をデータベースへ追加
    $postid = wp_insert_post( $post );
}

今回もシンプルにさせていただきました。
処理時間が長くなるとエラーで中止されてしまうので、
制限時間を指定しておきます。
処理が終了するまで、ブラウザのクルクルが回っています。気長に待ちます。
attachmentsのところはごめんなさい。
必要であればご自身で記述してください。

依頼されているFacebookは、投稿データが何百件、何千件とあります。
添付の画像ファイルもすごく多いので、データを範囲指定して取り込みますが、数時間ごと、何回かに分けて実行します。