ドラクエ10冒険・サイト運営ブログ
MAPその13くらい
期間 Ne
MAPその13くらい
https://dq10as.net/search/ajax/adjacent31.phpワープ線のループの処理とDBからの取り出しまではよかったんですが
なぜかクリック地点の座標がおかしかったので修正したバージョンです。
DBに入れた数値もまたそれ基準でずれているんですが、
多分もう大丈夫でしょう。
MAPその12くらい
期間 Ne
MAPその12くらい
プクランドの画像はウェナと同じレベルまで終わったんですが、いったんスクリプトで箸休めです
と言いましてもベースのシステムは大体終わってるので
より実践的なスクリプトに直すという面倒なやつです。
後必要そうな機能は
MAPの切り替え
マップ表示時のズーム倍率の指定
canvas(ワープの線)の配列での処理
後はUI、phpレベルで検索メニューですかね。
とりあえず簡単そうなcanvasからやっていきます。
マップ表示時のズーム倍率の指定は
構想段階で全く考えていなくスパゲティ解析でできるか怪しいです。
MAPその11くらい
期間 Ne
MAPその11くらい
https://dq10as.net/search/ajax/adjacent29a.phpズーム時にルーラ地点などの座標のズレの解決しました。
ズームボタンを押したときだけ、スクリプトによってズーム倍率で補正をかけてる形です。
そのほか細かい機能入れてます。
こないだもシステムは終わったと言ったような気がしますが、
今回で大体終わりです。
少し嘘つきました、自由なポイントにURLで共有できる機能もつけたいんですが
重い処理になりそうなのでいったん後回しです。
地図画像と座標のDBを終わらせて、動作に問題なければ、ですかね。
はい、その地図画像の編集が大変過ぎるのでスクリプトに逃げてたんですが、
液晶タブレットも準備できたので、そろそろ再開しますかね。
液タブで巨額の赤字とか気にしちゃいけない！！
MAPその10くらい
期間 Ne
MAPその10くらい
https://dq10as.net/search/ajax/adjacent25.php線で結ぶのをおおよそ完成と、
初期地点の設定と
ルーラポイントなどの座標を指定して書くののテストです。
ルーラなどの座標は数が多く、
重たくならないようにcssだけでやろうと思ったんですが、
なぜか相対位置指定(％)にすると画像の入れ替わりの倍率で要素が消滅しちゃうんです。
ちょっと意味が分かりません。
ズームボタンを押したファンクションのJavascriptで補正が必要ですかね。
ちょっときゅうけい。
線を引きたかった話＿MAPその9くらい
期間 Ne
線を引きたかった話＿MAPその9くらい
https://dq10as.net/search/ajax/adjacent19.phpとてもとても重いのでアクセスしない方が良いです
マップにワープの線を引きたかったんですが、
かなりいろいろな問題にぶつかりましてこんな時間ですよ。
とりあえずchrome系では動きますが・・・。
Firefoxでは線自体が表示されてません。
HTMLで自由に線を引くにはcanvasしかないと思うんですが、
Firefoxでcanvasの最大サイズがざっくり探った感じ、
11200x11160px 1.25億画素あたりが上限のようです。
ええ、十分大きいですよね。
え？
私が用意した画像サイズ？
16000x16000px 2.56億画素です。
やりすぎました・・・
なのでcanvasを引き延ばすしかないかなと思ってますが
どうなるでしょう
あとlazyloadも入れないとですね
MAPその8くらい
期間 Ne
MAPその8くらい
https://dq10as.net/search/ajax/adjacent16.php細切れのMAP画像を掴んで意図せず別のタブに開いてイラッとするので改良しました。
ブラウザがドラッグできる要素は画像かリンクくらいだと思うんですが、
html5.1からdraggable属性が追加され、
掴める要素と摘まめなくする要素を指定できるようになりました。
ドラッグさせたくない画像に対しては
img src="～.jpg" draggable="false"
としてやれば掴めなくなります。
でさらに、その代わりに掴ませたい要素で画像を入れ子にして、
その要素を draggable="true" としてやればOKですね。
MAPその7くらい
期間 Ne
MAPその7くらい
https://dq10as.net/search/ajax/adjacent15.phpマップの縮小拡大で画像を変更しないとまずいでしょ、と
ふと思いましたので、倍率で変更する仕組みを作ってみました。
切り替わったかパッと見でわからないのでテスト的に色を変えてます。
MAPその6くらい
期間 Ne
MAPその6くらい
今日のMAPのテストページです。https://dq10as.net/search/ajax/adjacent14.php
地図を移動するスクリプトを自前のにしました。
あとズームの基準点を表示しているMAPの中央地点に設定しました。
ベースのシステムは完成ですかね。
あと問題は細切れにした画像をつかんでしまっているので、
これはなんとかしないとですね。
MAPのテストページその5くらい
期間 Ne
MAPのテストページその5くらい
と言うことでMAPのテストページです。https://dq10as.net/search/ajax/adjacent5.php?adjacent=ランドンフット
ジャンプ機能を実践的に使えるように、
DBから取り出した座標に汎用的に飛べるようにしたのと、
(地名ごとにスクリプトを書くのではなく、クリックした地点に書かれている座標を取得すると言う意味)
ズーム機能です。
縮小拡大は実際にボタンを押すのではなく、
ホイールでボタンを押すようにするか、スライダーかその両方かですね。
ジャンプに対してもズーム倍率を適応させないとですね。
あとやっぱり画像を移動するスクリプトが気にくわないです。