セレクトメニューの都道府県は毎回、作るよりストックしておくべし。

2021.12.13

Logging

駆け出しフロントエンドエンジニアさんや駆け出しコーダーさんの中にはお問い合わせなどで、都道府県を毎回、書いている人はいると思いますが、大体、同じことを何回もするのは無駄です。なので、自分専用の雛形を作っておくといいですよ。そうする事によって作業は結構、短縮されたりします。今回は自分がよく使う、セレクトメニューの都道府県をJSで都道府県リストを生成するように作りました。

都道府県生成

繰り返しになりますが、こんな感じに自分が使用するデータや独自の関数はストックしておくと作業効率は上がります、毎回調べてプログラミングやコードを書くのは仕事上では手間になるので辞めた方が良いです。

最後にJSコードとGitHubのリンクを貼っときますので、ご自由使用くださいませ。

https://github.com/zip358/select_jp_ken

let useKendata = [
    {'no':'01','name':'北海道'},
    {'no':'02','name':'青森県'},
    {'no':'03','name':'岩手県'},
    {'no':'04','name':'宮城県'},
    {'no':'05','name':'秋田県'},
    {'no':'06','name':'山形県'},
    {'no':'07','name':'福島県'},
    {'no':'08','name':'茨城県'},
    {'no':'09','name':'栃木県'},
    {'no':'10','name':'群馬県'},
    {'no':'11','name':'埼玉県'},
    {'no':'12','name':'千葉県'},
    {'no':'13','name':'東京都'},
    {'no':'14','name':'神奈川県'},
    {'no':'15','name':'新潟県'},
    {'no':'16','name':'富山県'},
    {'no':'17','name':'石川県'},
    {'no':'18','name':'福井県'},
    {'no':'19','name':'山梨県'},
    {'no':'20','name':'長野県'},
    {'no':'21','name':'岐阜県'},
    {'no':'22','name':'静岡県'},
    {'no':'23','name':'愛知県'},
    {'no':'24','name':'三重県'},
    {'no':'25','name':'滋賀県'},
    {'no':'26','name':'京都府'},
    {'no':'27','name':'大阪府'},
    {'no':'28','name':'兵庫県'},
    {'no':'29','name':'奈良県'},
    {'no':'30','name':'和歌山県'},
    {'no':'31','name':'鳥取県'},
    {'no':'32','name':'島根県'},
    {'no':'33','name':'岡山県'},
    {'no':'34','name':'広島県'},
    {'no':'35','name':'山口県'},
    {'no':'36','name':'徳島県'},
    {'no':'37','name':'香川県'},
    {'no':'38','name':'愛媛県'},
    {'no':'39','name':'高知県'},
    {'no':'40','name':'福岡県'},
    {'no':'41','name':'佐賀県'},
    {'no':'42','name':'長崎県'},
    {'no':'43','name':'熊本県'},
    {'no':'44','name':'大分県'},
    {'no':'45','name':'宮崎県'},
    {'no':'46','name':'鹿児島県'},
    {'no':'47','name':'沖縄県'},
];
document.getElementById("ken").insertAdjacentHTML('afterbegin',(function(ken){
    let str = '';
    for (const key in ken) {
        str+= '<option value=' + ken[key].no + '>' + ken[key].name +'</option>';
    }
    return str;
}(useKendata)));

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

01, 39, github, JS, let, name, no, useKendata, エンジニア, エンド, お問い合わせ, コーダー, コード, こと, ご自由, ストック, セレクト, データ, プログラミング, フロント, メニュー, リスト, リンク, , , , 今回, 仕事, 何回, 作業, 使用, 効率, 北海, 大体, 専用, 感じ, 手間, , 最後, 毎回, 無駄, 生成, 短縮, 自分, 都道府県, 関数, 雛形, 駆け出し,

JavaScript(js)でcsvファイルを読み込み自動計算する(合計sum)

2021.11.17

Logging

謎の訪問者さんが検索窓を使用して何度かググっているので要望にお応えJavaScript(js)でcsvファイルを読み込み自動計算する(合計sum)というものを作りました。以前、csvを元にテーブルを作成するものを作っていました、ソースコードはそれを応用して作っています。実際、数万行に渡るファイルを自動計算するには、かなり爆速のパソコンが必要になります。このプログラムで耐えれるのは精々、1,000行あたりだと思います。

過去のコードと今回のサンプルデモのリンクを貼っときます。

どうぞご自由にお使いください。

https://zip358.com/tool/demo47/

"use strict";
var csv = {
	load:async function(filename,id){
		const responseFile = await fetch(filename);
        const result = await responseFile.text()
		let separate1 = /\r\n/;
		let separate2 = ",";
		let data = (result.split(separate1)).map(function(value){
			return (value.split(separate2)).map(function(value1){
				return value1;
			});
		});
		let sum =[];
		for (const usedata of data) {
            (usedata).map(function(val,index,array){
                sum[index] = (isNaN(parseInt(sum[index]))?0:parseInt(sum[index])) + parseInt(array[index]);
            });
		}
        console.log(sum);
		document.getElementById(id).innerHTML = sum.join(",");
		return "OK";
	}
};
csv.load("math.csv?", "sum");
JSでCSVファイルの和

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

000, , async, await, const, CSV, fetch, filename, function, ID, javascript, JS, load, quot, res, responseFile, strict, sum, use, var, お応え, かなり, コード, ご自由, サンプル, ソース, それ, テーブル, デモ, パソコン, ファイル, プログラム, もの, リンク, 今回, 以前, 何度か, 作成, 使用, , 合計, 実際, 必要, 応用, 数万, 検索窓, 爆速, 精々, 自動, 要望, 計算, 訪問者, , 過去,

即席デザイン文字生成[iDrawジェネレーター]という命名がダサいw

2020.07.09

Logging

即席デザイン文字生成[iDrawジェネレーター]というWEBツールを作りました。あのイケハヤさんみたいなテキスト文字だけのアイキャッチ画像みたいなものが生成可能です。これをどうして作ったのか?

昔、パソコンが壊れてアドビが一時期があり、その時に仕方ないのでこれでアイキャッチ画像を生成して使用しておりました。とくに凝ったデザイン文字が生成されるわけではなく。書体と背景色や文字色などを変更してそれらしいものを即席で作るというものです。昔、作ったので変数の命名もかなり杜撰な感じでしたがひとまず動く形になりましたので、公表しますね。

ご自由にお使いいただければ幸いです。
https://zip358.com/tool/idraw/

この他にも無料ツールをいろいろ作っているのでご自由にお使いいただければと思っています。

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

iDraw, , web, あい, アドビ, イケハヤ, お使い, かなり, キャッチ, これ, ご自由, ジェネレーター, それ, ツール, テキスト, デザイン, パソコン, もの, わけ, 一時期, , 使用, 公表, 即席, 可能, 命名, 変数, 変更, , 感じ, 文字, , , 書体, 杜撰, 無料, 生成, 画像, 背景色,

天気予報を取得するアレを使用してみた(Openweathermap_api)。

2020.02.19

Logging

ご自由にお使いください。尚、openweathermap.orgより
アカウントを作成後、APIKEYを取得しお使いください。
下記のソースコードをコピーしての可変等は可能です。

余談

天気予報の絵文字が合致していていないかもしれません。
また都道府県のIDもズレている場合、お好みで変更ください。
ZIPコードで情報を取得するとより正確な天気予報となるそうです。

下記のコードを実行するとこんな感じになります。

ソースコードはこんな感じになります。

<?php
class Openweathermap_api{
    public $url = "https://api.openweathermap.org/data/2.5/weather?id=";
    public $appid = "apikey";
    public $ken ="";
    public $response ="";
    public $icon = array(
        "01d"=>"?",
        "02d"=>"?",
        "03d"=>"?",
        "04d"=>"?",//?
        "09d"=>"?",
        "010d"=>"?",
        "011d"=>"?",
        "013d"=>"?",
        "050d"=>"?",
    );
    function __construct()
    {
        $this->ken = (object)(json_decode(@file_get_contents("ken.json"),true));
    }
    function api(){
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $this->url);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        $this->response =  (object)json_decode(curl_exec($ch),true);
        curl_close($ch);
    }
}
$tenki = New Openweathermap_api();
$tenki->url = "https://api.openweathermap.org/data/2.5/weather?id=".$tenki->ken->kochi["id"]."&appid=".$tenki->appid;
$tenki->api();
print($tenki->icon[str_replace("n","d",$tenki->response->weather[0]["icon"])]);
var_dump($tenki->response);
{
    "hokkaido": {
        "id": "2130037",
        "kenmei": "北海道",
        "kenfurigana": "ほっかいどう"
    },
    "aomori": {
        "id": "2130656",
        "kenmei": "青森県",
        "kenfurigana": "あおもり"
    },
    "iwate": {
        "id": "2112518",
        "kenmei": "岩手県",
        "kenfurigana": "いわて"
    },
    "miyagi": {
        "id": "2111888",
        "kenmei": "宮城県",
        "kenfurigana": "みやぎ"
    },
    "akita": {
        "id": "2113124",
        "kenmei": "秋田県",
        "kenfurigana": "あきた"
    },
    "yamagata": {
        "id": "2110554",
        "kenmei": "山形県",
        "kenfurigana": "やまがた"
    },
    "fukushima": {
        "id": "2112923",
        "kenmei": "福島県",
        "kenfurigana": "ふくしま"
    },
    "ibaraki": {
        "id": "2112669",
        "kenmei": "茨城県",
        "kenfurigana": "いばらき"
    },
    "tochigi": {
        "id": "1850310",
        "kenmei": "栃木県",
        "kenfurigana": "とちぎ"
    },
    "gunma": {
        "id": "1863501",
        "kenmei": "群馬県",
        "kenfurigana": "ぐんま"
    },
    "saitama": {
        "id": "1853226",
        "kenmei": "埼玉県",
        "kenfurigana": "さいたま"
    },
    "chiba": {
        "id": "2113014",
        "kenmei": "千葉県",
        "kenfurigana": "ちば"
    },
    "tokyo": {
        "id": "1850144",
        "kenmei": "東京都",
        "kenfurigana": "とうきょう"
    },
    "kanagawa": {
        "id": "1860291",
        "kenmei": "神奈川県",
        "kenfurigana": "かながわ"
    },
    "niigata": {
        "id": "1855429",
        "kenmei": "新潟県",
        "kenfurigana": "にいがた"
    },
    "toyama": {
        "id": "1849872",
        "kenmei": "富山県",
        "kenfurigana": "とやま"
    },
    "ishikawa": {
        "id": "1861387",
        "kenmei": "石川県",
        "kenfurigana": "いしかわ"
    },
    "fukui": {
        "id": "1863983",
        "kenmei": "福井県",
        "kenfurigana": "ふくい"
    },
    "yamanashi": {
        "id": "1848649",
        "kenmei": "山梨県",
        "kenfurigana": "やまなし"
    },
    "nagano": {
        "id": "1856210",
        "kenmei": "長野県",
        "kenfurigana": "ながの"
    },
    "gifu": {
        "id": "1863640",
        "kenmei": "岐阜県",
        "kenfurigana": "ぎふ"
    },
    "shizuoka": {
        "id": "1851715",
        "kenmei": "静岡県",
        "kenfurigana": "しずおか"
    },
    "aichi": {
        "id": "1865694",
        "kenmei": "愛知県",
        "kenfurigana": "あいち"
    },
    "mie": {
        "id": "1857352",
        "kenmei": "三重県",
        "kenfurigana": "みえ"
    },
    "shiga": {
        "id": "1852553",
        "kenmei": "滋賀県",
        "kenfurigana": "しが"
    },
    "kyoto": {
        "id": "1857907",
        "kenmei": "京都府",
        "kenfurigana": "きょうと"
    },
    "osaka": {
        "id": "1853909",
        "kenmei": "大阪府",
        "kenfurigana": "おおさか"
    },
    "hyogo": {
        "id": "1862047",
        "kenmei": "兵庫県",
        "kenfurigana": "ひょうご"
    },
    "nara": {
        "id": "1855608",
        "kenmei": "奈良県",
        "kenfurigana": "なら"
    },
    "wakayama": {
        "id": "1848938",
        "kenmei": "和歌山県",
        "kenfurigana": "わかやま"
    },
    "tottori": {
        "id": "1849890",
        "kenmei": "鳥取県",
        "kenfurigana": "とっとり"
    },
    "shimane": {
        "id": "1852442",
        "kenmei": "島根県",
        "kenfurigana": "しまね"
    },
    "okayama": {
        "id": "1854381",
        "kenmei": "岡山県",
        "kenfurigana": "おかやま"
    },
    "hiroshima": {
        "id": "1862413",
        "kenmei": "広島県",
        "kenfurigana": "ひろしま"
    },
    "yamaguchi": {
        "id": "1848681",
        "kenmei": "山口県",
        "kenfurigana": "やまぐち"
    },
    "tokushima": {
        "id": "1850157",
        "kenmei": "徳島県",
        "kenfurigana": "とくしま"
    },
    "kagawa": {
        "id": "1860834",
        "kenmei": "香川県",
        "kenfurigana": "かがわ"
    },
    "ehime": {
        "id": "1864226",
        "kenmei": "愛媛県",
        "kenfurigana": "えひめ"
    },
    "kochi": {
        "id": "1859133",
        "kenmei": "高知県",
        "kenfurigana": "こうち"
    },
    "fukuoka": {
        "id": "1863958",
        "kenmei": "福岡県",
        "kenfurigana": "ふくおか"
    },
    "saga": {
        "id": "1853303",
        "kenmei": "佐賀県",
        "kenfurigana": "さが"
    },
    "nagasaki": {
        "id": "1856156",
        "kenmei": "長崎県",
        "kenfurigana": "ながさき"
    },
    "kumamoto": {
        "id": "1858419",
        "kenmei": "熊本県",
        "kenfurigana": "くまもと"
    },
    "oita": {
        "id": "1854484",
        "kenmei": "大分県",
        "kenfurigana": "おおいた"
    },
    "miyazaki": {
        "id": "1856710",
        "kenmei": "宮崎県",
        "kenfurigana": "みやざき"
    },
    "kagoshima": {
        "id": "1860825",
        "kenmei": "鹿児島県",
        "kenfurigana": "かごしま"
    },
    "okinawa": {
        "id": "1854345",
        "kenmei": "沖縄県",
        "kenfurigana": "おきなわ"
    }
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

2.5, API, APIKEY, appid, class, data, ID, lt, Openweathermap, org, php, pub, public, quot, url, weather, zip, アカウント, アレ, お好み, コード, コピー, ご自由, ズレ, ソース, 下記, 予報, 余談, 作成, 使用, 取得, 可能, 合致, 場合, 変更, 天気, 実行, 情報, 感じ, 正確, 絵文字, 都道府県,