ポケモン図鑑ジェネレーターを2日かけて作ったよ!!この広告は、90日以上更新していないブログに表示しています。2017-12-12ポケモン図鑑ジェネレーターを2日かけて作ったよ!!どうもふうや(@fwww0707)です。2017年12月11日サービスの開発に1日以上かかってしまいました。使い方お手本がこちらのピカチュウのポケモン図鑑なのですが、それに従って下記画像にある通りフォームに必要事項を入力していくだけです。上記画像に書いてあるとおり漢字や特殊文字には対応していませんのでご注意下さい。ひらがなとカタカナ、英語の大文字、小文字が使用できます。画像は特殊な形式で読み込むためサーバーには一切アップロードされません。作成したポケモン図鑑画像もです。各種フォームの注意事項ですが、Numberは3文字まで、右側は10文字まで、下側の説明は18文字までそれぞれ入力できます。それ以上入力しても反映されないのでご注意下さい。完成イメージを確認する左カラム(スマホの場合はフォーム上)で随時ポケモン図鑑の完成イメージを確認することが出来ます。作成したオリジナルなポケモン図鑑を保存する方法フォームの右下にあるダウンロードボタンを押下することでダウンロードできます。スマホでは新規タブで作成した画像が開くと思いますので長押しで保存して下さい。使い方まとめ需要がありそうで無いようなポケモンずかんジェネレーターですが、皆様のご要望にその都度出来る限り答えてこれから少しずつ機能を追加していこうと思います。元々は型となる画像に字や画像を重ねる仕様で良かったのですが、それでは完成イメージをユーザーが確認できないので、DOM要素仕立てで施しました。html2canvasにCSSのfilterが効かないhtml2canvasはDOM要素をcanvas仕立てに出力するjQueryのライブラリですが、どうもCSSのfilterが効かず2、3時間苦戦しました。APIがものすごく便利だった基本画像はアップロードするものですが、ローカルからの画像をBASE64形式でサーバーにアップロードせずとも読み込むことが出来たのは感動しました。心配だったのがアップロードされた画像の管理(Cronで定期的に削除する予定だった笑)だったのでものすごく今回の開発に助かりました!やっぱりサービス開発はBootstrapベースだなあ今回は標準のBootstrapとマテリアル化するbootstrap-material-designライブラリを使っています。後者!Bootstrapを一発でマテリアル化してくれるのでホント便利です。MAMP上で開発していたのにPHPを使わなかったPHPを使うだろうと想定してMAMP上で開発していたのですが、html、css、javascript(jQuery)だけで済みました。Checker」開発しました!!どうもIT大好きFwwwです。・_・)==○ポケモン図鑑ジェネレーターを2日かけて作ったよ!!Wordpress上でajax経由で関数をactionさせる時はadmin-ajax使うといいよ!月別アーカイブはてなブログをはじめよう!fwwwさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。