常連

テラテイラー

注目の的

社会貢献

回答者

ベストアンサー

拍手喝采

先生

自己紹介

有名人

### 前提・実現したいこと

Arduinoで計測したデータをProcessing上で表示したい
ArduinoからSerial.writeで送ったデータはProcessing上で見ることができました．

今回は複数センサ（現状8個，将来的には倍）からの情報をProcessingで表示したいと考えています．
マイコンの入力の都合で現在はセンサ４つのみ(P1~P4)実装しています．

シリアル通信では，取得したセンサ値を８ビット二つに分けて送信し，通信の前後で符牒を入れる形にしたいと思っています．

参考にしたサイト　https://garchiving.com/arduino-x-processing-serial-communication/
のコードを元に改変しています．


### Processingのコンソール
Processing上のコンソールではoverflowと表示される
myPort.available()の数字が１０００などすごい数字になっている（そもそもこれの意味がよく分かりません）

```
overflow
984
overflow
834
overflow
```

### 該当のソースコード

```Arduino
void setup(){
    Serial.begin( 57600 );
}

void loop(){
    int P1,P2,P3,P4,P5,P6,P7,P8;
    P1 = analogRead( A0 );
    P2 = analogRead( A1 );
    P3 = analogRead( A2 );
    P4 = analogRead( A3 );

/*
    P1=map(P1, 0, 1023, 0, 255);
    P2=map(P2, 0, 1023, 0, 255);
    P3=map(P3, 0, 1023, 0, 255);
    P4=map(P4, 0, 1023, 0, 255);
*/
/*
    P1 = P1 * 5.0 / 1023.0;
    P2 = P2 * 5.0 / 1023.0;
    P3 = P3 * 5.0 / 1023.0;
    P4 = P4 * 5.0 / 1023.0;
*/

    if (Serial.available() == 1) {
      byte inBuf[1];
      Serial.readBytes(inBuf, 1);
      if (inBuf[0] == 's') {
      //ここに送信処理を記述
        Serial.println("send");
        digitalWrite(8,HIGH);
        byte outBuf[18];

        outBuf[0]  = 's';                     // 1
        outBuf[1]  = (int16_t)(P1) >> 8;     // 2
        outBuf[2]  = (int16_t)(P1) & 0xFF;   // 3
        outBuf[3]  = (int16_t)(P2) >> 8;     // 4
        outBuf[4]  = (int16_t)(P2) & 0xFF;   // 5
        outBuf[5]  = (int16_t)(P3) >> 8;     // 6
        outBuf[6]  = (int16_t)(P3) & 0xFF;   // 7
        outBuf[7]  = (int16_t)(P4) >> 8;     // 8
        outBuf[8]  = (int16_t)(P4) & 0xFF;   // 9
        outBuf[9]  = (int16_t)(P5) >> 8;     // 10
        outBuf[10]  = (int16_t)(P5) & 0xFF;   // 11
        outBuf[11]  = (int16_t)(P6) >> 8;     // 12
        outBuf[12]  = (int16_t)(P6) & 0xFF;   // 13
        outBuf[13]  = (int16_t)(P7) >> 8;     // 14
        outBuf[14]  = (int16_t)(P7) & 0xFF;   // 15
        outBuf[15]  = (int16_t)(P8) >> 8;     // 16
        outBuf[16]  = (int16_t)(P8) & 0xFF;   // 17
        outBuf[17]  = 'e';                    // 18

        
        Serial.write(outBuf, 18);
      }
      else {
        while (Serial.available() > 0)Serial.read();
        Serial.println("wait");
        
      }
    }
    if (Serial.available() > 1) {
      while (Serial.available() > 0)Serial.read();
    }
    
    Serial.print("P1: ");
    Serial.println(P1);
    /*Serial.print( "P1: " );
    Serial.println( P1 );
    Serial.print( "P2: " );
    Serial.println( P2 );
    Serial.print( "P3: " );
    Serial.println( P3 );
    Serial.print( "P4: " );
    Serial.println( P4 );
    
    Serial.write(P1);
    */
    //delay( 100 );
}
### 該当のソースコード

```Processing
import processing.serial.*;
float P1, P2, P3, P4, P5, P6, P7, P8;
int serialTimer;
Serial myPort;


int data;

void setup() 
{
  size(500, 500);
  myPort = new Serial(this, Serial.list()[4], 57600);
}

void draw() {
  if (millis()-serialTimer > 50) {
    serialTimer = millis();
    byte[] inBuf = new byte[18];
    println(myPort.available());
    if (myPort.available() == 18) {
      myPort.readBytes(inBuf);
      if (inBuf[0]=='s'&& inBuf[17]=='e') {
        P1 = (inBuf[1]<<8)+(inBuf[2]&0xff);;
        P2 = (inBuf[3]<<8)+(inBuf[4]&0xff);;
        P3 = (inBuf[5]<<8)+(inBuf[6]&0xff);;
        P4 = (inBuf[7]<<8)+(inBuf[8]&0xff);;
        P5 = (inBuf[9]<<8)+(inBuf[10]&0xff);;
        P6 = (inBuf[11]<<8)+(inBuf[12]&0xff);;
        P7 = (inBuf[13]<<8)+(inBuf[14]&0xff);;
        P8 = (inBuf[15]<<8)+(inBuf[16]&0xff);;
        
        
      } else {
        while (myPort.available()>0)myPort.read();
        println("missMatch");
      }
    } else if (myPort.available() > 18) {
        while (myPort.available()>0)myPort.read();
       println("overflow");
    }
    byte[] outBuf = new byte[1];
    outBuf[0]     = 's';
    
    myPort.write(outBuf);
  }

  background(0);
  fill(240);
  textSize(24);
  text(nf(P1, 0, 2), 50, 50);
  text(nf(P2, 0, 2), 50, 80);
  text(nf(P3, 0, 2), 50, 110);
  text(nf(P4, 0, 2), 50, 140);
  text(nf(P5, 0, 2), 50, 170);
  text(nf(P6, 0, 2), 50, 200);  
  text(nf(P7, 0, 2), 50, 230);
  text(nf(P8, 0, 2), 50, 260);
}
```

### 試したこと

Processing側でmy Port .clear()を入れるなど
他ウェブ上の記事も参考にしましたが，分からなくなってきてしまい，質問させていただくことになりました．

参考記事https://garchiving.com/arduino-x-processing-serial-communication/のコードをそのまま使いましたが（ポート周りは設定し直しています），Processingのコンソール上ではoverflowの表示は出ませんでした．
使っているセンサが違うので，Arduino側でセンサ値を適当な定数にして試しましたが，Processing上では0.00の表示のままでした（通信できてない？）


###環境
Arduino1.8.15
Processing3.3.5

ArduinoとProcessingのシリアル通信

### 実現したいこと
- Ｃ言語での通信方法とデータ処理についてのイメージを確立させたい
-  関数を使いこなせるようになりたい
- データの取得について処理の具体例が知りたい

### 前提
現在RX64Mマイコンを使用し、e2studioにてプログラムを書いています。
スマートコンフィグレータを使用してのコード生成を行っています。
SCIF9を使用してRS232Cの通信を使用と考えているのですが、下記の壁にぶつかっています。
 
＜受信データを取得するためにどういった手順を踏めばよいか＞
APIのリファレンスマニュアルや、ハードウェアマニュアルでのレジスタの確認をしながら、生成されたコードを読み、通信の開始/停止用の関数などの仕様を確認しています。なんとなくですが、コード生成されたものがハードウェアマニュアルマニュアル記載のレジスタの設定を行っていることや、関数呼び出しで通信が開始されることは理解できたのですが、いざプログラムを書こうにも、何からすればよいのか分からなくなってきました。

キャラクタ同期をしようと思っているので、
①通信開始の関数を呼び出し通信可能状態にする
②受信開始の関数
MD_STATUS   R_<Config_SCI0>_Serial_Receive ( uint8_t * const rx_buf, uint16_t rx_num );
[引数]
uint8_t * const rx_buf; 　受信したデータを格納するバッファへのポインタ
uint16_t rx_num;　受信するデータの総数 
[戻り値]
MD_OK 　正常終了 
MD_ARGERROR　引数 rx_num の指定が不正
に自分で指定した受信データを格納したい変数のポインタと予定されているデータ数を引き渡す。
③変数に格納された値を読み、キャラクタ同期のスタート制御文字ならそのまま値を読み込み

のような感じで考えているのですが、どういったことに気を使わなくてはいけないのか、ご教授いただければと思います。
以下、コード生成したソースを参考に添付します。
　
```C言語
//Config_SCIF9.c
#include "r_cg_macrodriver.h"
#include "Config_SCIF9.h"
#include "r_cg_userdefine.h"

volatile uint8_t * gp_scifa9_tx_address;               /* SCIFA9 transmit buffer address */
volatile uint16_t  g_scifa9_tx_count;                  /* SCIFA9 transmit data number */
volatile uint8_t * gp_scifa9_rx_address;               /* SCIFA9 receive buffer address */
volatile uint16_t  g_scifa9_rx_count;                  /* SCIFA9 receive data number */
volatile uint16_t  g_scifa9_rx_length;                 /* SCIFA9 receive data length */

void R_Config_SCIF9_Create(void)
{
    volatile uint16_t dummy;
    uint32_t w_count;

    /* Cancel SCIFA9 module stop state */
    MSTP(SCIFA9) = 0U;

    /* Clear transmit/receive enable bits */
    SCIFA9.SCR.BIT.TE = 0U;
    SCIFA9.SCR.BIT.RE = 0U;

    /* Reset transmit/receive FIFO data register operation */
    SCIFA9.FCR.BIT.TFRST = 1U;
    SCIFA9.FCR.BIT.RFRST = 1U;

    /* Read and clear status flags */
    dummy = SCIFA9.FSR.WORD;
    SCIFA9.FSR.WORD = 0x00U;

    dummy = (uint16_t) SCIFA9.LSR.BIT.ORER;
    SCIFA9.LSR.BIT.ORER = 0U;

    /* Set clock enable bits */
    SCIFA9.SCR.WORD = _0000_SCIF_INTERNAL_SCK_UNUSED;

    /* Set transmission/reception format */
    SCIFA9.SMR.WORD = _0000_SCIF_CLOCK_PCLK | _0000_SCIF_STOP_1 | _0000_SCIF_PARITY_DISABLE | 
                      _0000_SCIF_DATA_LENGTH_8 | _0000_SCIF_ASYNCHRONOUS_MODE;
    SCIFA9.SEMR.BYTE = _00_SCIF_16_BASE_CLOCK | _00_SCIF_NOISE_FILTER_DISABLE | _00_SCIF_DATA_TRANSFER_LSB_FIRST | 
                       _00_SCIF_BAUDRATE_SINGLE;

    /* Clear modulation duty register select */
    SCIFA9.SEMR.BIT.MDDRS = 0U;

    /* Set bit rate */
    SCIFA9.BRR = 0xC2U;

    /* Wait for at least 1-bit interval */
    for (w_count = 0U; w_count <= _000004E0_SCIF_1BIT_INTERVAL; w_count++)
    {
        nop();
    }

    /* Set FIFO trigger conditions */
    SCIFA9.FTCR.WORD = _0000_SCIF_TX_FIFO_TRIGGER_NUM_0 | _0080_SCIF_TX_TRIGGER_TFTC_VALID | 
                       _0100_SCIF_RX_FIFO_TRIGGER_NUM_1 | _8000_SCIF_RX_TRIGGER_RFTC_VALID;
    SCIFA9.FCR.WORD = _0000_SCIF_LOOPBACK_DISABLE | _0000_SCIF_MODEM_CONTROL_DISABLE;

    /* Disable transmit/receive FIFO data register reset operation */
    SCIFA9.FCR.BIT.TFRST = 0U;
    SCIFA9.FCR.BIT.RFRST = 0U;

    /* Set interrupt priority */
    IPR(SCIFA9, TXIF9) = _0F_SCIF_PRIORITY_LEVEL15;
    IPR(SCIFA9, RXIF9) = _0F_SCIF_PRIORITY_LEVEL15;

    /* Set RXD9 pin */
    MPC.PB6PFS.BYTE = 0x0AU;
    PORTB.PMR.BYTE |= 0x40U;

    /* Set TXD9 pin */
    MPC.PB7PFS.BYTE = 0x0AU;
    PORTB.PMR.BYTE |= 0x80U;

    R_Config_SCIF9_Create_UserInit();
}

void R_Config_SCIF9_Start(void)
{
    /* Clear interrupt flag */
    IR(SCIFA9,TXIF9) = 0U;
    IR(SCIFA9,RXIF9) = 0U;

    /* Enable SCIF interrupt */
    IEN(SCIFA9,TXIF9) = 1U;
    ICU.GENAL0.BIT.EN4 = 1U;
    IEN(SCIFA9,RXIF9) = 1U;
    ICU.GENAL0.BIT.EN5 = 1U;
    ICU.GENAL0.BIT.EN6 = 1U;
    ICU.GENAL0.BIT.EN7 = 1U;
}

void R_Config_SCIF9_Stop(void)
{

    /* Disable serial transmit */
    SCIFA9.SCR.BIT.TE = 0U;

    /* Disable serial receive */
    SCIFA9.SCR.BIT.RE = 0U;

    /* Disable TXI interrupt */
    SCIFA9.SCR.BIT.TIE = 0U;

    /* Disable RXI, ERI, BRI and DRI interrupt */
    SCIFA9.SCR.BIT.RIE = 0U;
    IR(SCIFA9,TXIF9) = 0U;
    IEN(SCIFA9,TXIF9) = 0U;
    ICU.GENAL0.BIT.EN4 = 0U;
    IR(SCIFA9,RXIF9) = 0U;
    IEN(SCIFA9,RXIF9) = 0U;
    ICU.GENAL0.BIT.EN5 = 0U;
    ICU.GENAL0.BIT.EN6 = 0U;
    ICU.GENAL0.BIT.EN7 = 0U;
}

MD_STATUS R_Config_SCIF9_Serial_Receive(uint8_t * const rx_buf, uint16_t rx_num)
{
    MD_STATUS status = MD_OK;

    if (rx_num < 1U)
    {
        status = MD_ARGERROR;
    }
    else
    {
        g_scifa9_rx_count = 0U;
        g_scifa9_rx_length = rx_num;
        gp_scifa9_rx_address = rx_buf;

        SCIFA9.FTCR.BIT.RFTC = _01_SCIF_RX_TRIG_NUM;

        SCIFA9.SCR.BIT.RE = 1U;
        SCIFA9.SCR.BIT.RIE = 1U;
        SCIFA9.SCR.BIT.REIE = 1U;
    }

    return (status);
}

MD_STATUS R_Config_SCIF9_Serial_Send(uint8_t * const tx_buf, uint16_t tx_num)
{
    MD_STATUS status = MD_OK;

    if (tx_num < 1U)
    {
        status = MD_ARGERROR;
    }
    else
    {
        gp_scifa9_tx_address = tx_buf;
        g_scifa9_tx_count = tx_num;
        SCIFA9.SCR.BIT.TE = 1U;
        SCIFA9.SCR.BIT.TIE = 1U;
    }

    return (status);
}
```

```C言語
//Config_SCIF9_user.c
#include "r_cg_macrodriver.h"
#include "Config_SCIF9.h"
#include "r_cg_userdefine.h"

extern volatile uint8_t * gp_scifa9_tx_address;                /* SCIFA9 send buffer address */
extern volatile uint16_t  g_scifa9_tx_count;                   /* SCIFA9 send data number */
extern volatile uint8_t * gp_scifa9_rx_address;                /* SCIFA9 receive buffer address */
extern volatile uint16_t  g_scifa9_rx_count;                   /* SCIFA9 receive data number */
extern volatile uint16_t  g_scifa9_rx_length;                  /* SCIFA9 receive data length */

void R_Config_SCIF9_Create_UserInit(void)
{
    /* Start user code for user init. Do not edit comment generated here */
    /* End user code. Do not edit comment generated here */
}

#if FAST_INTERRUPT_VECTOR == VECT_SCIFA9_TXIF9
#pragma interrupt r_Config_SCIF9_txif_interrupt(vect=VECT(SCIFA9,TXIF9),fint)
#else
#pragma interrupt r_Config_SCIF9_txif_interrupt(vect=VECT(SCIFA9,TXIF9))
#endif
static void r_Config_SCIF9_txif_interrupt(void)
{
    uint16_t count = 0;

    /* Get the amount of untransmitted data stored in the FRDR register */
    uint16_t dummy_fdr = SCIFA9.FDR.BIT.T;

    /* Write data to the transmit FIFO data register */
    while ((0U < g_scifa9_tx_count) && (count < (_10_SCIF_FIFO_MAX_SIZE - dummy_fdr)))
    {
        SCIFA9.FTDR = *gp_scifa9_tx_address;
        gp_scifa9_tx_address++;
        g_scifa9_tx_count--;
        count++;
    }

    if (1U == SCIFA9.FSR.BIT.TDFE)
    {
        SCIFA9.FSR.BIT.TDFE = 0U;
    }

    if (0U >= g_scifa9_tx_count)
    {
        SCIFA9.SCR.BIT.TIE = 0U;
        SCIFA9.SCR.BIT.TEIE = 1U;
    }
}

void r_Config_SCIF9_teif_interrupt(void)
{
    if (1U == SCIFA9.FSR.BIT.TEND)
    {
        SCIFA9.SCR.BIT.TE = 0U;
        SCIFA9.SCR.BIT.TEIE = 0U;
    }

    r_Config_SCIF9_callback_transmitend();
}

#if FAST_INTERRUPT_VECTOR == VECT_SCIFA9_RXIF9
#pragma interrupt r_Config_SCIF9_rxif_interrupt(vect=VECT(SCIFA9,RXIF9),fint)
#else
#pragma interrupt r_Config_SCIF9_rxif_interrupt(vect=VECT(SCIFA9,RXIF9))
#endif
static void r_Config_SCIF9_rxif_interrupt(void)
{
    uint16_t count = 0;

    /* Get the amount of receive data stored in FRDR register */
    uint16_t dummy_fdr = SCIFA9.FDR.BIT.R;

    /* Read data from the receive FIFO data register */
    while ((g_scifa9_rx_length > g_scifa9_rx_count) && (count < dummy_fdr))
    {
        *gp_scifa9_rx_address = SCIFA9.FRDR;
        gp_scifa9_rx_address++;
        g_scifa9_rx_count++;
        count++;
    }

    /* If remaining data is less than the receive trigger number, receive interrupt will not occur.
       In this case, set trigger number to 1 to force receive interrupt for each one byte of data in FRDR */
    if ((_01_SCIF_RX_TRIG_NUM > (g_scifa9_rx_length - g_scifa9_rx_count)) && (1U != SCIFA9.FTCR.BIT.RFTC))
    {
        SCIFA9.FTCR.BIT.RFTC = 1U;
    }

    /* Clear receive FIFO data full flag */
    if (1U == SCIFA9.FSR.BIT.RDF)
    {
        SCIFA9.FSR.BIT.RDF = 0U;
    }

    if (g_scifa9_rx_length <= g_scifa9_rx_count)
    {
        /* All data received */
        SCIFA9.SCR.BIT.RE = 0U;

        r_Config_SCIF9_callback_receiveend();
    }
}

void r_Config_SCIF9_erif_interrupt(void)
{
    if (1U == SCIFA9.FSR.BIT.ER)
    {
        r_Config_SCIF9_callback_error(RECEIVE_ERROR);
        /* clear receive error flag */
        SCIFA9.FSR.BIT.ER = 0U;
    }
}

void r_Config_SCIF9_brif_interrupt(void)
{
    if (1U == SCIFA9.LSR.BIT.ORER)
    {
        r_Config_SCIF9_callback_error(OVERRUN_ERROR);
        /* clear overrun error flag */
        SCIFA9.LSR.BIT.ORER = 0U;
    }

    if (1U == SCIFA9.FSR.BIT.BRK)
    {
         r_Config_SCIF9_callback_error(BREAK_DETECT);
        /* clear break detect flag */
        SCIFA9.FSR.BIT.BRK = 0U;
    }
}

void r_Config_SCIF9_drif_interrupt(void)
{
    /* Start user code for r_Config_SCIF9_drif_interrupt. Do not edit comment generated here */
    /* End user code. Do not edit comment generated here */
}

static void r_Config_SCIF9_callback_transmitend(void)
{
    /* Start user code for r_Config_SCIF9_callback_transmitend. Do not edit comment generated here */
    /* End user code. Do not edit comment generated here */
}

static void r_Config_SCIF9_callback_receiveend(void)
{
    /* Start user code for r_Config_SCIF9_callback_receiveend. Do not edit comment generated here */
    /* End user code. Do not edit comment generated here */
}

static void r_Config_SCIF9_callback_error(scif_error_type_t error_type)
{
    /* Start user code for r_Config_SCIF9_callback_error. Do not edit comment generated here */
    /* End user code. Do not edit comment generated here */
}


```



ＲＸマイコンでのRS232CでのFIFO通信方法のイメージについて

列車走行位置のプログラムを作りたいです。
以下のプログラムでは、出発駅と到着駅の時刻は指定できますが、途中駅は指定できません。
1dとd1はおそらく、方向が逆という意味なのは理解できますが、それ以外は全く理解できません。
中間駅の時間の指定はできませんか。
尚、できれば、列車の時間設定は、24時間表記のままが望ましいです。
それは、24時間表記にしなければ、後で修正がややこしくなるからです。
<code>
// js

	var hour;
	var min;
	var sec;
	var today;
	var bSec = -1;
	var bDay = 1;
	var uSec = -1;

	var daySec;
	var diaData = [
		[
			"   1 1D 10001800",
		]
	];
	const ADTrain = [
  " 1 1D 10001640", // AB
  " 1 1D 16401700", // BC
  " 1 1D 17001800", // CD
];
	var izst = [
		[   0, 1, "三島"       ],
		[  13, 0, "三島広小路" ],
		[  20, 1, "三島田町"   ],
		[  29, 0, "三島二日町" ],
		[  55, 1, "大場"       ],
		[  70, 0, "伊豆仁田"   ],
		[  85, 0, "原木"       ],
		[  98, 0, "韮山"       ],
		[ 114, 1, "伊豆長岡"   ],
		[ 142, 0, "田京"       ],
		[ 166, 1, "大仁"       ],
		[ 186, 0, "牧之郷"     ],
		[ 198, 1, "修善寺"     ]
	];
この間省略
	// 表示設定 
	function setDisplay() {
//		$("idDateTime").textContent = "-";
		setHeader();
		setFooter();
		$("secMap").classList.remove("clsHide");
	}
	function setHeader() {
		$tag("body").style.paddingTop = $tag("header").clientHeight + "px";
	}
	function setFooter() {
		$tag("body").style.paddingBottom = $tag("footer").clientHeight + "px";
	}

	// 駅設定 
	function setStation() {
		var n = izst.length;
		for (var i = 0; i < n; i++) {
			var isMark = izst[i][1];
			var pos = izst[i][0];
			var name = izst[i][2];
			var x = 8;
			var y = 0;
			var xx = 209;
			var cls = "clsSta";
			if (pos < 200) {
				y = 10 + pos * 2.5;
				cls += "Left";
			}
			var html = "<div id='divStation" + i + "' class='clsStation'>";
			html += "</div>";
			$("divMap").innerHTML += html;
			$("divStation" + i).style.left = xx + "px";
			$("divStation" + i).style.top = y + 1 + "px";
			if (isMark) {
				y -= 2;
				cls += "Mark";
			}
			html = "<div id='divStaName" + i + "' class='" + cls + "'>";
			html += name + "</div>";
			$("divMap").innerHTML += html;
			$("divStaName" + i).style.left = x + "px";
			$("divStaName" + i).style.top = y - 8 + "px";
		}
	}

	// イベントハンドラ設定 
	function setHandler() {
		// ヘッダー 
		$tag("div").addEventListener("click", function() {
			var menu = $("menu");
			if (menu.classList.contains("clsHide")) {
				menu.classList.remove("clsHide");
			}
			else if (page != 3) {
				menu.classList.add("clsHide");
			}
			setHeader();
		}, false);
	}

	// 繰り返し処理 
	function periodicProc() {
		if (options.debug) intervalDebug();
		else intervalProc();
	}
	function intervalProc() {
		setHeader();
		var date = new Date();
//date.setTime(date.getTime() - (0 * 3600 + 0 * 60 + 0) * 1000);
//date.setTime(date.getTime() - 0 * 86400000);
		daySec = date.getHours() * 3600 + date.getMinutes() * 60 + date.getSeconds();
		if (date.getHours() < 3) daySec += 24 * 3600;
		sec = date.getSeconds();
		if (bSec != sec) {
			if (bAutoUpdate && (sec == uSec)) updateOption();
			bSec = sec;
			// 1秒毎の処理 
			hour = date.getHours();
			min = date.getMinutes();
			var time = date.getTime();
			if (hour < 3) {
				time -= 86400000;
				hour += 24;
			}
			date.setTime(time);
			var cDay = ~~((time + 32400000) / 86400000);
			if (bDay != cDay) {
				var year = date.getFullYear();
				var month = date.getMonth() + 1;
				var day = date.getDate();
				today = year + ((month > 9) ? "" : "0") + month;
				today += ((day > 9) ? "" : "0") + day;
				if (options.dt && (options.dt != today)) {
					if (!bDay) {
						var str = "今日のデータではありません。\n";
						str += "(" + options.dt + ")";
//						alert(str);
					}
					options.dt = null;
				}
				// 日毎の処理 
				bDay = cDay;
//				showLegend();
				setTrains();
			}
			setCurrentDateStr(date, hour, min, sec);
			// 秒毎の処理 
			updateTrains();
		}
		window.setTimeout(periodicProc, 100);
	}
	// 時刻表示 
	function setCurrentDateStr(date, hour, min, sec) {
		var year = date.getFullYear();
		var month = date.getMonth() + 1;
		var day = date.getDate();
		var str = year + "年";
		str += ((month > 9) ? "" : " ") + month + "月";
		str += ((day > 9) ? "" : " ") + day + "日";
		str += "(" + [ "日", "月", "火", "水", "木", "金", "土" ][date.getDay()] + ")　";
		str += ((hour > 9) ? "" : "0") + hour + ":";
		str += ((min > 9) ? "" : "0") + min + ":";
		str += ((sec > 9) ? "" : "0") + sec;
		$("idDateTime").textContent = str;
		setHeader();
	}

	// 繰り返しデバッグ処理 
	function intervalDebug() {
		if (!((18000 <= daySec) && (daySec <= 88200))) {
			daySec = step < 0 ? 88200 : 18000;
			bDay = bDay ? 0 : 1;
			setTrains();
		}
		var hour = ~~(daySec / 3600);
		var min = ~~(daySec / 60) % 60;
		var sec = daySec % 60;
		var str = "[DEBUG]　"
		str += ((hour > 9) ? "" : "0") + hour + ":";
		str += ((min > 9) ? "" : "0") + min + ":";
		str += ((sec > 9) ? "" : "0") + sec;
		$("idDateTime").textContent = str;
		updateTrains();
		daySec += step;
		window.setTimeout(periodicProc, 50);
	}

	// 列車登録 
	function setTrains() {
		$("divTrain").innerHTML = "";
		for (var i = 0; i < diaData.length; i++) {
			setTrain(i);
		}
	}
	function setTrain(i) {
		var dia = diaData[i];
		var opStr = dia[0].slice(0, 4).replace(/^ +/, "");
		var opNum = parseInt(opStr);

		var str = "";
		if (opNum >= 4000) {
			str = "踊";
		}
		if (opData && (i < opData.length)) {
			str = forms[parseInt(opData.charAt(i))].slice(23);
		}

		var html;
		if (str.length > 0) {
			html = "<div id='divTr" + opStr;
			html += "' class='clsTrainSIF clsHide'>" + str + "</div>";
			$("divTrain").innerHTML += html;
		}
		else {
			html = "<div id='divTr" + opStr;
			html += "' class='clsTrain clsHide'></div>";
			$("divTrain").innerHTML += html;
		}
		$("divTr" + opStr).style.backgroundColor = "#a0a0a0";
		html = "<div id='divTN" + opStr;
		html += "' class='clsHide'>" + opStr + "</div>";
		$("divTrain").innerHTML += html;
	}

	// 列車表示更新 
	function updateTrains() {
		var td = daySec;
		if (td < 10800) td = 10800;
		for (var i = 0; i < diaData.length; i++) {
			updateTrain(i, td);
		}
	}
	function updateTrain(j, td) {
		var dia = diaData[j];
		var opStr = dia[0].slice(0, 4).replace(/^ +/, "");
		var isDown = false;
		var isOp = false;
		var t0 = 0;
		var t1 = 0;
		var s0 = 0;
		var s1 = 0;
		for (var i = 0; i < dia.length; i++) {
			t0 = parseInt(dia[i].slice(8, 12), 10);
			t0 = (~~(t0 / 100) * 60 + (t0 % 100)) * 60;
			if ((i == 0) && (td < t0 - 300)) break;
			t1 = parseInt(dia[i].slice(12, 16), 10);
			t1 = (~~(t1 / 100) * 60 + (t1 % 100)) * 60;
			if (i + 1 == dia.length) {
				if (t1 + 300 < td) continue;
			}
			else {
				var t2 = parseInt(dia[i + 1].slice(8, 12), 10);
				t2 = (~~(t2 / 100) * 60 + (t2 % 100)) * 60;
				if ((t1 + t2) / 2 < td) continue;
			}
			isOp = true;
			s0 = parseInt(dia[i].slice(5, 6), 16) - 1;
			s1 = parseInt(dia[i].slice(6, 7), 16) - 1;
			isDown = (s0 < s1);
			break;
		}
		if (isOp) {
			var pos = (td - t0) / (t1 - t0);
			if (td < t0) {
				pos = izst[s0][0];
			}
			else if (t1 < td) {
				pos = izst[s1][0];
			}
			else if (isDown) {
				pos = (izst[s1][0] - izst[s0][0]) * pos + izst[s0][0];
			}
			else {
				pos = izst[s0][0] - (izst[s0][0] - izst[s1][0]) * pos;
			}
			var x = isDown ? 234 : 214;
			var y = 10 + pos * 2.5;
			var xx = isDown ? 258 : 136;

			var n = parseInt(dia[i].slice(0, 1));
			var str = dia[i].slice(0, 4).replace(/^ +/, "") + (n >= 4 ? "M" : "");
			if (i > 0) str += " (" + opStr + ")";
			$("divTN" + opStr).textContent = str;
			$("divTN" + opStr).style.left = xx + "px";
			$("divTN" + opStr).style.top = (y - 6) + "px";
			x += 4 - ($("divTr" + opStr).getBoundingClientRect().width) / 2;
			y += 3 - ($("divTr" + opStr).getBoundingClientRect().height) / 2;
			$("divTr" + opStr).style.left = x + "px";
			$("divTr" + opStr).style.top = y + "px";
			if (n >= 8) {
				$("divTr" + opStr).style.color = "#000000";
				$("divTr" + opStr).style.backgroundColor = "#ffa0ff";
			}
			else if (n >= 4) {
				$("divTr" + opStr).style.color = "#000000";
				$("divTr" + opStr).style.backgroundColor = "#ffffff";
			}
			else if (n == 2) {
				$("divTr" + opStr).style.color = "#000000";
				$("divTr" + opStr).style.backgroundColor = "#a0a0a0";
			}
			else if (dia[i].slice(0, 1) == " ") {
				var f = 0;
				if (opData && (j < opData.length)) {
					f = parseInt(opData.charAt(j)) + 1;
				}
				if (f) {
					$("divTr" + opStr).style.color = formColor[f - 1];
					$("divTr" + opStr).style.backgroundColor = trainColor[f - 1];
				}
				else {
					$("divTr" + opStr).style.color = "#000000";
					$("divTr" + opStr).style.backgroundColor = "#60d0ff";
				}
			}
			$("divTr" + opStr).classList.remove("clsHide");

			if (isDown) {
				$("divTN" + opStr).classList.remove("clsTraLeft")
				$("divTN" + opStr).classList.add("clsTraRight")
				$("divTN" + opStr).classList.remove("clsHide");
			}
			else {
				$("divTN" + opStr).classList.remove("clsTraRight")
				$("divTN" + opStr).classList.add("clsTraLeft")
				$("divTN" + opStr).classList.remove("clsHide");
			}
		}
		else {
			$("divTr" + opStr).classList.add("clsHide");
			$("divTN" + opStr).classList.add("clsHide");
		}
	}

// eof
</code>
そして、参考にしたサイトがこちらです。
https://chocoden.chobi.net/izuppako/izuppako_now.html
質問の内容としましては、
<code>
	var diaData = [
		[
			"   1 1D 10002000",
		]
	];
</code>の部分について、
10時に始発駅を出発して、20時に終着駅に到着するのはわかるのですが、
間にB駅やらC駅があった場合に何時に発車するのかが指定できないことです。
B駅を例えば、12時に出発し、C駅を14時に出発といった具合にするにはここのプログラム以外にどこのプログラムを書き換えればよろしいのでしょうか。
ちなみに、距離は同じで、列車ごとに所要時間は異なるという体です。
その場合、どの部分を修正し、どのようなプログラムを構築すればいいかわかりません。
<code>
	var izst = [
		[   0, 1, "三島"       ],
		[  13, 0, "三島広小路" ],
		[  20, 1, "三島田町"   ],
		[  29, 0, "三島二日町" ],
		[  55, 1, "大場"       ],
		[  70, 0, "伊豆仁田"   ],
		[  85, 0, "原木"       ],
		[  98, 0, "韮山"       ],
		[ 114, 1, "伊豆長岡"   ],
		[ 142, 0, "田京"       ],
		[ 166, 1, "大仁"       ],
		[ 186, 0, "牧之郷"     ],
		[ 198, 1, "修善寺"     ]
	];
</code>
の値を減らしたりすると、全く列車の表示がなくなるのです。
やりたいことは、A駅と三島駅、B駅を三島小路駅という風に紐付けたいのです。
ただ、初歩レベルの知識しかないので、全文、
もしくは、変わる部分だけでもいいから全部書いていただきたいのです。
やりたいことは、A駅と三島駅、B駅を三島小路駅という風に紐付けたいのです。
電車の停車駅や通過駅を配列に組み込むのにはどうすればいいのですか。


列車のリアルタイム走行位置、A駅と三島駅、B駅を三島小路駅という風に紐付けたいのです。 電車の停車駅や通過駅を配列に組み込むのにはどうすればいいのですか。



### 前提・実現したいこと

Processingでの画像表示にあわせてArduinoにシリアル通信をするプログラムを作成したい
問題点が把握できていないので，問題点とアイデアをいただけると助かります．

### 発生している問題・エラーメッセージ

シリアル通信ができておらず，Arduino側の動作が行われない

### 該当のソースコード

```Processing
import processing.serial.*;
PImage img0;
PImage img1;
float count;

Serial Port;

void setup() {
  size(1920, 1080);
  Port = new Serial(this, "COM4", 9600);
  Port.bufferUntil(10);
  img0 = loadImage("photo0.png");
  img1 = loadImage("photo1.png");
  count = 0;
}

void draw(){
 
  background(255,255,255);
  
  count = count + 0.01;
  
  if (count >= 2){
    count = 0;
  }
  
  int f = floor(count);
  
  if (f == 0) {
    Port.write('1');
    image(img1,0,0);
  } else if (f == 1) {
    Port.write('2');
    image(img0,0,0);
  }
}
```

### 試したこと
下記のマウスクリックによる画像表示とシリアル通信を試した場合正常に動作した

```Processing
import processing.serial.*;
PImage img0;
PImage img1;


Serial Port;

void setup() {
  size(1920, 1080);
  Port = new Serial(this, "COM4", 9600);
  Port.bufferUntil(10);
  img0 = loadImage("photo0.png");
  img1 = loadImage("photo1.png");
  
}

void draw(){
  background(255,255,255);
  
  if(mousePressed && (mouseButton == LEFT)) {
    Port.write('1');
    image(img0,0,0);
  }
  if(mousePressed && (mouseButton == RIGHT)) {
    Port.write('2');
    image(img1,0,0);
  }
}
```


### 補足情報（FW/ツールのバージョンなど）

Arduino側のコード
```
void setup()
{
  pinMode(43, OUTPUT);
  pinMode(45, OUTPUT);
  pinMode(47, OUTPUT);
  pinMode(49, OUTPUT);
  
  pinMode(34, OUTPUT);
  pinMode(36, OUTPUT);
  pinMode(38, OUTPUT);
  pinMode(40, OUTPUT);

  Serial.begin(9600);

}

void loop()
{
  if (Serial.available() > 0) {
    char displayState = Serial.read();

    if(displayState == '1') {
      
      digitalWrite(34, LOW);
      digitalWrite(36, LOW);
      digitalWrite(38, LOW);
      digitalWrite(40, LOW);
      
      digitalWrite(43, HIGH);
      digitalWrite(45, HIGH);
      digitalWrite(47, HIGH);
      digitalWrite(49, HIGH);
  
    }
    if(displayState == '2') {
      digitalWrite(43, LOW);
      digitalWrite(45, LOW);
      digitalWrite(47, LOW);
      digitalWrite(49, LOW);

      digitalWrite(34, HIGH);
      digitalWrite(36, HIGH);
      digitalWrite(38, HIGH);
      digitalWrite(40, HIGH);

    }
  }
}
```


processingとarduino megaでのシリアル通信について

２相ステッピングモーターをL6470ドライバーとarduinoで動かしています。
arduinoは初めてで、いろんなところから拾って書いてみました。
動きとしては、電源ON→ステッピングモーターが正転→リミットスイッチに当たる（switch ON）→モーターが550秒100のスピードで逆転→トルク保持のまま100ミリ秒休憩→モーターが550秒100のスピードで正転→トルク保持のまま100ミリ秒休憩→の繰り返し

スイッチONからモーター正転逆転はできたのですが、「トルク保持のまま休憩」ができません。
delayを使うとスイッチの反応を邪魔してしまうので、このような書き方をしました。
どうかお助けください。。。


```ここに言語名を入力
/***********************

回転

************************/
#include <Arduino.h>
#include <SPI.h>

/*************

設定の部 
*/
long max_speed = 7000;// 70000 固定

long int dd = 200;// 微増・微減の量 400
int dt = 10; // 微増・微減にかける時間　ミリ秒

int t_interval = 10;// (休止する時間 みり秒）
int t_hold = 170; //　最高速を維持する時間　ミリ秒）


int steps; 

/*
設定　終わり
**************
****/


// ピン定義。
#define PIN_SPI_MOSI 11
#define PIN_SPI_MISO 12
#define PIN_SPI_SCK 13
#define PIN_SPI_SS 10

#define PIN_L6470_SS PIN_SPI_SS

// 関数プロトタイプ
void L6470_write(unsigned char data);
void L6470_init(void);
void L6470_run(long speed);

/***********************
動作に関わる変数。
************************/

long speed = 1000; // スピード初期値
long int n_dir = 0 ;// カウントアップ　奇数で正回転　偶数で逆回転
long offTime;


int c_step = max_speed / dd;

const int limit_sw = 7;
bool switchState = false;
int counter = 0;
int milsec = 0;
bool speedSwitch = false;

void setup()
{
 // ピン設定。
 pinMode(PIN_SPI_MOSI, OUTPUT);
 pinMode(PIN_SPI_MISO, INPUT);
 pinMode(PIN_SPI_SCK, OUTPUT);
 pinMode(PIN_L6470_SS, OUTPUT);

 // りみとすいっち
 pinMode(limit_sw, INPUT_PULLUP );
 digitalWrite(PIN_L6470_SS, HIGH);
 // SPI開始。
 SPI.begin();
 
 // シリアル通信。
 Serial.begin(9600);
 
 // L6470の初期化。
 L6470_init();
 
 Serial.println("Start...");


}


void loop()
{
 


int value = digitalRead(limit_sw);



if(value == 0){
  counter ++;
  if(counter > 50){
    switchState = true;
    counter = 50;
  }
}
if (switchState == true){
  milsec++;
  Serial.println(milsec);
  if(milsec > 550){
    speedSwitch = !speedSwitch;
    milsec = 0;

  }

  int speed;
  if(speedSwitch == true){
    speed = 100;

  }

  else{
    speed = -100;
  
  }
 
  L6470_run( speed );

  
}
    
 

else{
  
   L6470_run( 400 );//速度

}

}


void L6470_write(unsigned char data)
{
 // ~SSイネーブル。
 digitalWrite(PIN_L6470_SS, LOW);
 // SPI転送。
 SPI.transfer(data);
 // ~SSディスエーブル。
 digitalWrite(PIN_L6470_SS, HIGH);
}

void L6470_init()
{
 // MAX_SPEED設定。
 /// レジスタアドレス。
 L6470_write(0x07);
 // 最大回転スピード値(10bit)　００２０

 L6470_write(0x00);
 L6470_write(0x90);
 
 // KVAL_HOLD設定。
 /// レジスタアドレス。
 L6470_write(0x09);
 // モータ停止中の電圧設定(8bit)
 L6470_write(0xFF);
 
 // KVAL_RUN設定。
 /// レジスタアドレス。
 L6470_write(0x0A);
 // モータ定速回転中の電圧設定(8bit)
 //L6470_write(0xFF);
 L6470_write(0x64);
 
 // KVAL_ACC設定。
 /// レジスタアドレス。
 L6470_write(0x0B);
 // モータ加速中の電圧設定(8bit)
 L6470_write(0xFF);
 
 // KVAL_DEC設定。
 /// レジスタアドレス。
 L6470_write(0x0C);
 // モータ減速中の電圧設定(8bit)
 L6470_write(0xFF);
 
 // OCD_TH設定。
 /// レジスタアドレス。
 L6470_write(0x13);
 // オーバーカレントスレッショルド設定(4bit)
 L6470_write(0x0F);
 
 // STALL_TH設定。
 /// レジスタアドレス。
 L6470_write(0x14);
 // ストール電流スレッショルド設定(4bit)
 L6470_write(0x7F);
}

void L6470_run(long speed)
{
 unsigned short dir;
 unsigned long spd;
 unsigned char spd_h;
 unsigned char spd_m;
 unsigned char spd_l;

//spd = speed;

 // 方向検出。
 
 if (speed < 0)
 {
  dir = 0x50;
  spd = -1 * speed;
 }
 else
 {
  dir = 0x51;
  spd = speed;
 }


 // 送信バイトデータ生成。
 spd_h = (unsigned char)((0x0F0000 & spd) >> 16);
 spd_m = (unsigned char)((0x00FF00 & spd) >> 8);
 spd_l = (unsigned char)(0x00FF & spd);
 
 // コマンド（レジスタアドレス）送信。
 L6470_write(dir);
 // データ送信。
 L6470_write(spd_h);
 L6470_write(spd_m);
 L6470_write(spd_l);
 
  Serial.print( " current spd = ");
  Serial.println( spd );
}
```

ステッピングモータートルク保持休憩（リミットスイッチで原点復帰）

### 前提
普段はハード設計や製造をしているソフト初心者です。今回初めてプログラミングをしています。事前にC言語の基本だけ軽く勉強しました。
ESP32にsoftAP機能とAsyncwebserverを実装して、非同期Webサーバとして運用しています。
基板にロータリーエンコーダが接続されており、HTML Webページ上から測定開始や、測定距離の記録などを行うアプリを実現したいと思っています。
![イメージ説明](3315511f96f78139b04aa5323a245e6f.jpeg)

### 現状実現できていること
・タイマーを使ったロータリーエンコーダの高速読み取り
・カウント数、距離換算値などを非同期で更新
・各種ボタンを押した際にHTML側からサーバ側にPOSTし、画面遷移せずに関数を呼び出したりできる
![イメージ説明](3d2037fb15a30310cdd962b00aa978e0.jpeg)
-----
![イメージ説明](ce8e8ba1b5bdbd35dc022161721ea317.jpeg)

### 行き詰っている部分
HTML画面上でENDボタンを押した際に、記録されている各配列のデータをTABLEとして
画面上に生成したいです。

サーバ側とHTML側(javascript側?)間の単一文字列のやり取りは実現できていますが、
サーバ側からHTML側に配列を渡す方法が分かりません。
その先で、渡された配列をもとに必要な行数を持ったTABLEを生成する方法もまだよく分かりません…


### 該当のソースコード
重要そうな部分のみ

```Arduino
//////////get処理//////////

String getENC1_count()
{
  sprintf( tempcbuf, "%20lld",enc1_count);
  return String(tempcbuf);
}
String getENC1_dist()
{
  dtostrf( enc1_dist, 10, 2, tempcbuf);
  return String(tempcbuf);
}

String getsection_number()
{
  sprintf( tempcbuf, "%d",section_number);
  return String(tempcbuf);
}

String getsection_length()
{
  section_length_display = enc1_dist - mark_point[section_number];
  dtostrf( section_length_display, 10, 2, tempcbuf);
  return String(tempcbuf);
}

//////////function//////////

void START_f()
{
  if (!COUNT_EN)
  {
    COUNT_EN = 1 ;
    if (!section_number)
    {
      mark_point[section_number] = enc1_dist ;
    }
    Serial.println("COUNT START NOW");
    Serial.print("COUNT_EN = ");Serial.println(COUNT_EN);
  }
  else
  {
    Serial.println("COUNT is already ENABLE");
  }
}

void mark_point_f()
{
  mark_point[section_number + 1] = enc1_dist ;
  section_length[section_number] = mark_point[section_number + 1] - mark_point[section_number];
  Serial.print("Section");
  Serial.print(section_number);
  Serial.printf("\t区間長: ");
  Serial.print(section_length[section_number]);Serial.print("[mm]");
  section_number ++; 
}

void END_f()
{
  Serial.printf("\n-----RESULT-----\n");
  int i ;
  for ( i=0 ; section_number > i ; i++ )
  {
    Serial.print("Section");
    Serial.print(i);
    Serial.printf("\t区間長: ");
    Serial.print(section_length[i]);Serial.print("[mm]");
  }
  COUNT_EN = 0 ;
}

//////////HTTP//////////

void HTTP_task(void *pvParameters)
{
  // サーバーのルートディレクトリにアクセスされた時のレスポンス
  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(SPIFFS, "/index.html", String(), false );
    delay(1) ;
  });
  
  // POST解析&処理
  server.on("/POST_Receiver", HTTP_POST, [](AsyncWebServerRequest *request) {
    int params = request->params();   //
    for(int i=0;i<params;i++)
    {
      AsyncWebParameter* p = request->getParam(i);
      Serial.printf("POST[%s]: %s\n", p->name().c_str(), p->value().c_str());  
      String param = p->value().c_str();
      if( param == "START" ){START_f();}
      else if( param == "MARK" ){mark_point_f();}
      else if( param == "END" ){END_f();}
      else if( param == "RESET" ){RESET_f();}
    }
    delay(1) ;
  });
 
  /////JavaScript 更新/////
  server.on("/ENC1_count", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(200, "text/plain", getENC1_count());
    delay(1) ;
  });

  server.on("/ENC1_dist", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(200, "text/plain", getENC1_dist()+" [mm]");
    delay(1) ;
  });
  
  server.on("/section_number", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(200, "text/plain", getsection_number());
    delay(1) ;
  });

  server.on("/section_length", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(200, "text/plain", getsection_length()+" [mm]");
    delay(1) ;
  });
}

//////////setup&loop//////////

void setup()
{
  Serial.begin(115200);
  // SPIFFSのセットアップ
  if(!SPIFFS.begin(true))
  {
    Serial.println("An Error has occurred while mounting SPIFFS");
    return;
  }
  
  pinMode( ENC1_A , INPUT_PULLUP);
  pinMode( ENC1_B , INPUT_PULLUP);
 
  //無線LAN接続APモード
  delay(200);
  WiFi.mode(WIFI_AP);
  WiFi.softAP(ap_ssid, ap_password);
  WiFi.softAPConfig(ip, ip, subnet);
  IPAddress myIP = WiFi.softAPIP();

  xTaskCreateUniversal(HTTP_task,"HTTP_task",8192,NULL,2,&httptaskHandle,APP_CPU_NUM);

  // サーバースタート
  server.begin();

  timer1 = timerBegin(0, 80, true);
  timerAttachInterrupt(timer1, &ENC_READ, true);
  timerAlarmWrite(timer1, 20 , true);
  timerAlarmEnable(timer1);
}

void loop()
{
  delay(200);  
}
```
```HTML
  <body>

    <div class="title">
      <h1 class="title_item">
        <p>AsyncWebServer_TEST</p>
      </h1>
    </div>

    <div class="ENC_stat">
      <SPAN>ENC COUNT : </SPAN><SPAN id="ENC1_count">%ENC_count%</SPAN>
    </div>
    <div class="ENC_stat">
      <SPAN>ENC DISTANCE : </SPAN><SPAN id="ENC1_dist">%ENC_dist%</SPAN>
    </div>
    <div class="ENC_stat2">
      <SPAN>SECTION NUMBER : </SPAN><SPAN id="section_number">%section_number%</SPAN>
    </div>
    <div class="ENC_stat2">
      <SPAN>SECTION LENGTH : </SPAN><SPAN id="section_length">%section_length%</SPAN>
    </div>

    <p id="OPERATING_STATUS">%OPERATING_STATUS%</p>

    <div>
      <button id="START" class="SW" type="button" name="ST_SW" value="START" onclick="POST_event(this.id);"><p class="SWtext">START</p></button>
      <button id="MARK" class="SW" type="button" name="MK_SW" value="MARK" onclick="POST_event(this.id);"><p class="SWtext">MARK</p></button>
    </div>
    <div>
      <button id="END" class="SW" type="button" name="END_SW" value="END" onclick="POST_event(this.id);"><p class="SWtext">END</p></button>
      <button id="RESET" class="SW" type="button" name="RESET_SW" value="RESET" onclick="POST_event(this.id);"><p class="SWtext">RESET</p></button>
    </div>

    <div class="SECTION_DATA">
      <table>
        <thead>
          <tr><th>区間番号</th><th>積算長[mm]</th><th>区間長[mm]</th></tr>
        </thead>
        <tbody>
          <tr><td>0</td><td>a</td><td>a</td></tr>
          <tr><td>1</td><td>a+b</td><td>b</td></tr>
          <tr><td>2</td><td>a+b+c</td><td>c</td></tr>
          <tr><td>3</td><td>a+b+c+d</td><td>d</td></tr>
        </tbody>
      </table>
    </div>

<script>
    //ENC1_count
    var getENC1_count = function ()
    {
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function()
      {
        if (this.readyState == 4 && this.status == 200)
        {
          document.getElementById("ENC1_count").innerHTML = this.responseText;
        }
      };
      xhr.open("GET", "/ENC1_count", true);
      xhr.send(null);
    }
    setInterval(getENC1_count, 200);

    //ENC1_dist
    var getENC1_dist = function ()
    {
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function()
      {
        if (this.readyState == 4 && this.status == 200)
        {
          document.getElementById("ENC1_dist").innerHTML = this.responseText;
        }
      };
      xhr.open("GET", "/ENC1_dist", true);
      xhr.send(null);
    }
    setInterval(getENC1_dist, 200);

    //section_number
    var getsection_number = function ()
    {
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function()
      {
        if (this.readyState == 4 && this.status == 200)
        {
          document.getElementById("section_number").innerHTML = this.responseText;
        }
      };
      xhr.open("GET", "/section_number", true);
      xhr.send(null);
    }
    setInterval(getsection_number, 200);

    //section_length
    var getsection_length = function ()
    {
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function()
      {
        if (this.readyState == 4 && this.status == 200)
        {
          document.getElementById("section_length").innerHTML = this.responseText;
        }
      };
      xhr.open("GET", "/section_length", true);
      xhr.send(null);
    }
    setInterval(getsection_length, 200);

    //OPERATING_STATUS
    var getOPERATING_STATUS = function ()
    {
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function()
      {
        if (this.readyState == 4 && this.status == 200)
        {
          document.getElementById("OPERATING_STATUS").innerHTML = this.responseText;
        }
      };
      xhr.open("GET", "/OPERATING_STATUS", true);
      xhr.send(null);
    }
    setInterval(getOPERATING_STATUS, 1000);

    //POST
    function POST_event(buttonID)
    {
      var XHR = new XMLHttpRequest();
      var postDatas = new FormData(formDatas);
      var formDatas = document.getElementById(buttonID).value;
      postDatas.append("param",  formDatas);
      XHR.open("POST", "/POST_Receiver", true);
      XHR.send(postDatas);
      document.getElementById("text").innerHTML = formDatas;
      setInterval(POST_event, 200);
    }

    </script>
  </html>
```

以上、どなたかアドバイスいただけると嬉しいです

### 補足情報（FW/ツールのバージョンなど）

Arduino IDE 1.8.13

[ESP32]Webサーバ側からHTML(javascript)側へ配列を渡して、TABLEを生成したい

scanfでの複数入力について教えてください。
下記コードに対して、キーボードからTaro,30,maleと入力すると、
出力が　name = taro,30,male,age = 0, gender = p@　となり、
構造体のnameメンバに入力値が全て格納されてしまいます。
scanfの指定子を"%s%d%s"に変更して、入力をTaro 30 male　にすると正しく読み込まれます。
入力指定子の間に区切り文字を入れても入力できると教科書には書いてありますが、
何が原因でエラーになっているのでしょうか？

```ここに言語を入力
#include <stdio.h>

typedef struct{
    char name[10];
    int age;
    char gender[10];
}student;

void input(student *data){
    printf("input name,age,gender :" );
    scanf("%s,%d,%s", data->name, &data->age, data->gender);
}

void output(student *data){
    printf("name = %s,age = %d, gender = %s", data->name, data->age, data->gender );
}

int main(void){
  
    student data;
    input(&data);
    output(&data);
    
return 0;

}

```

scanfで区切り文字を使用した複数入力について

独学プログラマーの本に載っているコードの中で
WarGameというのがあります。

player1,2の名前を入力すると自動でトランプを選び、どっちの数が大きいか、大きかったら勝ちで勝った人の名前が表示されるのを繰り返し、最終的に勝った回数が多い人の名前が表示されます。

**
コードの中で疑問があります。**


名前を入力した後、

ゲームを始めます。終わるときはｑ、startはq以外を入力

と表示されます。

もし、いきなり終了を選択した場合、

ｹﾞｰﾑを終わります。【ひきわけが勝ちました。】

となります。
ｹﾞｰﾑを繰り返したあと、最後に表示される文章と同じですが、すぐ終了した場合は引き分けとなり、それ以外は勝った人の名前がはいります。
もしこれを一回目ｹﾞｰﾑを始める前に終了するときは
【ひきわけ。】で終わるにはどうしたらいいですか？

本には日本語で載っていますが、本で紹介されているサイトの英語版のコードです。


```Pythonここに言語を入力
from random import shuffle


class Card:
    suits = ["spades",
             "hearts",
             "diamonds",
             "clubs"]

    values = [None, None,"2", "3",
              "4", "5", "6", "7",
              "8", "9", "10",
              "Jack", "Queen",
              "King", "Ace"]

    def __init__(self, v, s):
        """suit + value are ints"""
        self.value = v
        self.suit = s

    def __lt__(self, c2):
        if self.value < c2.value:
            return True
        if self.value == c2.value:
            if self.suit < c2.suit:
                return True
            else:
                return False
        return False

    def __gt__(self, c2):
        if self.value > c2.value:
            return True
        if self.value == c2.value:
            if self.suit > c2.suit:
                return True
            else:
                return False
        return False

    def __repr__(self):
        v = self.values[self.value] +\
            " of " + \
            self.suits[self.suit]
        return v


class Deck:
    def __init__(self):
        self.cards = []
        for i in range(2, 15):
            for j in range(4):
                self.cards\
                    .append(Card(i,
                                 j))
        shuffle(self.cards)

    def rm_card(self):
        if len(self.cards) == 0:
            return
        return self.cards.pop()


class Player:
    def __init__(self, name):
        self.wins = 0
        self.card = None
        self.name = name


class Game:
    def __init__(self):
        name1 = input("p1 name ")
        name2 = input("p2 name ")
        self.deck = Deck()
        self.p1 = Player(name1)
        self.p2 = Player(name2)

    def wins(self, winner):
        w = "{} wins this round"
        w = w.format(winner)
        print(w)

    def draw(self, p1n, p1c, p2n, p2c):
        d = "{} drew {} {} drew {}"
        d = d.format(p1n,
                     p1c,
                     p2n,
                     p2c)
        print(d)

    def play_game(self):
        cards = self.deck.cards
        print("beginning War!")
        while len(cards) >= 2:
            m = "q to quit. Any " + \
                "key to play:"
            response = input(m)
            if response == 'q':
                break
            p1c = self.deck.rm_card()
            p2c = self.deck.rm_card()
            p1n = self.p1.name
            p2n = self.p2.name
            self.draw(p1n,
                      p1c,
                      p2n,
                      p2c)
            if p1c > p2c:
                self.p1.wins += 1
                self.wins(self.p1.name)
            else:
                self.p2.wins += 1
                self.wins(self.p2.name)

        win = self.winner(self.p1,
                         self.p2)
        print("War is over.{} wins"
              .format(win))

    def winner(self, p1, p2):
        if p1.wins > p2.wins:
            return p1.name
        if p1.wins < p2.wins:
            return p2.name
        return "It was a tie!"

game = Game()
game.play_game()

``````

独学プログラマーのコードを変えたい

teratailに質問するのが初めての場合、ソースコードを**```**で囲まずにベタで書いているという人が結構いるかと思います。親切な方が指摘してあげていますが、ときにはなかなか直さない人もいます。

こういうソースコードをコードとして囲っていない質問はとても損をしていると思います。まず、ソースコードがとても見難いです。そして、問題があるというソースコードを検証するためにローカルにコピーするのがとてもし難いです。調べて回答しようと思う気力がガクッと下がります。私はそのような質問を見たとき「そっ閉じ」する場合もあります。とくに、C/C++でのマクロ部分は見出しとして解釈されるため、詳しく見る気がかなり失せます。インデントも消えてしまうので、PythonやCoffeeScriptなどインデントが重要な言語の場合は、どういうコードなのかさえわかりません。

さて、そこで皆さんに質問です。

* なぜ、囲まない人が少なからずいるのでしょうか？どうしたら減らせるのでしょうか？teratailの質問のフォームはよくできていると思いますが、何が足りないのでしょうか？
* 質問フォームの右側にプレビューがでるので、普通ならおかしいと気付くはずです。それでも、そのまま投稿してしまうのはなぜなのでしょうか？
* このような囲まない人へはどう対応すべきなのでしょうか？「初心者だから仕方がない」と優しく教えてあげるべきなのでしょうか？それとも、「プログラマーであればmarkdownぐらい書けるのは当たり前」「書き方はヘルプに書いてある。ヘルプを読まない奴は技術者じゃない」「プレビューすら確認しない奴にプログラミングをする資格は無い」と突っぱねるべきなのでしょうか？
* こういった質問が出るのは仕方がないとして、質問への修正依頼をするにあたり、どのような文章がいいでしょうか？初心者でもわかりやすく、齟齬がなく、読めば誰でもできるような、そんな素敵な文章をお待ちしております。
* こういった質問をなるべく少なくするべく、私達回答者ができることやteratailの運営に要望として出せることは他に何があるのでしょうか？

ソースコードぐらいは```で囲んで欲しい！

Youtubeでとある動画を観たのですが質問の仕方が下手なゲームプログラマーは上司に激しく怒られるそうです
 自分は質問の仕方がとても下手なのでよろしければ分かりやすい質問の仕方（例えばUnityでの操作や C#での質問）を教えていただきたいです
 できれば現or元エンジニアの方で質問が下手な部下は何が出来ていないのか、また、何をどうすればいいのか教えていただきたいです
 先ほども言いましたが自分は質問が下手なので分かりづらい内容になっていると思いますが回答して頂けると嬉しいです

分かりやすい質問の仕方を教えてほしい

目標)
筋トレの記録をまとめるアプリをつくりたい

一回の筋トレで
胸、背中、脚、腕の４種目を行う

それぞれの扱ったダンベルの重さを記入してもらう

一回分の記録例)
chest, back, leg, arm
40     30    50   15

このように、一回の記録を　N回分記録する。
N回分の記録集計後、部位別にリストを作成する。
そして、部位ごとのリストにそれぞれ異なった命令をだす。

chest: 初日のダンベルの重さ
back: 最終日のダンベルの重さ
leg: 最大のダンベルの重さ
arm: 最小のダンベルの重さ

入力例)
N = 5
40 30 50 15
41 31 45 9
42 32 40 10
43 33 40 12
44 34 55 20

出力例)

40 34 55 9

疑問点)

前回の質問でのアドバイスをもとに求めたい数字を出力できた。
動作の不備等はございません。
後半の赤枠部分は基礎文法利用して書いたため、よりスマートな書き方などがあればアドバイス頂きたいです。

![イメージ説明](2a735cecbe7ff4745dd94103cd080fdc.png)


import numpy as np

training_records = np.array([
    list(map(int, input().split()))
    for _ in range(int(input()))
])

total_training_records =np.array([
    list(map(int, training_records[:,i]))
    for i in range(4)
    ])


start_day_chest = total_training_records[0][0]

last_day_back = total_training_records[1][-1]

takane_leg = max(total_training_records[2])

yasune_arm = min(total_training_records[3])

result = []
result.append(start_day_chest)
result.append(last_day_back)
result.append(takane_leg)
result.append(yasune_arm)
print(*result)

Python3 リストの中のリスト　要素追加、

先ほど、CSSが効かないのを質問したんですが、またteratailでの質問の書き方など色々なとこで分からないこと多く、ソースコードをコピペしたのを掲載してしまいました。

そうすると一人の回答者さんが、どうなってるか再現するためにもソースコードはコピペじゃな、<code>を押して書いた方がいいと、教えてくださいました。

しかしteratail初心者で、質問もまだ2回目で、質問欄にソースコード載せる場合、<code>を押してからどのように書くか分からなく、困っております。

どのようにして、<code>ボタン押してから、ソースコード記述したらいいんでしょうか？

他にも質問する際の決まり事や書き方をヘルプで見ても、詳しく書いていないので、教えて欲しいです。

初歩的な質問して申し訳ございません。
よろしくお願いします。

teratail初心者で、質問もまだ2回目で、質問欄にソースコード載せる場合、<code>を押してからどのように書くかを、教えて欲しいです。

decltypeには不思議がいっぱいです。
その驚くほど複雑な仕様は、彼ら闇魔術師の足元にも及ばない私には大変理解し難いものです。

以下のコードにあるdecltype((a))はその仕様のうちの一つです。
```Cpp
#include <iostream>

int main() {
	int a = 2; // int
	decltype(a) b = a; // int
	decltype((a)) c = a; // int&   ←こ↑こ↓
	++c;
	decltype(auto) d = ++a; // int&
	++d;

	cout << a << " " << b << " " << c << " " << d << endl;

	return 0;
}

```
何故()を付けると、参照型だと推論されてしまうのでしょうか。

decltype(auto)に関しては、「Effective Modern C++」という魔導書を読んだことで辛うじて理解できています・・・
トラックに轢かれても、彼らの世界にだけは転生したくありません。

decltypeの不思議

constの値で配列の要素数を指定したいのですが、コンパイルエラーになってしまいます。

```c++
class Game
{
private:
    const int xSize = 10;
    const int ySize = 3;
    char mMap[xSize][ySize];
};
```
以下はエラーです。
```c++
invalid use of non-static data member ‘Game::xSize’
```
なにがいけないんでしょうか？

【C++】 constの値で配列の要素数を指定したい

C++の標準ライブラリを一通り勉強したいのですが、何か良い方法はありますでしょうか？
今検討しているのは「C++標準ライブラリの使い方 完全ガイド」という本なのですが2005年と少し古いように感じるのですが問題ないでしょうか？

C++標準ライブラリをマスターしたい。

**ボールドテキスト**### 前提・実現したいこと
vector<string>型で定義された集合のvector<vector<string>>型の冪集合を作成する関数をテンプレート化して冪集合の冪集合なども作成できる関数power()という引数がT(テンプレート)、返り値がvector<T>な関数があるのですが、これを使ってある自然数nを渡したらn回この関数を起動して冪集合の冪集合の・・・ということを実現しようとしたのですが、型推論がうまくいかなかったためかコンパイルが終わらなくなりました。そこで人に尋ねたところ以下のようなソースコードを渡されました。曰く、読むには多大な知識を擁するそうなのですが、具体的に何を行なっているかを解説していただければ幸いです。もしくは参考になる資料を提示して頂けると勉強がしやすいのでお願いします。

### 該当のソースコード


//1
//呼び出し方Recurr<vactor<string>, 2>::incr_power(sa);
template<typename T, std::size_t N>
struct Recurr;

template<typename T>
struct Recurr<T, 0> {
   static void incr_power(const T& x)
   {
      cout <<"done\n";
   }
};

template<typename T, std::size_t N>
struct Recurr {
   static void incr_power(const T& x)
   {
      cout << N <<endl;
      cout << x <<endl;
      Recurr<vector<T>, N-1>::incr_power(power(x));
      cout << endl;
   }
};

```

再帰的なテンプレートについて

### 前提・実現したいこと
Grid-EYE(ROBOBA041)という温度センサの出力温度データを，ESP-WROOM-02をWebサーバとして用いて，ブラウザに表示したいと考えております．
ArduinoIDEを用いて，ESPに以下のようなプログラムを書き込んだところ，毎秒ごとに温度データの更新と表示を行うことに成功しました．
しかし，現段階ではブラウザの更新により，温度データの更新を行っている状態であり，今後温度データ以外の要素（ラジオボタンなど）もブラウザ表示するとなった場合，温度データのみ更新を行うようにしたいと考えました．
どうにかして，ブラウザの中での温度データ部分のみ更新を繰り返すようにはできないでしょうか．
よろしくお願いいたします。

### 該当のソースコード

```Arduino
#include <WiFiClient.h>
#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <Wire.h>
#include <GridEye.h>

GridEye myeye = GridEye(GridEye_DeviceAddress_1);
ESP8266WebServer server(80);

void onroot() {
    String msg ;
    int pixel[64];
    msg += "<!DOCTYPE html>";
    msg += "<html><head><meta http-equiv=\"refresh\" content=\"1\" charset=\"utf-8\">";
    msg += "<meta http-equiv=\"content-type\" content=\"text/html; 
                                                charset=UTF-8\">";
    msg += "<title>Temperature</title><body>";
    myeye.pixelOut(pixel); // Grid-EYEの温度データ読み出し
    for (int i = 0; i < 64; i++) {
      if (i && ((i % 8) == 0)) {
      msg += "<br>";
    }
    msg += "<font size='3'>" + String(pixel[i]* 0.25) + "</font>"; //温度デー 
                                                                    タを表示
    msg += "&nbsp;";
    }
    msg += "<p id=\"LED\"></p>";
    msg += "</body></html>";
    server.send(200, "text/html", msg);
}

void setup() {
    Serial.begin(115200);
    Wire.begin();
    WiFi.config(IPAddress(***, ***, ***, ***), WiFi.gatewayIP(), 
          WiFi.subnetMask());//使いたいIPアドレスを指定
    WiFi.begin("*******", "********");

    WiFi.mode(WIFI_STA);

    // Web server setting
    server.on("/", onroot);
    server.begin();
}

void loop() {
    server.handleClient();
}
```

### 試したこと
上記のプログラムを実行すると，このようなデータが表示され，毎秒ごとに更新されます．

![イメージ説明](df1f37dfe523b92ec485099abcf3435e.png)

### 補足情報

Grid-EYEは二次元温度データを8*8要素の数値として出力する赤外線アレイセンサです．なので出力される温度データも8*8(64)となっています．

二次元温度データの周期的なブラウザ出力

C++を学ぶことにしましたが自分にとっては書籍の方がインターネット上で読むより慣れているので様々なサイトも利用はしますが書籍の購入を検討しています。
初心者から初めてどのような流れでなんという書籍を買えば良いのでしょうか？Amazonなどのレビューは少し信用ならないので(teratailが絶対信用出来る訳でもないですが)ここで聞きたいと思います。
調べた中ではローベル、独習、ストラウストラップ、effective系などが結構な頻度で見られるのですが、もし持っていましたら感想などがあるとありがたいです