diff --git a/curriculum/challenges/arabic/02-javascript-algorithms-and-data-structures/basic-javascript/record-collection.md b/curriculum/challenges/arabic/02-javascript-algorithms-and-data-structures/basic-javascript/record-collection.md index 9f6ce12b4d8..c2dac79b728 100644 --- a/curriculum/challenges/arabic/02-javascript-algorithms-and-data-structures/basic-javascript/record-collection.md +++ b/curriculum/challenges/arabic/02-javascript-algorithms-and-data-structures/basic-javascript/record-collection.md @@ -21,9 +21,8 @@ Complete the function using the rules below to modify the object passed to the f - Your function must always return the entire `records` object. - If `value` is an empty string, delete the given `prop` property from the album. -- If `prop` isn’t `"tracks"` and `value` isn't an empty string, assign the `value` to that album’s `prop`. -- If `prop` is `"tracks"` and `value` isn’t an empty string, add the `value` to the end of the album’s existing `"tracks"` array. -- If the album doesn’t have a `"tracks"` property, create a new array for the album's `"tracks"` property before adding the `value` to it. +- If `prop` isn't `tracks` and `value` isn't an empty string, assign the `value` to that album's `prop`. +- If `prop` is `tracks` and value isn't an empty string, add the `value` to the end of the album's `tracks` array. You need to create this array first if the album does not have a `tracks` property. **Note:** A copy of the `recordCollection` object is used for the tests. You should not directly modify the `recordCollection` object. diff --git a/curriculum/challenges/arabic/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d324f5915c929f36ae91d.md b/curriculum/challenges/arabic/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d324f5915c929f36ae91d.md index dbe1d9b5301..3b4895acece 100644 --- a/curriculum/challenges/arabic/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d324f5915c929f36ae91d.md +++ b/curriculum/challenges/arabic/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d324f5915c929f36ae91d.md @@ -35,6 +35,12 @@ assert([...[...new __helpers.CSSHelp(document).getCSSRules('keyframes')].find(ru assert([...[...new __helpers.CSSHelp(document).getCSSRules('keyframes')].find(rule => rule?.name === 'wave')?.cssRules].some(css => css?.keyText === '40%')); ``` +You should have 4 waypoints in your keyframe. + +```js +assert([...[...new __helpers.CSSHelp(document).getCSSRules('keyframes')].find(rule => rule?.name === 'wave')?.cssRules].length === 4); +``` + # --seed-- ## --seed-contents-- diff --git a/curriculum/challenges/chinese-traditional/00-certifications/college-algebra-with-python-certification/college-algebra-with-python-certification.yml b/curriculum/challenges/chinese-traditional/00-certifications/college-algebra-with-python-certification/college-algebra-with-python-certification.yml index 8d08c54ba6f..d83cac69791 100644 --- a/curriculum/challenges/chinese-traditional/00-certifications/college-algebra-with-python-certification/college-algebra-with-python-certification.yml +++ b/curriculum/challenges/chinese-traditional/00-certifications/college-algebra-with-python-certification/college-algebra-with-python-certification.yml @@ -7,16 +7,16 @@ isPrivate: true tests: - id: 63d83ff239c73468b059cd3f - title: Build a Multi-Function Calculator + title: 創建一個多功能計算器 - id: 63d83ffd39c73468b059cd40 - title: Build a Graphing Calculator + title: 創建一個圖形計算器 - id: 63d8401039c73468b059cd41 - title: Build Three Math Games + title: 創建三個數學遊戲 - id: 63d8401e39c73468b059cd42 - title: Build a Financial Calculator + title: 創建一個財務計算器 - id: 63d8402e39c73468b059cd43 - title: Build a Data Graph Explorer + title: 創建一個數據圖表瀏覽器 diff --git a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/record-collection.md b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/record-collection.md index 0e2cab49446..ca0254eb5cf 100644 --- a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/record-collection.md +++ b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/record-collection.md @@ -8,28 +8,27 @@ dashedName: record-collection # --description-- -You are creating a function that aids in the maintenance of a musical album collection. The collection is organized as an object that contains multiple albums which are also objects. Each album is represented in the collection with a unique `id` as the property name. Within each album object, there are various properties describing information about the album. Not all albums have complete information. +你將創建一個幫助維護音樂專輯集的函數。 這個集合是一個包含多個相冊的對象,這些相冊也是對象。 每張專輯在集合中以唯一的 `id` 作爲屬性名來表示。 在每個專輯對象中,有各種描述專輯信息的屬性。 並非所有專輯都有完整的信息。 -The `updateRecords` function takes 4 arguments represented by the following function parameters: +`updateRecords` 函數有 4 個參數,即以下參數: -- `records` - an object containing several individual albums -- `id` - a number representing a specific album in the `records` object -- `prop` - a string representing the name of the album’s property to update -- `value` - a string containing the information used to update the album’s property +- `records` - 一個包含多個專輯的對象 +- `id` - 一個數字,代表 `records` 對象中特定的專輯 +- `prop` - 一個字符串,代表相冊屬性名稱 +- `value` - 一個字符串,包含用來更新相冊屬性的信息 -Complete the function using the rules below to modify the object passed to the function. +使用下面的規則完成函數來修改傳遞給函數的對象。 -- Your function must always return the entire `records` object. -- If `value` is an empty string, delete the given `prop` property from the album. -- If `prop` isn’t `"tracks"` and `value` isn't an empty string, assign the `value` to that album’s `prop`. -- If `prop` is `"tracks"` and `value` isn’t an empty string, add the `value` to the end of the album’s existing `"tracks"` array. -- If the album doesn’t have a `"tracks"` property, create a new array for the album's `"tracks"` property before adding the `value` to it. +- 你的函數必須始終返回整個 `records` 對象。 +- 如果 `value` 是空字符串,從專輯裏刪除指定的 `prop`。 +- If `prop` isn't `tracks` and `value` isn't an empty string, assign the `value` to that album's `prop`. +- If `prop` is `tracks` and value isn't an empty string, add the `value` to the end of the album's `tracks` array. You need to create this array first if the album does not have a `tracks` property. -**Note:** A copy of the `recordCollection` object is used for the tests. You should not directly modify the `recordCollection` object. +**注意:** 將 `recordCollection` 對象的副本用於測試。 你不應該直接修改 `recordCollection` 對象。 # --hints-- -After `updateRecords(recordCollection, 5439, "artist", "ABBA")`, `artist` should be the string `ABBA` +執行 `updateRecords(recordCollection, 5439, "artist", "ABBA")` 後,`artist` 的值應該是字符串 `ABBA`。 ```js assert( @@ -38,7 +37,7 @@ assert( ); ``` -After `updateRecords(recordCollection, 5439, "tracks", "Take a Chance on Me")`, `tracks` should have the string `Take a Chance on Me` as the last and only element. +執行 `updateRecords(recordCollection, 5439, "tracks", "Take a Chance on Me")` 後,`tracks` 的最後一個和唯一一個元素應該爲字符串 `Take a Chance on Me`。 ```js assert( @@ -48,14 +47,14 @@ assert( ); ``` -After `updateRecords(recordCollection, 2548, "artist", "")`, `artist` should not be set +執行 `updateRecords(recordCollection, 2548, "artist", "")` 後,`artist` 不應被設置爲任何值。 ```js updateRecords(_recordCollection, 2548, 'artist', ''); assert(!_recordCollection[2548].hasOwnProperty('artist')); ``` -After `updateRecords(recordCollection, 1245, "tracks", "Addicted to Love")`, `tracks` should have the string `Addicted to Love` as the last element. +執行 `updateRecords(recordCollection, 1245, "tracks", "Addicted to Love")` 後,`tracks` 的最後一個元素應該爲字符串 `Addicted to Love`。 ```js assert( @@ -65,7 +64,7 @@ assert( ); ``` -After `updateRecords(recordCollection, 2468, "tracks", "Free")`, `tracks` should have the string `1999` as the first element. +執行 `updateRecords(recordCollection, 2468, "tracks", "Free")` 後,`tracks` 的第一個元素應該爲字符串 `1999`。 ```js assert( @@ -75,14 +74,14 @@ assert( ); ``` -After `updateRecords(recordCollection, 2548, "tracks", "")`, `tracks` should not be set +執行 `updateRecords(recordCollection, 2548, "tracks", "")` 後,`tracks` 不應被設置爲任何值。 ```js updateRecords(_recordCollection, 2548, 'tracks', ''); assert(!_recordCollection[2548].hasOwnProperty('tracks')); ``` -After `updateRecords(recordCollection, 1245, "albumTitle", "Riptide")`, `albumTitle` should be the string `Riptide` +執行 `updateRecords(recordCollection, 1245, "albumTitle", "Riptide")` 後,`albumTitle` 的值應該是字符串 `Riptide`。 ```js assert( diff --git a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/word-blanks.md b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/word-blanks.md index 1bc786917d0..bf6b70f575b 100644 --- a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/word-blanks.md +++ b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/word-blanks.md @@ -11,13 +11,13 @@ dashedName: word-blanks 給你一些不完整的句子,這些句子會缺少一些例如名詞、動詞、形容詞或者副詞之類的字詞。 然後你需要使用你選擇的詞語去填補這些缺失的地方,使得這個句子變得完整且有意義。 -Consider this sentence: +考慮這句話: ```md It was really ____, and we ____ ourselves ____. ``` -This sentence has three missing pieces- an adjective, a verb and an adverb, and we can add words of our choice to complete it. We can then assign the completed sentence to a variable as follows: +這句話有三個缺失的部分 - 形容詞、動詞和副詞,我們可以選擇合適單詞填入完成它。 然後將完成的句子賦值給變量,如下所示: ```js const sentence = "It was really " + "hot" + ", and we " + "laughed" + " ourselves " + "silly" + "."; @@ -25,21 +25,21 @@ const sentence = "It was really " + "hot" + ", and we " + "laughed" + " ourselve # --instructions-- -In this challenge, we provide you with a noun, a verb, an adjective and an adverb. You need to form a complete sentence using words of your choice, along with the words we provide. +在這個挑戰中,我們爲你提供名詞、動詞、形容詞和副詞。 你需要使用合適單詞以及我們提供的單詞來形成完整的句子。 -You will need to use the string concatenation operator `+` to build a new string, using the provided variables: `myNoun`, `myAdjective`, `myVerb`, and `myAdverb`. You will then assign the formed string to the `wordBlanks` variable. You should not change the words assigned to the variables. +你需要使用字符串連接運算符 `+` 來拼接字符串變量:`myNoun`、`myAdjective`、`myVerb` 和 `myAdverb`,以構建一個新字符串。 然後,將新字符串賦給 `wordBlanks` 變量。 你不應該更改分配給變量的單詞。 -You will also need to account for spaces in your string, so that the final sentence has spaces between all the words. The result should be a complete sentence. +你還需要考慮字符串中的空格,確保句子的所有單詞之間有空格。 結果應該是一個完整的句子。 # --hints-- -`wordBlanks` should be a string. +`wordBlanks` 應該是一個字符串。 ```js assert(typeof wordBlanks === 'string'); ``` -You should not change the values assigned to `myNoun`, `myVerb`, `myAdjective` or `myAdverb`. +你不能改變賦給 `myNoun`、`myVerb`、`myAdjective` 或者 `myAdverb` 的值。 ```js assert( @@ -50,7 +50,7 @@ assert( ); ``` -You should not directly use the values `dog`, `ran`, `big`, or `quickly` to create `wordBlanks`. +你不應該直接使用 `dog`、`ran`、`big` 或 `quickly` 來創建 `wordBlanks`。 ```js const newCode = removeAssignments(code); @@ -62,7 +62,7 @@ assert( ); ``` -`wordBlanks` should contain all of the words assigned to the variables `myNoun`, `myVerb`, `myAdjective` and `myAdverb` separated by non-word characters (and any additional words of your choice). +`wordBlanks` 應該包含分配給變量 `myNoun`、`myVerb`、`myAdjective` 和 `myAdverb` 的所有單詞,用非單詞字符(和你選擇的任何其他單詞)分隔。 ```js assert( diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements.md index 30389f697e7..c230195a386 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements.md @@ -8,11 +8,11 @@ dashedName: add-attributes-to-the-circle-elements # --description-- -The last challenge created the `circle` elements for each point in the `dataset`, and appended them to the SVG. 但是 D3 需要更多關於位置和 `circle` 大小的信息來正確地顯示它們。 +上個挑戰爲 `dataset` 中的每個點都創建了 `circle` 元素,並將它們添加到 SVG 上。 但是 D3 需要更多關於位置和 `circle` 大小的信息來正確地顯示它們。 -在 SVG 中 `circle` 有三個主要的屬性。 `cx` 和 `cy` 屬性是座標。 They tell D3 where to position the *center* of the shape on the SVG. 半徑( `r` 屬性)給出 `circle` 的大小。 +在 SVG 中 `circle` 有三個主要的屬性。 `cx` 和 `cy` 屬性是座標。 它們告訴 D3 將圖形的*中心*放在 SVG 的何處。 半徑( `r` 屬性)給出 `circle` 的大小。 -Just like the `rect` `y` coordinate, the `cy` attribute for a `circle` is measured from the top of the SVG, not from the bottom. +和 `rect` 的 `y` 座標一樣,`circle` 的 `cy` 屬性是從 SVG 畫布的頂端開始測量的,而不是從底端。 所有的屬性都可以用回調函數來動態設值。 記住,所有串聯在 `data(dataset)` 後面的方法會爲 `dataset` 中的每個對象都運行一次。 回調函數中的 `d` 參數指在 `dataset` 中的當前對象,對每個點來說都是一個數組。 你可以使用方括號的方式,如 `d[0]`,來訪問數組中的值。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-axes-to-a-visualization.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-axes-to-a-visualization.md index 0fbe053c333..cf95f1537a2 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-axes-to-a-visualization.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-axes-to-a-visualization.md @@ -16,7 +16,7 @@ D3 有兩種方法來渲染 y 軸和 x 軸,分別是 `axisLeft()` 和 `axisBot const xAxis = d3.axisBottom(xScale); ``` -The next step is to render the axis on the SVG. 爲此,你可以使用一個 SVG 組件, `g` 元素, `g` 是英文中組(group)的縮寫。 不同於 `rect`、`circle`、`text`,在渲染時,軸只是一條直線。 因爲它是一個簡單的圖形,所以可以用 `g` 。 The last step is to apply a `transform` attribute to position the axis on the SVG in the right place. Otherwise, the line would render along the border of the SVG and wouldn't be visible. SVG 支持多種 `transforms`,但是定位軸需要使用 `translate` 屬性。 當它應用在 `g` 元素上時,它根據給出的總量移動整組。 下面是一個例子: +下一步是在 SVG 上渲染 x 軸。 爲此,你可以使用一個 SVG 組件, `g` 元素, `g` 是英文中組(group)的縮寫。 不同於 `rect`、`circle`、`text`,在渲染時,軸只是一條直線。 因爲它是一個簡單的圖形,所以可以用 `g` 。 最後一步是使用 `transform` 屬性將軸放置在 SVG 的正確位置上。 否則,軸將會沿着 SVG 的邊緣渲染,從而不可見。 SVG 支持多種 `transforms`,但是定位軸需要使用 `translate` 屬性。 當它應用在 `g` 元素上時,它根據給出的總量移動整組。 下面是一個例子: ```js const xAxis = d3.axisBottom(xScale); @@ -26,7 +26,7 @@ svg.append("g") .call(xAxis); ``` -The above code places the x-axis at the bottom of the SVG. 然後 x 軸作爲參數被傳遞給 `call()` 方法。 y 軸的定位也是這樣,只是 `translate` 參數的形式是 `(x, 0)`。 因爲 `translate` 是 `attr()` 方法中的一個字符串,你可以在參數中使用字符串的連接將變量值包括進去。 +上部分代碼將 x 軸放置在 SVG 的底端。 然後 x 軸作爲參數被傳遞給 `call()` 方法。 y 軸的定位也是這樣,只是 `translate` 參數的形式是 `(x, 0)`。 因爲 `translate` 是 `attr()` 方法中的一個字符串,你可以在參數中使用字符串的連接將變量值包括進去。 # --instructions-- diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.md index 539f1fdc0b4..1858af511b5 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.md @@ -10,7 +10,7 @@ dashedName: add-labels-to-d3-elements D3 允許你使用 SVG 的 `text` 元素給圖形元素,如條形圖,添加標籤。 -Like the `rect` element, a `text` element needs to have `x` and `y` attributes, to place it on the SVG. 它也需要能夠獲取數據來顯示數據值。 +和 `rect` 元素類似,`text` 元素也需要 `x` 和 `y` 屬性來指定其放置在 SVG 上的位置, 它也需要能夠獲取數據來顯示數據值。 D3 給了你很高的權限給圖形添加標籤。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.md index 51178c78b95..ef5b846bf91 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.md @@ -12,7 +12,7 @@ dashedName: add-labels-to-scatter-plot-circles 目標是顯示 `dataset` 中每個對象的第一個(`x`)和第二個(`y`)字段中通過逗號分隔的值。 -The `text` nodes need `x` and `y` attributes to position it on the SVG. 在這個挑戰中,`y` 值(決定高度)可以用和 `circle` 的 `cy` 屬性相同的值, `x` 值可以比 `circle` 的 `cx` 值稍微大一些,這樣標籤纔可見, 並且被放置在散點的右邊。 +`text` 節點需要 `x` 和 `y` 屬性來指定放置在 SVG 中的位置。 在這個挑戰中,`y` 值(決定高度)可以用和 `circle` 的 `cy` 屬性相同的值, `x` 值可以比 `circle` 的 `cx` 值稍微大一些,這樣標籤纔可見, 並且被放置在散點的右邊。 # --instructions-- diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.md index 2542abcd83f..8e2c74225d0 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.md @@ -1,6 +1,6 @@ --- id: 587d7fab367417b2b2512bda -title: 用 D3 創建線性比例 +title: 用 D3 創建線性比例尺 challengeType: 6 forumTopicId: 301483 dashedName: create-a-linear-scale-with-d3 @@ -8,13 +8,13 @@ dashedName: create-a-linear-scale-with-d3 # --description-- -The bar and scatter plot charts both plotted data directly onto the SVG. 但是,如果一組的高或者其中一個數據點比 SVG 的高或寬更大,它將跑到 SVG 區域外。 +條形圖和散點圖都直接在 SVG 上繪製數據。 但是,如果一組的高或者其中一個數據點比 SVG 的高或寬更大,它將跑到 SVG 區域外。 -D3 中,比例尺可幫助佈局數據。 `scales` are functions that tell the program how to map a set of raw data points onto the pixels of the SVG. +在 D3 中,比例尺可幫助佈局數據。 `scales` 是函數,它告訴程序如何將一組原始數據點映射到 SVG 上。 -For example, say you have a 100x500-sized SVG and you want to plot Gross Domestic Product (GDP) for a number of countries. 這組數據將在十億美元或萬億美元的範圍內。 你給 D3 提供一種縮放方法,告訴它如何將大的 GDP 值放置在 100x500 大小的區域。 +例如,假設你有一個 100x500 大小的 SVG,你想爲許多國家繪製國內生產總值(GDP)的圖表。 這組數據將在十億美元或萬億美元的範圍內。 你給 D3 提供一種比例尺,告訴它如何將大的 GDP 值放置在 100x500 大小的區域。 -你不太可能按數據原本的大小來繪製圖表。 Before plotting it, you set the scale for your entire data set, so that the `x` and `y` values fit your SVG width and height. +你不太可能按數據原本的大小來繪製圖表。 在繪製之前,你可以設置整個數據集的比例尺,以便 `x` 和 `y` 值適合你的 SVG 的寬度和高度。 D3 有幾種縮放類型。 對於線性縮放(通常使用於定量數據),使用 D3 的 `scaleLinear()` 方法: diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.md index 299260f2398..93397778b24 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.md @@ -14,7 +14,7 @@ SVG 用 `circle` 標籤來創建圓形。 它和之前用來構建條形圖的 ` # --instructions-- -Use the `data()`, `enter()`, and `append()` methods to bind `dataset` to new `circle` elements that are appended to the SVG. +使用 `data()`、`enter()`、`append()` 方法將 `dataset` 和添加到 SVG 的新 `circle` 元素綁定起來。 **注意:** 圓形並不可見,因爲我們還沒有設置它們的屬性。 我們會在下一個挑戰中設置屬性。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.md index 8c79f279d5d..0ddc98eed99 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.md @@ -1,6 +1,6 @@ --- id: 587d7fac367417b2b2512bdb -title: 按比例設置域和範圍 +title: 設置比例尺的定義域和值域 challengeType: 6 forumTopicId: 301491 dashedName: set-a-domain-and-a-range-on-a-scale @@ -10,9 +10,9 @@ dashedName: set-a-domain-and-a-range-on-a-scale 默認情況下,比例尺使用一對一關係(identity relationship), 即輸入值直接映射爲輸出值。 但是比例尺可以更靈活更有趣。 -假設有一個數據集範圍爲 50 到 480, 這是縮放的輸入信息,也被稱爲。 +假設有一個數據集值的範圍爲 50 到 480, 這是比例尺的輸入信息,也被稱爲定義域。 -You want to map those points along the `x` axis on the SVG, between 10 units and 500 units. 這是輸出信息,也被稱爲範圍。 +你想沿着 SVG 上的 `x` 軸映射這些點,在 10 單位和 500 單位之間。 這是輸出信息,也被稱爲值域。 `domain()` 和 `range()` 方法設置比例尺的值, 它們都接受一個至少有兩個元素的數組作爲參數。 下面是一個例子: @@ -28,11 +28,11 @@ d3.scaleLinear() 按順序,將在控制檯中顯示以下值:`10`、`500`、`323.37` 和 `807.67`。 -注意,比例尺使用了域和範圍之間的線性關係來找出給定數字的輸出值。 域中的最小值(50)映射爲範圍中的最小值(10)。 +注意,比例尺使用了定義域和值域之間的線性關係來找出給定數字的輸出值。 定義域中的最小值(50)映射爲值域中的最小值(10)。 # --instructions-- -創建一個比例尺,將它的域設置爲 `[250, 500]`,範圍設置爲 `[10, 150]`。 +創建一個比例尺,將它的定義域設置爲 `[250, 500]`,值域設置爲 `[10, 150]`。 **注意:**你可以將 `domain()` 和 `range()` 方法串聯在 `scale` 變量後。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.md index b55f5d545cb..d2811ad9b39 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.md @@ -1,6 +1,6 @@ --- id: 587d7fac367417b2b2512bde -title: 使用預定義的比例放置元素 +title: 使用預定義的比例尺放置元素 challengeType: 6 forumTopicId: 301494 dashedName: use-a-pre-defined-scale-to-place-elements @@ -8,7 +8,7 @@ dashedName: use-a-pre-defined-scale-to-place-elements # --description-- -當比例尺建立好後,是時候重新映射散點圖了。 The scales are like processing functions that turn the `x` and `y` raw data into values that fit and render correctly on the SVG. 它們使數據在屏幕的佈局區域內部。 +當比例尺建立好後,是時候重新映射散點圖了。 比例尺就像操作函數一樣,將 `x` 和 `y` 的原數據值變爲適應 SVG 並可在 SVG 上正確渲染的值。 它們使數據在屏幕的佈局區域內部。 用比例尺函數爲 SVG 圖形設置座標屬性值。 這包括 `rect` 或者 `text` 元素的 `x` 和 `y` 屬性,或者 `circles` 的 `cx` 和 `cy`。 以下是一個例子: @@ -17,11 +17,11 @@ shape .attr("x", (d) => xScale(d[0])) ``` -Scales set shape coordinate attributes to place the data points onto the SVG. 當你顯示實際數據值時,不用使用比例尺,例如,在提示框或標籤中的 `text()` 方法。 +比例尺設置圖形座標屬性來將數據點放置在 SVG 上。 當你顯示實際數據值時,不用使用比例尺,例如,在提示框或標籤中的 `text()` 方法。 # --instructions-- -Use `xScale` and `yScale` to position both the `circle` and `text` shapes onto the SVG. 對於 `circles`,使用比例尺設置 `cx` 和 `cy` 屬性, 半徑爲 `5` 個單位。 +使用 `xScale` 和 `yScale` 將 `circle` 和 `text` 圖形放置在 SVG 上。 對於 `circles`,使用比例尺設置 `cx` 和 `cy` 屬性, 半徑爲 `5` 個單位。 對於 `text` 元素,使用比例尺設置 `x` 和 `y` 屬性。 標籤應該標註在點的右邊, 爲此,在將 `x` 數據值傳遞給 `xScale` 之前,要給它加上 `10` 個單位。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.md index fc3df69ccd5..18e11bfbc5b 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.md @@ -1,6 +1,6 @@ --- id: 587d7fac367417b2b2512bdd -title: 使用動態比例 +title: 使用動態比例尺 challengeType: 6 forumTopicId: 301495 dashedName: use-dynamic-scales @@ -10,11 +10,11 @@ dashedName: use-dynamic-scales D3 的 `min()` 和 `max()` 方法在設置比例尺時十分有用。 -對於一個複雜的數據集,首要是設置比例尺,這樣可視化才能適合 SVG 容器的寬和高。 You want all the data plotted inside the SVG so it's visible on the web page. +對於一個複雜的數據集,首要是設置比例尺,這樣可視化才能適合 SVG 容器的寬和高。 所有數據都應佈局在 SVG 內部,這樣它們在頁面上纔是可見的。 下面這個例子爲散點圖設置了 x 軸的比例尺。 `domain()` 方法給比例尺傳遞關於散點圖原數據值的信息, `range()` 方法給出在頁面上進行可視化的實際空間信息。 -在這個例子中,domain 是從 0 到數據集中的最大值, 它使用 `max()` 方法和基於數組中 x 值的回調函數。 The range uses the SVG's width (`w`), but it includes some padding, too. This puts space between the scatter plot dots and the edge of the SVG. +在這個例子中,定義域是從 0 到數據集中的最大值, 它使用 `max()` 方法和基於數組中 x 值的回調函數。 值域使用 SVG 畫布的寬(`w`),幷包含 padding, 這將在散點圖和 SVG 邊緣之間添加空隙。 ```js const dataset = [ @@ -38,7 +38,7 @@ const xScale = d3.scaleLinear() .range([padding, w - padding]); ``` -在一開始可能很難理解 padding。 Picture the x-axis as a horizontal line from 0 to 500 (the width value for the SVG). 在 `range()` 方法中包含 padding 使散點圖沿着這條直線從 30 (而不是 0)開始,在 470 (而不是 500)結束。 +在一開始可能很難理解 padding。 想象 x 軸是一條從 0 到 500 (SVG 寬的值)的水平直線。 在 `range()` 方法中包含 padding 使散點圖沿着這條直線從 30 (而不是 0)開始,在 470 (而不是 500)結束。 # --instructions-- diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method.md b/curriculum/challenges/chinese-traditional/04-data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method.md index 00255ee50e1..cfaa85d7667 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method.md @@ -10,7 +10,7 @@ dashedName: post-data-with-the-javascript-xmlhttprequest-method 在前面的示例中,你通過外部資源獲取數據。 此外,你也可以將數據發送到外部資源,只要該資源支持 AJAX 請求並且你知道 URL。 -JavaScript 的`XMLHttpRequest`方法也用於將數據發佈到服務器。 這是一個示例: +JavaScript 的 `XMLHttpRequest` 方法也用於將數據發佈到服務器。 這是一個示例: ```js const xhr = new XMLHttpRequest(); @@ -26,33 +26,33 @@ const body = JSON.stringify({ userName: userName, suffix: ' loves cats!' }); xhr.send(body); ``` -你之前已經見過這些方法。 Here the `open` method initializes the request as a `POST` to the given URL of the external resource, and passes `true` as the third parameter - indicating to perform the operation asynchronously. +你之前已經見過這些方法。 在這裏,`open` 方法將請求初始化爲對外部資源的給定 URL 的 `POST`,並傳遞 `true` 作爲第三個參數——表示以異步方式執行該操作。 -The `setRequestHeader` method sets the value of an HTTP request header, which contains information about the sender and the request. It must be called after the `open` method, but before the `send` method. The two parameters are the name of the header and the value to set as the body of that header. +`setRequestHeader` 方法設置了 HTTP 請求標頭的值,包含有關發送人和請求的信息。 它必須在 `open` 方法之後、`send` 方法之前調用。 這兩個參數是標頭的名稱和要設置爲該標頭正文的值。 -Next, the `onreadystatechange` event listener handles a change in the state of the request. A `readyState` of `4` means the operation is complete, and a `status` of `201` means it was a successful request. Therefore, the document's HTML can be updated. +接下來,`onreadystatechange` 事件監聽器監聽請求狀態的更改。 `readyState` 爲 `4`,表示操作已完成。`status` 爲 `201`,表示請求成功。 因此,文檔的 HTML 可以更新。 -Finally, the `send` method sends the request with the `body` value. The `body` consists of a `userName` and a `suffix` key. +最後, `send` 方法發送帶有 `body` 值的請求。 `body` 包含一個 `userName` 和一個 `suffix` 鍵。 # --instructions-- -Update the code so it makes a `POST` request to the API endpoint. Then type your name in the input field and click `Send Message`. Your AJAX function should replace `Reply from Server will be here.` with data from the server. Format the response to display your name appended with the text `loves cats`. +更新代碼,向 API 端點發送 `POST` 請求。 然後在輸入框中輸入你的姓名,並點擊 `Send Message`。 你的 AJAX 函數會用服務器返回的數據替換 `Reply from Server will be here.`。 修改返回的請求結果,在你的名字後面添加 `loves cats`。 # --hints-- -Your code should create a new `XMLHttpRequest`. +你的代碼應該創建一個新的 `XMLHttpRequest`。 ```js assert(code.match(/new\s+?XMLHttpRequest\(\s*?\)/g)); ``` -Your code should use the `open` method to initialize a `POST` request to the server. +你的代碼應該使用 `open` 方法初始化一個發送給服務器的 `POST` 請求。 ```js assert(code.match(/\.open\(\s*?('|")POST\1\s*?,\s*?url\s*?,\s*?true\s*?\)/g)); ``` -Your code should use the `setRequestHeader` method. +你的代碼應該使用 `setRequestHeader` 方法。 ```js assert( @@ -62,13 +62,13 @@ assert( ); ``` -Your code should have an `onreadystatechange` event handler set to a function. +你的代碼應該有一個設置爲函數的 `onreadystatechange` 事件處理程序。 ```js assert(code.match(/\.onreadystatechange\s*?=/g)); ``` -Your code should get the element with class `message` and change its `textContent` to `userName loves cats` +你的代碼應該獲取 class 爲 `message` 的元素,並將它的 `textContent` 更改爲 `userName loves cats`。 ```js assert( @@ -78,7 +78,7 @@ assert( ); ``` -Your code should use the `send` method. +你的代碼應該使用 `send` 方法。 ```js assert(code.match(/\.send\(\s*?body\s*?\)/g)); diff --git a/curriculum/challenges/chinese-traditional/05-back-end-development-and-apis/mongodb-and-mongoose/install-and-set-up-mongoose.md b/curriculum/challenges/chinese-traditional/05-back-end-development-and-apis/mongodb-and-mongoose/install-and-set-up-mongoose.md index a675c00d9f8..ea9dc766dc0 100644 --- a/curriculum/challenges/chinese-traditional/05-back-end-development-and-apis/mongodb-and-mongoose/install-and-set-up-mongoose.md +++ b/curriculum/challenges/chinese-traditional/05-back-end-development-and-apis/mongodb-and-mongoose/install-and-set-up-mongoose.md @@ -32,7 +32,7 @@ dashedName: install-and-set-up-mongoose **注意:**如果你使用的是 Replit,則無法創建 `.env` 文件。 相反,使用內置的 SECRETS 選項卡來添加變量。 在使用 SECRETS 選項卡時,不要將值括在引號中。 -When you are done, connect to the database by calling the `connect` method within your `myApp.js` file by using the following syntax: +完成後,使用以下語法在你的 `myApp.js` 文件中調用 `connect` 方法,連接到數據庫: ```js mongoose.connect(, { useNewUrlParser: true, useUnifiedTopology: true }); diff --git a/curriculum/challenges/chinese-traditional/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http.md b/curriculum/challenges/chinese-traditional/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http.md index 09c519a4d6d..d4778338b2f 100644 --- a/curriculum/challenges/chinese-traditional/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http.md +++ b/curriculum/challenges/chinese-traditional/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http.md @@ -36,19 +36,19 @@ suite('GET /hello?name=[name] => "hello [name]"', function () { 同時,請注意測試的回調函數中的 `done` 參數。 在測試結束時,調用它且不帶參數,是發出異步操作完成所必需的信號。 -Finally, note the `keepOpen` method just after the `request` method. Normally you would run your tests from the command line, or as part of an automated integration process, and you could let `chai-http` start and stop your server automatically. +最後,請注意 `request` 方法後面的 `keepOpen` 方法。 通常,你會從命令行中運行你的測試,或者作爲自動集成過程的一部分,你可以讓 `chai-http` 自動啓動和停止你的服務器。 -However, the tests that run when you submit the link to your project require your server to be up, so you need to use the `keepOpen` method to prevent `chai-http` from stopping your server. +然而,當你提交項目鏈接時運行的測試需要你的服務器是正常的,所以你需要使用 `keepOpen` 方法來防止 `chai-http` 停止你的服務器。 # --instructions-- -Within `tests/2_functional-tests.js`, alter the `'Test GET /hello with no name'` test (`// #1`) to assert the `status` and the `text` of the response to make the test pass. Do not alter the arguments passed to the asserts. +在 `tests/2_functional-tests.js` 中,修改 `'Test GET /hello with no name'` 測試(`// #1`),對響應的 `status` 和 `text` 使用斷言來通過測試。 不要改變傳遞給斷言的參數。 -There should be no URL query. Without a name URL query, the endpoint responds with `hello Guest`. +不應該有任何 URL 查詢。 如果沒有名稱 URL 查詢,端點將使用 `hello Guest` 進行響應。 # --hints-- -All tests should pass +應通過所有測試。 ```js (getUserInput) => @@ -62,7 +62,7 @@ All tests should pass ); ``` -You should test for `res.status` == 200 +你應該測試 `res.status` == 200。 ```js (getUserInput) => @@ -78,7 +78,7 @@ You should test for `res.status` == 200 ); ``` -You should test for `res.text` == `'hello Guest'` +你應該測試 `res.text` == `'hello Guest'`。 ```js (getUserInput) => diff --git a/curriculum/challenges/chinese-traditional/09-information-security/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard.md b/curriculum/challenges/chinese-traditional/09-information-security/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard.md index 351e6e0b7f4..cfdd723ecf8 100644 --- a/curriculum/challenges/chinese-traditional/09-information-security/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard.md +++ b/curriculum/challenges/chinese-traditional/09-information-security/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard.md @@ -10,7 +10,7 @@ dashedName: mitigate-the-risk-of-clickjacking-with-helmet-frameguard 請注意,本項目是在 Replit 上的初始化項目的基礎上進行開發,你也可以從 GitHub 上克隆。 -你的網頁可能在未經你同意的情況下被放在 `` 或 `