多分、特殊な例です。

連想配列に、例えば、以下のように同じ名前で、異なる数値が入っていて、同じ名前なら、その値はすべて合計させる場合の処理方法です。

エクセルでいうと「集計」で「合計値」を出す処理です。

$array=[["愛媛県","3"],
		["愛媛県","2"],
		["愛媛県","5"],
		["愛媛県","1"],
		["茨城県","1"],
		["茨城県","1"],
		["岡山県","1"],
		["岡山県","4"],
		["岡山県","5"],
		["岡山県","2"],
		["岡山県","5"]];

PHPでの集計の処理ですが

1. Keyの名前だけで配列を新たに作る（$keys）
2. 新たに作った配列（$keys）を使って、元の配列（$array）から同じ名前の値を取り出す。
3. 最終的に、名前が一つだけで数値が合計した値が入った新しい配列（$total）が出来上がって処理完了。

という処理の仕方をしていきます。

Keyの名前だけで配列を新たに作る（$keys）

それぞれのKeyになっている名前をarray_columnで配列の値として取得します。

array_column

取得した名前は重複していますので、重複した名前をarray_uniqueで削除します。

array_unique

重複した名前は一応、配列になっていますが、名前が入っている配列の番号は数値が飛び飛びになっているので、array_valuesで配列の数値を0から配置し直します。

array_values

以上の処理を行うプログラムは以下のようになります。

$keys=array_values(array_unique(array_column($array,0)));

新たに作った配列（$keys）を使って、元の配列（$array）から同じ名前の値を取り出す。

新たに作った配列$keyを使って、元の配列$arrayから同じ名前の値を取り出し、合計していきます。命令は次のように記述するといいかと思います。

foreach($keys as $value){
	$num = 0;
	foreach($array as $row){
		if($row[0]==$value){
			$num = $num+$row[1];
		}
	}
	$total[$value] = $num;
}
print_r($total);

以上の処理で、こんな感じに出力されるはずです。

Array
(
    [愛媛県] => 11
    [茨城県] => 2
    [岡山県] => 17
)

ブログの反応がどれくらいあるか、知りたいので、ランキングサイトに入ってみました。よろしければクリックお願いします。

ウェブサイトで、四角いボタンっぽいレイアウトの中央に文字や画像を配置したいときの書き方。

こういうレイアウトを作りたい。

 

できれば、こういう並びを作りたい、という場合。

結論を書けば、2020年現在であれば、display:flex;をこんなレイアウトを作成したい親要素と子要素に指定すればOK。

例えば、上の1つだけのレイアウトであれば、HTMLを次のように書くのであれば

 <div class="one">ボタン1</div>

CSSは以下の感じでコーディングすればいい。

.one{
            display: flex;
            box-sizing: border-box;
            border:2px solid #999;
            width:200px;
            height: 200px;
            align-items: center;
            justify-content: center;
}
 

では、こんなレイアウトのように、複数に増やす場合は、親要素にもdisplay:flex;を追加する。まずHTMLは次のようにコーディングしたとします。

<div class="wrapper">
            <div class="one">ボタン1</div>
            <div class="one">ボタン2</div>
            <div class="one">ボタン3</div>
</div>

上記のHTMLに対して、CSSはこんな感じにコーディングします。

.wrapper{
            width:640px;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            margin: auto;
            font-size:1.5rem;
}
.one{
            box-sizing: border-box;
            border:2px solid #999;
            width:200px;
            height: 200px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

display:flex;が無効になるブラウザでは使えませんが、今時のブラウザなら、大抵は大丈夫だと思います。ダメなら、違う方法を試すしかありません。

なお、海外の質問サイトに「どうやって中央に配置すればいいの？」という質問に対して、色々なコードがサンプルとして回答されていました。
他にはどんなHTML/CSSをコーディングすればいいのか、知りたい方は、参考になると思うので閲覧することをオススメします。

How to center an element horizontally and vertically
https://stackoverflow.com/questions/19461521/how-to-center-an-element-horizontally-and-vertically

ブログの反応がどれくらいあるか、知りたいので、ランキングサイトに入ってみました。よろしければクリックお願いします。

XMLHttpsRequestオブジェクトは、いわゆるAjaxの時にJavaScriptでHTTPリクエストをするための仕組みです。

検索するとPOSTの方法が結構まとまってなくて、jQueryなどでAjaxばっかりしていると書き方がわからなくなるので、まとめてです。

XMLHttpsRequestオブジェクトを使うときはこんな記述をします。

let xhr = new XMLHttpRequest();

xhr.onreadystatechange = function () {
　　　　　　　　if (this.readyState == 4 && this.status == 200) {
　　　　　　　　　　　　サーバーからのレスポンス受信完了（readyStateが4）
　　　　　　　　　　　　HTTPリクエスト処理が成功（statusが200）のときの処理を記述
　　　　　　　　}
　　　　};
xhr.open("POST", ‘https//localhost/exmaple.txt’);
xhr.send();

XMLHttpsRequestオブジェクトの使い方について詳細は、MDN web docsのドキュメントを参考。

XMLHttpRequest
https://developer.mozilla.org/ja/docs/Web/API/XMLHttpRequest

POSTでデータを送信したいときは、send()に、パラメータを設定してデータを処理します。

わかりやすいPOSTのやり方は大きく二つ。

1. setRequestHeader()を設定し、”Content-type", "application/x-www-form-urlencoded”を定義する
2. formDataオブジェクトを使う

setRequestHeader()を設定し、”Content-type", "application/x-www-form-urlencoded”を定義する

send()のパラメータにGETでデータをやりとりする書き方で記述します。

例えば以下のように記述します。

send(“name=taro&age=25&where=japan”);

send()を記述する前に、setRequestHeader()に”Content-type", "application/x-www-form-urlencoded”を定義します。

xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
send(“name=taro&age=25&where=japan”);

formDataオブジェクトを使う

formDataオブジェクトを使う方法は、setRequestHeader()を使うより楽です。

formData
https://developer.mozilla.org/ja/docs/Web/API/FormData

使い方は、まずFormDataオブジェクトを作ります。

var formData = new FormData();

FormData.appendを使って、POSTで使う値を追加します。

例えば以下のように記述します。

FormData.append(‘name’,’taro’);
FormData.append(‘age’,’25’);
FormData.append(‘where’,’japan’);

なお、次のようにFormDataを設定するときに、formをオブジェクトごと設定すれば、一回ごとにFormData.appendを設定しなくて済みます。

var myForm = document.getElementById('myForm');
var formData = new FormData(myForm);

この他に注意する点として、文字化けなどの問題が発生しないように、sendの値は、encodeURIComponent()でエンコードすることぐらいですかね。

ブログの反応がどれくらいあるか、知りたいので、ランキングサイトに入ってみました。よろしければクリックお願いします。