Myu: 6月 2023

2023年6月24日土曜日

音声合成、音声認識

Windowsなどでは、なんとかなるが、WebGL（Unity）などでは、まだ発展途上のようだ。Html5などで、なんとかなるようだったので、試してみた。

https://www.petitmonte.com/javascript/web-speech-api.html

を参考にさせていただいた。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
</head>
<body>

<h1>きもち・おねがい　をはなそう</h1>
<form id="form_tts">
  <select id="mySelect" style="width:80%;font-size:24px;">
    <option>ありがとう、ございました</option>
    <option>かなしいです</option>
    <option>たのしいです</option>
    <option>びっくりしました</option>
    <option>ホールで、あそんでも、いいですか</option>
    <option>トイレを、おねがいしても、いいですか</option>
    <option>おはなししても、いいですか</option>
  </select>
  <input type="text" id="txt_tts" style="visibility:hidden">
  
  <!--

-->
  
  <select id="select_tts" style="visibility:hidden">
     <option data-lang="ja-JP" data-name="Google 日本語">Google 日本語 (ja-JP)</option>
    <option data-lang="ja-JP" data-name="Microsoft Sayaka - Japanese (Japan)">Microsoft Sayaka - Japanese (Japan) (ja-JP)</option>
   
  </select>
  <p></p>
  <button id="play" type="submit" style="font-size:36px;">おてほん</button>
</form>

<br><br>
<div>
<button id="btn_stt" style="font-size:36px;">はなしをきく</button>

>>><span id="output_stt" style="font-size:36px;color:red"></span>
  <p id="confidence_stt"></p>
</div>
 
<script>

function speakC(text){
 
    // 再生中
    if (synth.speaking) {
      console.log('再生をキャンセルしました。');
      synth.cancel();
    }
      
      var utterThis = new SpeechSynthesisUtterance(text);
      synth.speak(utterThis);
  
  }

// 再生
  function speak(){
 
    // 再生中
    if (synth.speaking) {
      console.log('再生をキャンセルしました。');
      synth.cancel();
    }
    
    
      var select = document.getElementById("mySelect");
  var input = document.getElementById("txt_tts");
     // 選択されたオプションの値を取得
  var selectedValue = select.value;
  // 入力フィールドに選択された値を設定
  input.value = selectedValue;
    
      
    if (txt_tts.value !== '') {
      var utterThis = new SpeechSynthesisUtterance(txt_tts.value);
        
      utterThis.onstart  = function (event) {
        console.log('再生を開始しました。');
      }        
      utterThis.onend = function (event) {
        console.log('再生が終了しました。');
        //speakC("再生Ｏｋ");
      }
      utterThis.onerror = function (event) {
        alert('エラーが発生しました。')
      }
 
      var selectedOption = select_tts.selectedOptions[0].getAttribute('data-name');
 /*     for(i = 0; i < voices.length ; i++) {
        if(voices[i].name === selectedOption) {
          utterThis.voice = voices[i];
          console.log(utterThis.voice)
          break;
        }
      }
      
      utterThis.pitch = pitch_tts.value;
      utterThis.rate = rate_tts.value;
      */
      synth.speak(utterThis);
    }
  }
  
  // 以下、イベント
  form_tts.onsubmit = function(event) {
    event.preventDefault();
    speak();
    txt_tts.blur();
  }
  
  /*
  pitch_tts.onchange = function() {
    document.getElementById('pitch-value-tts').innerHTML = pitch_tts.value;
  }
 
  rate_tts.onchange = function() {
    document.getElementById('rate-value-tts').innerHTML = rate_tts.value;
  }
  
 
  select_tts.onchange = function(){
    speak();
  }
  
  */
}else{
  alert('IE11には対応していません。\n※macOS/iOSのブラウザは未確認');
}

function shori(rest){
    var select = document.getElementById("mySelect");
  var selectedValue = select.value;
  var ans="";
switch (selectedValue) {
  case "ありがとう、ございました":
    ans="ありがとうございました";
    break;
  case "かなしいです":
    ans="悲しいです";
    break;
  case "たのしいです":
    ans="楽しいです";
    break;
  case "びっくりしました":
    ans="びっくりしました";
    break;
  case "ホールで、あそんでも、いいですか":
    ans="ホールで遊んでもいいですか";
    break;
  case "トイレを、おねがいしても、いいですか":
    ans="トイレをお願いしてもいいですか";
    break;
  case "おはなししても、いいですか":
    ans="お話してもいいですか";
    break;

default:
    break;
}

if (ans==rest){
   speakC("そうです。上手なはなしかたですね");
 }else{
   speakC("もういちど、はなしてもらえますか？");
 }

}

</script>

</body>
</html>

2023年6月11日日曜日

staticの使い方

C＃の基本をよくわかっていなかった。

class　ABCで

static int　defを定義したら

ABC.defでアクセスするということ。インスタンス作成は不要。

Unity　複数AudioClip切り替え

意外と手こずる。

https://futabazemi.net/unity/sound_multiple

こちらを参考にさせていただいた。

Inspectorで、AudioSourceを必要分、追加するところがミソだった。

AudioSourceとaudioclipをそれぞれSerializeFieldでスクリプトに記述。

これを知っておかないと、音声の扱いに苦労してしまう。知っている人には基本的なことなんだろうけど。

chtGPTより参考書が役立ったパターン

GPTのコードでうまく衝突判定がいかず、何度か質問したがなかなか解決しない。

結局、参考書で調べたら、３Dと２Dでは、イベント検知のメソッドは微妙に違うことを発見。

２Dでは、void OnTriggerEnter2D(Collider2D other)のようにするといいようです。２Dと３Dの間違いまでは、chatGPTは想定してなかったようだ。

　コリダーだけでなく、RigidBodyも追加しないと感知しないことにも注意必要。

DragAndDropで苦労する

タブレットでDragAndDropを使いたくて、最初はELMで試したが、Windowsではうまくいっても、タブレットなどのタッチ操作はいまいち、不完全。
　そこで、UnityのWebGLでためしたら、うまくいったが、けっこうはまりどころはあった。ChatGPTからも聞きながら、
コードは、以下のものでよかったが、設定で注意点がある。

①Canvas下だとうまく動作しなかった。このへんは、ChatGPTもきづいてくれなかった。常識的なことなのかもしれないが、初心者には盲点。

②オブジェクトにはColliderを追加する。

public class DragAndDrop : MonoBehaviour
{
public GameObject gameObject;
private bool isDragging = false;
private Vector3 offset;
private void OnMouseDown()
{
if (Input.GetMouseButton(0))
{
isDragging = true;
offset = gameObject.transform.position - GetMouseWorldPosition();
}
// Debug.Log("MouseDown");
}
private void OnMouseDrag()
{
if (isDragging)
{
gameObject.transform.position = GetMouseWorldPosition() + offset;
}
}
private void OnMouseUp()
{
isDragging = false;
}
private Vector3 GetMouseWorldPosition()
{
Vector3 mousePosition = Input.mousePosition;
mousePosition.z = Camera.main.nearClipPlane;
return Camera.main.ScreenToWorldPoint(mousePosition);
}
}

Inspector でSprite Renderer＞Spriteの欄をSquareにして、その下にcanvasをつけて、図形を描画したものを動かすこともできる。

画像にしたかったら、Spriteの欄に画像PNGなどを持ってくることもできる。

2023年6月4日日曜日

Unity WebGLのビルドは大変

設定を試行錯誤してようやくビルドできた。ディフォルトでは、メモリ不足でだめだったので。

Buid Settings:
Texture Compression :use player settings
Development Build :No Check
Code Optimization :Size
Max Texture Size : Max64
Txture Compression: Force Fast Compressor
Player Settings...:
Texture Compression format: DXT
Ligtmap Encoding :LowQuality
HDR Cubemap Encoding :LowQuality
IL2CPP Code Generation:Faster(smaller)builds
C++ Compliler Configuration :Debug <<<<これが重要というサイトの情報あり
Optimize Mesh Data*: No Check

Compression format :最初gzipにしたが、Github pagesで受け付けないので、なしにした。

2023年6月3日土曜日

ELMにChatGPTを活用

マイナーなELM言語ではあるが、けっこうしっかりコードを考えてくれるので助かっている。

indexToPosition = toFloat >> (*) 60 >> (+) 10 >> Vector2.vec2 10

というカリー化を利用したもので、このままでは、ｘ座標固定なので、ｙ座標固定にするにはと聞いてみたら。

fixedYCoordinate y = \x -> Vector2.vec2 x y

とすればいいことを教えてくれた。なるほど、と納得です。活用すれば短時間で修正できて便利。