홈 › Components › Graph and Graphing Calc › 화면 14

화면 14. Graph.saveOnChange [sink]

원본: Computation Layer 문서(Graph) · Try It (원본 화면)

화면 번호	14 / 29
문서 항목 설명 (원문)	Specify a string value. If that value changes, the component saves its state.

1. 화면 캡처 (빨간 번호 = 아래 표의 번호)

화면에 적힌 영어 문구(원문):

With saveOnChange
Without saveOnChange

2. CL이 입력된 곳

코드 안의 회색 줄은 원문 영어 주석이고, 파란 줄은 그 영어 주석의 번역이며, 연분홍 줄은 코드가 하는 일의 설명이다.

번호 이름 종류 CL 코드 원문, 번역, 설명

번호	이름	종류	CL 코드 원문, 번역, 설명
1	master CL (화면 전체)	SCREEN	subtitle: "Press \"Start Timers\", then navigate to another screen and back.\nNotice how one timer continues where it left off and the other resets?" ▶ 화면 제목 아래에 표시할 부제목(subtitle)은 "Press \"Start Timers\", then navigate to another screen and back.\nNotice how one timer continues where it left off and the other resets?"('Start Timers'를 누른 뒤 다른 화면으로 이동했다가 돌아오시오. 한 타이머는 멈췄던 곳에서 이어지고 다른 타이머는 처음부터 다시 시작되는 것을 확인해 보시오.)로 한다. 글자 안의 `\"`는 따옴표 글자 하나이므로 `\"Start Timers\"`는 화면에 "Start Timers"로 표시되고, `\n`은 줄바꿈이라서 그 자리에서 줄이 바뀌어 두 줄로 표시된다.
2	graphLeft	그래프	# Saves the graph state whenever the number "a" # is updated in the graph. ▷ 그래프의 숫자 "a"가 바뀔 때마다 그래프의 상태를 저장한다. saveOnChange: "${this.number(`a`)}" ▶ 이 그래프의 상태를 저장할 조건(saveOnChange)은 "${this.number(`a`)}", 즉 이 그래프의 변수 `a`의 값을 글자로 만든 것으로 한다. `saveOnChange`는 글자 값을 받고, 그 값이 바뀔 때마다 구성요소가 상태를 저장한다. `${ }`는 글자 안에 값을 끼워 넣는 표기이다.
3	graphRight	그래프	# Syncs the value of p_{ress} in this graph to the # value of p_{ress} in graphLeft. ▷ 이 그래프의 p_{ress} 값을 graphLeft의 p_{ress} 값과 같게 맞춘다. number(`p_{ress}`): graphLeft.number(`p_{ress}`) ▶ 그래프의 변수 `p_{ress}`는 graphLeft 그래프의 변수 `p_{ress}`의 값(graphLeft.number(`p_{ress}`))으로 한다. 변수 이름을 백틱으로 감싸 적었으며, 백틱으로 감싼 글자는 latex 값이다. graphLeft.number(`p_{ress}`)는 graphLeft 그래프의 변수 값을 읽어 온다. 두 그래프의 `p_{ress}`가 항상 같은 값으로 이어진다(동기화).

master CL
(화면 전체)

SCREEN

subtitle: "Press \"Start Timers\", then navigate to another screen and back.\nNotice how one timer continues where it left off and the other resets?"
▶ 화면 제목 아래에 표시할 부제목(subtitle)은 "Press \"Start Timers\", then navigate to another screen and back.\nNotice how one timer continues where it left off and the other resets?"('Start Timers'를 누른 뒤 다른 화면으로 이동했다가 돌아오시오. 한 타이머는 멈췄던 곳에서 이어지고 다른 타이머는 처음부터 다시 시작되는 것을 확인해 보시오.)로 한다.
글자 안의 \"는 따옴표 글자 하나이므로 \"Start Timers\"는 화면에 "Start Timers"로 표시되고, \n은 줄바꿈이라서 그 자리에서 줄이 바뀌어 두 줄로 표시된다.

graphLeft

그래프

# Saves the graph state whenever the number "a"
# is updated in the graph.
▷ 그래프의 숫자 "a"가 바뀔 때마다 그래프의 상태를 저장한다.
saveOnChange: "${this.number(`a`)}"
▶ 이 그래프의 상태를 저장할 조건(saveOnChange)은 "${this.number(`a`)}", 즉 이 그래프의 변수 a의 값을 글자로 만든 것으로 한다.
saveOnChange는 글자 값을 받고, 그 값이 바뀔 때마다 구성요소가 상태를 저장한다. ${ }는 글자 안에 값을 끼워 넣는 표기이다.

graphRight

그래프

# Syncs the value of p_{ress} in this graph to the
# value of p_{ress} in graphLeft.
▷ 이 그래프의 p_{ress} 값을 graphLeft의 p_{ress} 값과 같게 맞춘다.
number(`p_{ress}`): graphLeft.number(`p_{ress}`) 
▶ 그래프의 변수 p_{ress}는 graphLeft 그래프의 변수 p_{ress}의 값(graphLeft.number(`p_{ress}`))으로 한다.
변수 이름을 백틱으로 감싸 적었으며, 백틱으로 감싼 글자는 latex 값이다. graphLeft.number(`p_{ress}`)는 graphLeft 그래프의 변수 값을 읽어 온다. 두 그래프의 p_{ress}가 항상 같은 값으로 이어진다(동기화).