gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(i18n): chinese test suite (#38220)

Browse Source 
* fix: Chinese test suite

Add localeTiltes, descriptions, and adjust test text and testStrings to get the automated test suite working.

* fix: ran script, updated testStrings and solutions
This commit is contained in:
Kristofer Koishigawa
2020-02-18 01:40:55 +09:00
committed by Mrugesh Mohapatra
parent 6a7a7e6d7d
commit b3213fc892
1264 changed files with 5635 additions and 4331 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element.chinese.md
View File

@ -18,7 +18,7 @@ localeTitle: 将悬停效果添加到D3元素
```yml
tests:
- text: 你的<code>rect</code>元素应该有一类<code>bar</code> 。
testString: 'assert($("rect").attr("class") == "bar", "Your <code>rect</code> elements should have a class of <code>bar</code>.");'
testString: assert($('rect').attr('class') == "bar");
```

20
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.chinese.md
View File

@ -18,25 +18,25 @@ localeTitle: 将工具提示添加到D3元素
```yml
tests:
- text: 您的代码应该有9个<code>title</code>元素。
testString: 'assert($("title").length == 9, "Your code should have 9 <code>title</code> elements.");'
testString: assert($('title').length == 9);
- text: 第一个<code>title</code>元素的工具提示文本应为12。
testString: 'assert($("title").eq(0).text() == "12", "The first <code>title</code> element should have tooltip text of 12.");'
testString: assert($('title').eq(0).text() == '12');
- text: 第二个<code>title</code>元素的工具提示文本应为31。
testString: 'assert($("title").eq(1).text() == "31", "The second <code>title</code> element should have tooltip text of 31.");'
testString: assert($('title').eq(1).text() == '31');
- text: 第三个<code>title</code>元素的工具提示文本应为22。
testString: 'assert($("title").eq(2).text() == "22", "The third <code>title</code> element should have tooltip text of 22.");'
testString: assert($('title').eq(2).text() == '22');
- text: 第四个<code>title</code>元素的工具提示文本应为17。
testString: 'assert($("title").eq(3).text() == "17", "The fourth <code>title</code> element should have tooltip text of 17.");'
testString: assert($('title').eq(3).text() == '17');
- text: 第五个<code>title</code>元素的工具提示文本应为25。
testString: 'assert($("title").eq(4).text() == "25", "The fifth <code>title</code> element should have tooltip text of 25.");'
testString: assert($('title').eq(4).text() == '25');
- text: 第六个<code>title</code>元素的工具提示文本应为18。
testString: 'assert($("title").eq(5).text() == "18", "The sixth <code>title</code> element should have tooltip text of 18.");'
testString: assert($('title').eq(5).text() == '18');
- text: 第七个<code>title</code>元素的工具提示文本应为29。
testString: 'assert($("title").eq(6).text() == "29", "The seventh <code>title</code> element should have tooltip text of 29.");'
testString: assert($('title').eq(6).text() == '29');
- text: 第八个<code>title</code>元素的工具提示文本应为14。
testString: 'assert($("title").eq(7).text() == "14", "The eighth <code>title</code> element should have tooltip text of 14.");'
testString: assert($('title').eq(7).text() == '14');
- text: 第九个<code>title</code>元素的工具提示文本应为9。
testString: 'assert($("title").eq(8).text() == "9", "The ninth <code>title</code> element should have tooltip text of 9.");'
testString: assert($('title').eq(8).text() == '9');
```

22
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements.chinese.md
View File

@ -18,27 +18,27 @@ localeTitle: 将属性添加到圆形元素
```yml
tests:
- text: 您的代码应该有10个<code>circle</code>元素。
testString: 'assert($("circle").length == 10, "Your code should have 10 <code>circle</code> elements.");'
testString: assert($('circle').length == 10);
- text: 第一个<code>circle</code>元素的<code>cx</code>值应为34， <code>cy</code>值为422， <code>r</code>值为5。
testString: 'assert($("circle").eq(0).attr("cx") == "34" && $("circle").eq(0).attr("cy") == "422" && $("circle").eq(0).attr("r") == "5", "The first <code>circle</code> element should have a <code>cx</code> value of 34, a <code>cy</code> value of 422, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(0).attr('cx') == '34' && $('circle').eq(0).attr('cy') == '422' && $('circle').eq(0).attr('r') == '5');
- text: 第二个<code>circle</code>元素的<code>cx</code>值应为109， <code>cy</code>值为220， <code>r</code>值为5。
testString: 'assert($("circle").eq(1).attr("cx") == "109" && $("circle").eq(1).attr("cy") == "220" && $("circle").eq(1).attr("r") == "5", "The second <code>circle</code> element should have a <code>cx</code> value of 109, a <code>cy</code> value of 220, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(1).attr('cx') == '109' && $('circle').eq(1).attr('cy') == '220' && $('circle').eq(1).attr('r') == '5');
- text: 第三个<code>circle</code>元素的<code>cx</code>值应为310， <code>cy</code>值为380， <code>r</code>值为5。
testString: 'assert($("circle").eq(2).attr("cx") == "310" && $("circle").eq(2).attr("cy") == "380" && $("circle").eq(2).attr("r") == "5", "The third <code>circle</code> element should have a <code>cx</code> value of 310, a <code>cy</code> value of 380, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(2).attr('cx') == '310' && $('circle').eq(2).attr('cy') == '380' && $('circle').eq(2).attr('r') == '5');
- text: 第四个<code>circle</code>元素的<code>cx</code>值应为79， <code>cy</code>值为89， <code>r</code>值为5。
testString: 'assert($("circle").eq(3).attr("cx") == "79" && $("circle").eq(3).attr("cy") == "89" && $("circle").eq(3).attr("r") == "5", "The fourth <code>circle</code> element should have a <code>cx</code> value of 79, a <code>cy</code> value of 89, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(3).attr('cx') == '79' && $('circle').eq(3).attr('cy') == '89' && $('circle').eq(3).attr('r') == '5');
- text: 第五个<code>circle</code>元素的<code>cx</code>值应为420， <code>cy</code>值为280， <code>r</code>值为5。
testString: 'assert($("circle").eq(4).attr("cx") == "420" && $("circle").eq(4).attr("cy") == "280" && $("circle").eq(4).attr("r") == "5", "The fifth <code>circle</code> element should have a <code>cx</code> value of 420, a <code>cy</code> value of 280, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(4).attr('cx') == '420' && $('circle').eq(4).attr('cy') == '280' && $('circle').eq(4).attr('r') == '5');
- text: 第六个<code>circle</code>元素的<code>cx</code>值应为233， <code>cy</code>值为355， <code>r</code>值为5。
testString: 'assert($("circle").eq(5).attr("cx") == "233" && $("circle").eq(5).attr("cy") == "355" && $("circle").eq(5).attr("r") == "5", "The sixth <code>circle</code> element should have a <code>cx</code> value of 233, a <code>cy</code> value of 355, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(5).attr('cx') == '233' && $('circle').eq(5).attr('cy') == '355' && $('circle').eq(5).attr('r') == '5');
- text: 第七个<code>circle</code>元素的<code>cx</code>值应为333， <code>cy</code>值为404， <code>r</code>值为5。
testString: 'assert($("circle").eq(6).attr("cx") == "333" && $("circle").eq(6).attr("cy") == "404" && $("circle").eq(6).attr("r") == "5", "The seventh <code>circle</code> element should have a <code>cx</code> value of 333, a <code>cy</code> value of 404, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(6).attr('cx') == '333' && $('circle').eq(6).attr('cy') == '404' && $('circle').eq(6).attr('r') == '5');
- text: 第八个<code>circle</code>元素的<code>cx</code>值应为222， <code>cy</code>值为167， <code>r</code>值为5。
testString: 'assert($("circle").eq(7).attr("cx") == "222" && $("circle").eq(7).attr("cy") == "167" && $("circle").eq(7).attr("r") == "5", "The eighth <code>circle</code> element should have a <code>cx</code> value of 222, a <code>cy</code> value of 167, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(7).attr('cx') == '222' && $('circle').eq(7).attr('cy') == '167' && $('circle').eq(7).attr('r') == '5');
- text: 第九个<code>circle</code>元素的<code>cx</code>值应为78， <code>cy</code>值为180， <code>r</code>值为5。
testString: 'assert($("circle").eq(8).attr("cx") == "78" && $("circle").eq(8).attr("cy") == "180" && $("circle").eq(8).attr("r") == "5", "The ninth <code>circle</code> element should have a <code>cx</code> value of 78, a <code>cy</code> value of 180, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(8).attr('cx') == '78' && $('circle').eq(8).attr('cy') == '180' && $('circle').eq(8).attr('r') == '5');
- text: 第十个<code>circle</code>元素的<code>cx</code>值应为21， <code>cy</code>值为377， <code>r</code>值为5。
testString: 'assert($("circle").eq(9).attr("cx") == "21" && $("circle").eq(9).attr("cy") == "377" && $("circle").eq(9).attr("r") == "5", "The tenth <code>circle</code> element should have a <code>cx</code> value of 21, a <code>cy</code> value of 377, and an <code>r</code> value of 5.");'
testString: assert($('circle').eq(9).attr('cx') == '21' && $('circle').eq(9).attr('cy') == '377' && $('circle').eq(9).attr('r') == '5');
```

6
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-axes-to-a-visualization.chinese.md
View File

@ -18,11 +18,11 @@ localeTitle: 将轴添加到可视化
```yml
tests:
- text: 您的代码应使用<code>axisLeft()</code>方法， <code>yScale</code>作为参数传递。
testString: 'assert(code.match(/\.axisLeft\(yScale\)/g), "Your code should use the <code>axisLeft()</code> method with <code>yScale</code> passed as the argument.");'
testString: assert(code.match(/\.axisLeft\(yScale\)/g));
- text: 'y轴<code>g</code>元素应具有<code>transform</code>属性以将轴平移（60,0）。'
testString: 'assert($("g").eq(1).attr("transform").match(/translate\(60\s*?,\s*?0\)/g), "The y-axis <code>g</code> element should have a <code>transform</code> attribute to translate the axis by (60, 0).");'
testString: assert($('g').eq(10).attr('transform').match(/translate\(60\s*?,\s*?0\)/g));
- text: 您的代码应该调用<code>yAxis</code> 。
testString: 'assert(code.match(/\.call\(yAxis\)/g), "Your code should call the <code>yAxis</code>.");'
testString: assert(code.match(/\.call\(\s*yAxis\s*\)/g));
```

4
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-classes-with-d3.chinese.md
View File

@ -18,9 +18,9 @@ localeTitle: 使用D3添加类
```yml
tests:
- text: 你的<code>div</code>元素应该有一类<code>bar</code> 。
testString: 'assert($("div").attr("class") == "bar", "Your <code>div</code> elements should have a class of <code>bar</code>.");'
testString: assert($('div').attr('class') == "bar");
- text: 您的代码应使用<code>attr()</code>方法。
testString: 'assert(code.match(/\.attr/g), "Your code should use the <code>attr()</code> method.");'
testString: assert(code.match(/\.attr/g));
```

12
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-document-elements-with-d3.chinese.md
View File

@ -18,17 +18,17 @@ localeTitle: 使用D3添加文档元素
```yml
tests:
- text: <code>body</code>应该有一个<code>h1</code>元素。
testString: 'assert($("body").children("h1").length == 1, "The <code>body</code> should have one <code>h1</code> element.");'
testString: assert($('body').children('h1').length == 1);
- text: <code>h1</code>元素应该包含文本“Learning D3”。
testString: 'assert($("h1").text() == "Learning D3", "The <code>h1</code> element should have the text "Learning D3" in it.");'
testString: assert($('h1').text() == "Learning D3");
- text: 您的代码应该访问<code>d3</code>对象。
testString: 'assert(code.match(/d3/g), "Your code should access the <code>d3</code> object.");'
testString: assert(code.match(/d3/g));
- text: 您的代码应该使用<code>select</code>方法。
testString: 'assert(code.match(/\.select/g), "Your code should use the <code>select</code> method.");'
testString: assert(code.match(/\.select/g));
- text: 您的代码应该使用<code>append</code>方法。
testString: 'assert(code.match(/\.append/g), "Your code should use the <code>append</code> method.");'
testString: assert(code.match(/\.append/g));
- text: 您的代码应该使用<code>text</code>方法。
testString: 'assert(code.match(/\.text/g), "Your code should use the <code>text</code> method.");'
testString: assert(code.match(/\.text/g));
```

4
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-inline-styling-to-elements.chinese.md
View File

@ -18,9 +18,9 @@ localeTitle: 向元素添加内联样式
```yml
tests:
- text: 你的<code>h2</code>元素应该有verdana的<code>font-family</code> 。
testString: 'assert($("h2").css("font-family") == "verdana", "Your <code>h2</code> elements should have a <code>font-family</code> of verdana.");'
testString: assert($('h2').css('font-family') == 'verdana');
- text: 您的代码应使用<code>style()</code>方法。
testString: 'assert(code.match(/\.style/g), "Your code should use the <code>style()</code> method.");'
testString: assert(code.match(/\.style/g));
```

18
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.chinese.md
View File

@ -18,23 +18,23 @@ localeTitle: 将标签添加到D3元素
```yml
tests:
- text: 第一个<code>text</code>元素的标签应为12， <code>y</code>值应为61。
testString: 'assert($("text").eq(0).text() == "12" && $("text").eq(0).attr("y") == "61", "The first <code>text</code> element should have a label of 12 and a <code>y</code> value of 61.");'
testString: assert($('text').eq(0).text() == '12' && $('text').eq(0).attr('y') == '61');
- text: 第二个<code>text</code>元素的标签应为31， <code>y</code>值应为4。
testString: 'assert($("text").eq(1).text() == "31" && $("text").eq(1).attr("y") == "4", "The second <code>text</code> element should have a label of 31 and a <code>y</code> value of 4.");'
testString: assert($('text').eq(1).text() == '31' && $('text').eq(1).attr('y') == '4');
- text: 第三个<code>text</code>元素的标签应为22， <code>y</code>值应为31。
testString: 'assert($("text").eq(2).text() == "22" && $("text").eq(2).attr("y") == "31", "The third <code>text</code> element should have a label of 22 and a <code>y</code> value of 31.");'
testString: assert($('text').eq(2).text() == '22' && $('text').eq(2).attr('y') == '31');
- text: 第四个<code>text</code>元素的标签应为17， <code>y</code>值应为46。
testString: 'assert($("text").eq(3).text() == "17" && $("text").eq(3).attr("y") == "46", "The fourth <code>text</code> element should have a label of 17 and a <code>y</code> value of 46.");'
testString: assert($('text').eq(3).text() == '17' && $('text').eq(3).attr('y') == '46');
- text: 第五个<code>text</code>元素的标签应为25， <code>y</code>值应为22。
testString: 'assert($("text").eq(4).text() == "25" && $("text").eq(4).attr("y") == "22", "The fifth <code>text</code> element should have a label of 25 and a <code>y</code> value of 22.");'
testString: assert($('text').eq(4).text() == '25' && $('text').eq(4).attr('y') == '22');
- text: 第六个<code>text</code>元素的标签应为18， <code>y</code>值应为43。
testString: 'assert($("text").eq(5).text() == "18" && $("text").eq(5).attr("y") == "43", "The sixth <code>text</code> element should have a label of 18 and a <code>y</code> value of 43.");'
testString: assert($('text').eq(5).text() == '18' && $('text').eq(5).attr('y') == '43');
- text: 第七个<code>text</code>元素的标签应为29， <code>y</code>值应为10。
testString: 'assert($("text").eq(6).text() == "29" && $("text").eq(6).attr("y") == "10", "The seventh <code>text</code> element should have a label of 29 and a <code>y</code> value of 10.");'
testString: assert($('text').eq(6).text() == '29' && $('text').eq(6).attr('y') == '10');
- text: 第八个<code>text</code>元素的标签应为14， <code>y</code>值应为55。
testString: 'assert($("text").eq(7).text() == "14" && $("text").eq(7).attr("y") == "55", "The eighth <code>text</code> element should have a label of 14 and a <code>y</code> value of 55.");'
testString: assert($('text').eq(7).text() == '14' && $('text').eq(7).attr('y') == '55');
- text: 第九个<code>text</code>元素的标签应为9， <code>y</code>值应为70。
testString: 'assert($("text").eq(8).text() == "9" && $("text").eq(8).attr("y") == "70", "The ninth <code>text</code> element should have a label of 9 and a <code>y</code> value of 70.");'
testString: assert($('text').eq(8).text() == '9' && $('text').eq(8).attr('y') == '70');
```

22
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.chinese.md
View File

@ -18,27 +18,27 @@ localeTitle: 添加标签以分散绘图圆圈
```yml
tests:
- text: 您的代码应该有10个<code>text</code>元素。
testString: 'assert($("text").length == 10, "Your code should have 10 <code>text</code> elements.");'
testString: assert($('text').length == 10);
- text: '第一个标签的文本应为“34,78”， <code>x</code>值为39， <code>y</code>值为422。'
testString: 'assert($("text").eq(0).text() == "34, 78" && $("text").eq(0).attr("x") == "39" && $("text").eq(0).attr("y") == "422", "The first label should have text of "34, 78", an <code>x</code> value of 39, and a <code>y</code> value of 422.");'
testString: assert($('text').eq(0).text() == '34, 78' && $('text').eq(0).attr('x') == '39' && $('text').eq(0).attr('y') == '422');
- text: '第二个标签的文本应为“109,280”， <code>x</code>值为114， <code>y</code>值为220。'
testString: 'assert($("text").eq(1).text() == "109, 280" && $("text").eq(1).attr("x") == "114" && $("text").eq(1).attr("y") == "220", "The second label should have text of "109, 280", an <code>x</code> value of 114, and a <code>y</code> value of 220.");'
testString: assert($('text').eq(1).text() == '109, 280' && $('text').eq(1).attr('x') == '114' && $('text').eq(1).attr('y') == '220');
- text: '第三个标签的文本应为“310,120”， <code>x</code>值为315， <code>y</code>值为380。'
testString: 'assert($("text").eq(2).text() == "310, 120" && $("text").eq(2).attr("x") == "315" && $("text").eq(2).attr("y") == "380", "The third label should have text of "310, 120", an <code>x</code> value of 315, and a <code>y</code> value of 380.");'
testString: assert($('text').eq(2).text() == '310, 120' && $('text').eq(2).attr('x') == '315' && $('text').eq(2).attr('y') == '380');
- text: '第四个标签的文本应为“79,411”， <code>x</code>值为84， <code>y</code>值为89。'
testString: 'assert($("text").eq(3).text() == "79, 411" && $("text").eq(3).attr("x") == "84" && $("text").eq(3).attr("y") == "89", "The fourth label should have text of "79, 411", an <code>x</code> value of 84, and a <code>y</code> value of 89.");'
testString: assert($('text').eq(3).text() == '79, 411' && $('text').eq(3).attr('x') == '84' && $('text').eq(3).attr('y') == '89');
- text: '第五个标签的文本应为“420,220”， <code>x</code>值为425， <code>y</code>值为280。'
testString: 'assert($("text").eq(4).text() == "420, 220" && $("text").eq(4).attr("x") == "425" && $("text").eq(4).attr("y") == "280", "The fifth label should have text of "420, 220", an <code>x</code> value of 425, and a <code>y</code> value of 280.");'
testString: assert($('text').eq(4).text() == '420, 220' && $('text').eq(4).attr('x') == '425' && $('text').eq(4).attr('y') == '280');
- text: '第六个标签的文本应为“233,145”， <code>x</code>值为238， <code>y</code>值为355。'
testString: 'assert($("text").eq(5).text() == "233, 145" && $("text").eq(5).attr("x") == "238" && $("text").eq(5).attr("y") == "355", "The sixth label should have text of "233, 145", an <code>x</code> value of 238, and a <code>y</code> value of 355.");'
testString: assert($('text').eq(5).text() == '233, 145' && $('text').eq(5).attr('x') == '238' && $('text').eq(5).attr('y') == '355');
- text: '第七个标签的文本应为“333,96”， <code>x</code>值为338， <code>y</code>值为404。'
testString: 'assert($("text").eq(6).text() == "333, 96" && $("text").eq(6).attr("x") == "338" && $("text").eq(6).attr("y") == "404", "The seventh label should have text of "333, 96", an <code>x</code> value of 338, and a <code>y</code> value of 404.");'
testString: assert($('text').eq(6).text() == '333, 96' && $('text').eq(6).attr('x') == '338' && $('text').eq(6).attr('y') == '404');
- text: '第八个标签的文本应为“222,333”， <code>x</code>值为227， <code>y</code>值为167。'
testString: 'assert($("text").eq(7).text() == "222, 333" && $("text").eq(7).attr("x") == "227" && $("text").eq(7).attr("y") == "167", "The eighth label should have text of "222, 333", an <code>x</code> value of 227, and a <code>y</code> value of 167.");'
testString: assert($('text').eq(7).text() == '222, 333' && $('text').eq(7).attr('x') == '227' && $('text').eq(7).attr('y') == '167');
- text: '第九个标签的文本应为“78,320”， <code>x</code>值为83， <code>y</code>值为180。'
testString: 'assert($("text").eq(8).text() == "78, 320" && $("text").eq(8).attr("x") == "83" && $("text").eq(8).attr("y") == "180", "The ninth label should have text of "78, 320", an <code>x</code> value of 83, and a <code>y</code> value of 180.");'
testString: assert($('text').eq(8).text() == '78, 320' && $('text').eq(8).attr('x') == '83' && $('text').eq(8).attr('y') == '180');
- text: '第十个标签的文本应为“21,123”， <code>x</code>值为26， <code>y</code>值为377。'
testString: 'assert($("text").eq(9).text() == "21, 123" && $("text").eq(9).attr("x") == "26" && $("text").eq(9).attr("y") == "377", "The tenth label should have text of "21, 123", an <code>x</code> value of 26, and a <code>y</code> value of 377.");'
testString: assert($('text').eq(9).text() == '21, 123' && $('text').eq(9).attr('x') == '26' && $('text').eq(9).attr('y') == '377');
```

18
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.chinese.md
View File

@ -18,23 +18,23 @@ localeTitle: 根据数据更改样式
```yml
tests:
- text: 第一<code>h2</code>应该有一个<code>color</code>的红色。
testString: 'assert($("h2").eq(0).css("color") == "rgb(255, 0, 0)", "The first <code>h2</code> should have a <code>color</code> of red.");'
testString: assert($('h2').eq(0).css('color') == "rgb(255, 0, 0)");
- text: 第二<code>h2</code>应该有一个<code>color</code>的绿色。
testString: 'assert($("h2").eq(1).css("color") == "rgb(0, 128, 0)", "The second <code>h2</code> should have a <code>color</code> of green.");'
testString: assert($('h2').eq(1).css('color') == "rgb(0, 128, 0)");
- text: 第三<code>h2</code>应该有一个<code>color</code>的绿色。
testString: 'assert($("h2").eq(2).css("color") == "rgb(0, 128, 0)", "The third <code>h2</code> should have a <code>color</code> of green.");'
testString: assert($('h2').eq(2).css('color') == "rgb(0, 128, 0)");
- text: 第四<code>h2</code>应该有一个<code>color</code>的红色。
testString: 'assert($("h2").eq(3).css("color") == "rgb(255, 0, 0)", "The fourth <code>h2</code> should have a <code>color</code> of red.");'
testString: assert($('h2').eq(3).css('color') == "rgb(255, 0, 0)");
- text: 第五<code>h2</code>应该有一个<code>color</code>的绿色。
testString: 'assert($("h2").eq(4).css("color") == "rgb(0, 128, 0)", "The fifth <code>h2</code> should have a <code>color</code> of green.");'
testString: assert($('h2').eq(4).css('color') == "rgb(0, 128, 0)");
- text: 第六<code>h2</code>应该有一个<code>color</code>的红色。
testString: 'assert($("h2").eq(5).css("color") == "rgb(255, 0, 0)", "The sixth <code>h2</code> should have a <code>color</code> of red.");'
testString: assert($('h2').eq(5).css('color') == "rgb(255, 0, 0)");
- text: 第七<code>h2</code>应该有一个<code>color</code>的绿色。
testString: 'assert($("h2").eq(6).css("color") == "rgb(0, 128, 0)", "The seventh <code>h2</code> should have a <code>color</code> of green.");'
testString: assert($('h2').eq(6).css('color') == "rgb(0, 128, 0)");
- text: 第八<code>h2</code>应该有一个<code>color</code>的红色。
testString: 'assert($("h2").eq(7).css("color") == "rgb(255, 0, 0)", "The eighth <code>h2</code> should have a <code>color</code> of red.");'
testString: assert($('h2').eq(7).css('color') == "rgb(255, 0, 0)");
- text: 第九<code>h2</code>应该有一个<code>color</code>的红色。
testString: 'assert($("h2").eq(8).css("color") == "rgb(255, 0, 0)", "The ninth <code>h2</code> should have a <code>color</code> of red.");'
testString: assert($('h2').eq(8).css('color') == "rgb(255, 0, 0)");
```

2
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element.chinese.md
View File

@ -18,7 +18,7 @@ localeTitle: 更改SVG元素的颜色
```yml
tests:
- text: 这些酒吧都应该有海军蓝的<code>fill</code>颜色。
testString: 'assert($("rect").css("fill") == "rgb(0, 0, 128)", "The bars should all have a <code>fill</code> color of navy.");'
testString: assert($('rect').css('fill') == "rgb(0, 0, 128)");
```

18
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart.chinese.md
View File

@ -18,23 +18,23 @@ localeTitle: 更改条形图的演示文稿
```yml
tests:
- text: 第一个<code>div</code>的<code>height</code>应为120像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(0).css("height") == "120px" && $("div").eq(0).css("margin-right") == "2px", "The first <code>div</code> should have a <code>height</code> of 120 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(0).css('height') == '120px' && $('div').eq(0).css('margin-right') == '2px');
- text: 第二个<code>div</code>的<code>height</code>应为310像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(1).css("height") == "310px" && $("div").eq(1).css("margin-right") == "2px", "The second <code>div</code> should have a <code>height</code> of 310 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(1).css('height') == '310px' && $('div').eq(1).css('margin-right') == '2px');
- text: 第三个<code>div</code>的<code>height</code>应为220像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(2).css("height") == "220px" && $("div").eq(2).css("margin-right") == "2px", "The third <code>div</code> should have a <code>height</code> of 220 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(2).css('height') == '220px' && $('div').eq(2).css('margin-right') == '2px');
- text: 第四个<code>div</code>的<code>height</code>应为170像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(3).css("height") == "170px" && $("div").eq(3).css("margin-right") == "2px", "The fourth <code>div</code> should have a <code>height</code> of 170 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(3).css('height') == '170px' && $('div').eq(3).css('margin-right') == '2px');
- text: 第五个<code>div</code>的<code>height</code>应为250像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(4).css("height") == "250px" && $("div").eq(4).css("margin-right") == "2px", "The fifth <code>div</code> should have a <code>height</code> of 250 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(4).css('height') == '250px' && $('div').eq(4).css('margin-right') == '2px');
- text: 第六个<code>div</code>的<code>height</code>应为180像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(5).css("height") == "180px" && $("div").eq(5).css("margin-right") == "2px", "The sixth <code>div</code> should have a <code>height</code> of 180 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(5).css('height') == '180px' && $('div').eq(5).css('margin-right') == '2px');
- text: 第七个<code>div</code>的<code>height</code>应为290像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(6).css("height") == "290px" && $("div").eq(6).css("margin-right") == "2px", "The seventh <code>div</code> should have a <code>height</code> of 290 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(6).css('height') == '290px' && $('div').eq(6).css('margin-right') == '2px');
- text: 第八个<code>div</code>的<code>height</code>应为140像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(7).css("height") == "140px" && $("div").eq(7).css("margin-right") == "2px", "The eighth <code>div</code> should have a <code>height</code> of 140 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(7).css('height') == '140px' && $('div').eq(7).css('margin-right') == '2px');
- text: 第九个<code>div</code>的<code>height</code>应为90像素， <code>margin</code>为2像素。
testString: 'assert($("div").eq(8).css("height") == "90px" && $("div").eq(8).css("margin-right") == "2px", "The ninth <code>div</code> should have a <code>height</code> of 90 pixels and a <code>margin</code> of 2 pixels.");'
testString: assert($('div').eq(8).css('height') == '90px' && $('div').eq(8).css('margin-right') == '2px');
```

8
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set.chinese.md
View File

@ -18,13 +18,13 @@ localeTitle: 为集合中的每个数据点创建一个条
```yml
tests:
- text: 您的文档应该有9个<code>rect</code>元素。
testString: 'assert($("rect").length == 9, "Your document should have 9 <code>rect</code> elements.");'
testString: assert($('rect').length == 9);
- text: 您的代码应该使用<code>data()</code>方法。
testString: 'assert(code.match(/\.data/g), "Your code should use the <code>data()</code> method.");'
testString: assert(code.match(/\.data/g));
- text: 您的代码应使用<code>enter()</code>方法。
testString: 'assert(code.match(/\.enter/g), "Your code should use the <code>enter()</code> method.");'
testString: assert(code.match(/\.enter/g));
- text: 您的代码应使用<code>append()</code>方法。
testString: 'assert(code.match(/\.append/g), "Your code should use the <code>append()</code> method.");'
testString: assert(code.match(/\.append/g));
```

6
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.chinese.md
View File

@ -18,11 +18,11 @@ localeTitle: 使用D3创建线性比例
```yml
tests:
- text: <code>h2</code>的文本应为50。
testString: 'assert($("h2").text() == "50", "The text in the <code>h2</code> should be 50.");'
testString: assert($('h2').text() == '50');
- text: 您的代码应使用<code>scaleLinear()</code>方法。
testString: 'assert(code.match(/\.scaleLinear/g), "Your code should use the <code>scaleLinear()</code> method.");'
testString: assert(code.match(/\.scaleLinear/g));
- text: <code>output</code>变量应该使用参数50调用<code>scale</code> 。
testString: 'assert(output == 50 && code.match(/scale\(\s*?50\s*?\)/g), "The <code>output</code> variable should call <code>scale</code> with an argument of 50.");'
testString: assert(output == 50 && code.match(/scale\(\s*?50\s*?\)/g));
```

2
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.chinese.md
View File

@ -18,7 +18,7 @@ localeTitle: 使用SVG圈创建散点图
```yml
tests:
- text: 您的代码应该有10个<code>circle</code>元素。
testString: 'assert($("circle").length == 10, "Your code should have 10 <code>circle</code> elements.");'
testString: assert($('circle').length == 10);
```

10
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/display-shapes-with-svg.chinese.md
View File

@ -18,15 +18,15 @@ localeTitle: 使用SVG显示形状
```yml
tests:
- text: 您的文档应该有1个<code>rect</code>元素。
testString: 'assert($("rect").length == 1, "Your document should have 1 <code>rect</code> element.");'
testString: assert($('rect').length == 1);
- text: <code>rect</code>元素的<code>width</code>属性应设置为25。
testString: 'assert($("rect").attr("width") == "25", "The <code>rect</code> element should have a <code>width</code> attribute set to 25.");'
testString: assert($('rect').attr('width') == '25');
- text: <code>rect</code>元素的<code>height</code>属性应设置为100。
testString: 'assert($("rect").attr("height") == "100", "The <code>rect</code> element should have a <code>height</code> attribute set to 100.");'
testString: assert($('rect').attr('height') == '100');
- text: <code>rect</code>元素的<code>x</code>属性应设置为0。
testString: 'assert($("rect").attr("x") == "0", "The <code>rect</code> element should have an <code>x</code> attribute set to 0.");'
testString: assert($('rect').attr('x') == '0');
- text: <code>rect</code>元素的<code>y</code>属性应设置为0。
testString: 'assert($("rect").attr("y") == "0", "The <code>rect</code> element should have a <code>y</code> attribute set to 0.");'
testString: assert($('rect').attr('y') == '0');
```

18
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar.chinese.md
View File

@ -18,23 +18,23 @@ localeTitle: 动态改变每个栏的高度
```yml
tests:
- text: 第一个<code>rect</code>的<code>height</code>应为36。
testString: 'assert($("rect").eq(0).attr("height") == "36", "The first <code>rect</code> should have a <code>height</code> of 36.");'
testString: assert($('rect').eq(0).attr('height') == '36');
- text: 第二个<code>rect</code>的<code>height</code>应为93。
testString: 'assert($("rect").eq(1).attr("height") == "93", "The second <code>rect</code> should have a <code>height</code> of 93.");'
testString: assert($('rect').eq(1).attr('height') == '93');
- text: 第三个<code>rect</code>的<code>height</code>应为66。
testString: 'assert($("rect").eq(2).attr("height") == "66", "The third <code>rect</code> should have a <code>height</code> of 66.");'
testString: assert($('rect').eq(2).attr('height') == '66');
- text: 第四个<code>rect</code>的<code>height</code>应为51。
testString: 'assert($("rect").eq(3).attr("height") == "51", "The fourth <code>rect</code> should have a <code>height</code> of 51.");'
testString: assert($('rect').eq(3).attr('height') == '51');
- text: 第五个<code>rect</code>的<code>height</code>应为75。
testString: 'assert($("rect").eq(4).attr("height") == "75", "The fifth <code>rect</code> should have a <code>height</code> of 75.");'
testString: assert($('rect').eq(4).attr('height') == '75');
- text: 第六个<code>rect</code>的<code>height</code>应为54。
testString: 'assert($("rect").eq(5).attr("height") == "54", "The sixth <code>rect</code> should have a <code>height</code> of 54.");'
testString: assert($('rect').eq(5).attr('height') == '54');
- text: 第七个<code>rect</code>的<code>height</code>应为87。
testString: 'assert($("rect").eq(6).attr("height") == "87", "The seventh <code>rect</code> should have a <code>height</code> of 87.");'
testString: assert($('rect').eq(6).attr('height') == '87');
- text: 第八个<code>rect</code>应该有42的<code>height</code> 。
testString: 'assert($("rect").eq(7).attr("height") == "42", "The eighth <code>rect</code> should have a <code>height</code> of 42.");'
testString: assert($('rect').eq(7).attr('height') == '42');
- text: 第九个<code>rect</code>的<code>height</code>应为27。
testString: 'assert($("rect").eq(8).attr("height") == "27", "The ninth <code>rect</code> should have a <code>height</code> of 27.");'
testString: assert($('rect').eq(8).attr('height') == '27');
```

18
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar.chinese.md
View File

@ -18,23 +18,23 @@ localeTitle: 动态设置每个条形的坐标
```yml
tests:
- text: 第一个<code>rect</code>的<code>x</code>值应为0。
testString: 'assert($("rect").eq(0).attr("x") == "0", "The first <code>rect</code> should have an <code>x</code> value of 0.");'
testString: assert($('rect').eq(0).attr('x') == '0');
- text: 第二个<code>rect</code>的<code>x</code>值应为30。
testString: 'assert($("rect").eq(1).attr("x") == "30", "The second <code>rect</code> should have an <code>x</code> value of 30.");'
testString: assert($('rect').eq(1).attr('x') == '30');
- text: 第三个<code>rect</code>的<code>x</code>值应为60。
testString: 'assert($("rect").eq(2).attr("x") == "60", "The third <code>rect</code> should have an <code>x</code> value of 60.");'
testString: assert($('rect').eq(2).attr('x') == '60');
- text: 第四个<code>rect</code>的<code>x</code>值应为90。
testString: 'assert($("rect").eq(3).attr("x") == "90", "The fourth <code>rect</code> should have an <code>x</code> value of 90.");'
testString: assert($('rect').eq(3).attr('x') == '90');
- text: 第五个<code>rect</code>的<code>x</code>值应为120。
testString: 'assert($("rect").eq(4).attr("x") == "120", "The fifth <code>rect</code> should have an <code>x</code> value of 120.");'
testString: assert($('rect').eq(4).attr('x') == '120');
- text: 第六个<code>rect</code>的<code>x</code>值应为150。
testString: 'assert($("rect").eq(5).attr("x") == "150", "The sixth <code>rect</code> should have an <code>x</code> value of 150.");'
testString: assert($('rect').eq(5).attr('x') == '150');
- text: 第七个<code>rect</code>的<code>x</code>值应为180。
testString: 'assert($("rect").eq(6).attr("x") == "180", "The seventh <code>rect</code> should have an <code>x</code> value of 180.");'
testString: assert($('rect').eq(6).attr('x') == '180');
- text: 第八个<code>rect</code>的<code>x</code>值应为210。
testString: 'assert($("rect").eq(7).attr("x") == "210", "The eighth <code>rect</code> should have an <code>x</code> value of 210.");'
testString: assert($('rect').eq(7).attr('x') == '210');
- text: 第九个<code>rect</code>的<code>x</code>值应为240。
testString: 'assert($("rect").eq(8).attr("x") == "240", "The ninth <code>rect</code> should have an <code>x</code> value of 240.");'
testString: assert($('rect').eq(8).attr('x') == '240');
```

26
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/invert-svg-elements.chinese.md
View File

@ -7,7 +7,13 @@ localeTitle: 反转SVG元素
---
## Description
undefined
<section id="description">
您可能已经注意到条形图看起来像是上下颠倒或倒置的。这是因为SVG如何使用（x，y）坐标。
在SVG中，坐标的原点位于左上角。 <code> x </code>坐标为0时，会在SVG区域的左边缘放置一个形状。 <code> y </code>坐标为0时，会在SVG区域的顶部边缘放置一个形状。较高的<code> x </code>值将矩形推向右侧。较高的<code> y </code>值将矩形向下推。
要使条形图正面朝上，您需要更改<code> y </code>坐标的计算方式。它需要考虑钢筋的高度和SVG区域的总高度。
SVG区域的高度为100。如果集合中的数据点为0，则希望条形图从SVG区域的底部开始（而不是顶部）。为此，<code> y </code>坐标需要值为100。如果数据点值为1，则应从100的<code> y </code>坐标开始，以将条形设置为底部。然后，您需要考虑钢筋的高度1，因此最终<code> y </code>坐标为99。
<code> y </code>坐标为<code> y = heightOfSVG-heightOfBar </code>会将条形图朝上放置。
</section>
## Instructions
<section id="instructions">更改<code>y</code>属性的回调函数以将栏设置为正面朝上。请记住，条形的<code>height</code>是数据值<code>d</code> 3倍。 <strong>注意</strong> <br>通常，关系是<code>y = h - m * d</code> ，其中<code>m</code>是缩放数据点的常数。 </section>
@ -18,23 +24,23 @@ undefined
```yml
tests:
- text: 第一个<code>rect</code>的<code>y</code>值应为64。
testString: 'assert($("rect").eq(0).attr("y") == h - (dataset[0] * 3), "The first <code>rect</code> should have a <code>y</code> value of 64.");'
testString: assert($('rect').eq(0).attr('y') == h - (dataset[0] * 3));
- text: 第二个<code>rect</code>的<code>y</code>值应为7。
testString: 'assert($("rect").eq(1).attr("y") == h - (dataset[1] * 3), "The second <code>rect</code> should have a <code>y</code> value of 7.");'
testString: assert($('rect').eq(1).attr('y') == h - (dataset[1] * 3));
- text: 第三个<code>rect</code>的<code>y</code>值应为34。
testString: 'assert($("rect").eq(2).attr("y") == h - (dataset[2] * 3), "The third <code>rect</code> should have a <code>y</code> value of 34.");'
testString: assert($('rect').eq(2).attr('y') == h - (dataset[2] * 3));
- text: 第四个<code>rect</code>的<code>y</code>值应为49。
testString: 'assert($("rect").eq(3).attr("y") == h - (dataset[3] * 3), "The fourth <code>rect</code> should have a <code>y</code> value of 49.");'
testString: assert($('rect').eq(3).attr('y') == h - (dataset[3] * 3));
- text: 第五个<code>rect</code>的<code>y</code>值应为25。
testString: 'assert($("rect").eq(4).attr("y") == h - (dataset[4] * 3), "The fifth <code>rect</code> should have a <code>y</code> value of 25.");'
testString: assert($('rect').eq(4).attr('y') == h - (dataset[4] * 3));
- text: 第六个<code>rect</code>的<code>y</code>值应为46。
testString: 'assert($("rect").eq(5).attr("y") == h - (dataset[5] * 3), "The sixth <code>rect</code> should have a <code>y</code> value of 46.");'
testString: assert($('rect').eq(5).attr('y') == h - (dataset[5] * 3));
- text: 第七个<code>rect</code>的<code>y</code>值应为13。
testString: 'assert($("rect").eq(6).attr("y") == h - (dataset[6] * 3), "The seventh <code>rect</code> should have a <code>y</code> value of 13.");'
testString: assert($('rect').eq(6).attr('y') == h - (dataset[6] * 3));
- text: 第八个<code>rect</code>的<code>y</code>值应为58。
testString: 'assert($("rect").eq(7).attr("y") == h - (dataset[7] * 3), "The eighth <code>rect</code> should have a <code>y</code> value of 58.");'
testString: assert($('rect').eq(7).attr('y') == h - (dataset[7] * 3));
- text: 第九个<code>rect</code>的<code>y</code>值应为73。
testString: 'assert($("rect").eq(8).attr("y") == h - (dataset[8] * 3), "The ninth <code>rect</code> should have a <code>y</code> value of 73.");'
testString: assert($('rect').eq(8).attr('y') == h - (dataset[8] * 3));
```

6
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/learn-about-svg-in-d3.chinese.md
View File

@ -18,11 +18,11 @@ localeTitle: 在D3中了解SVG
```yml
tests:
- text: 您的文档应该有1个<code>svg</code>元素。
testString: 'assert($("svg").length == 1, "Your document should have 1 <code>svg</code> element.");'
testString: assert($('svg').length == 1);
- text: <code>svg</code>元素的<code>width</code>属性应设置为500。
testString: 'assert($("svg").attr("width") == "500", "The <code>svg</code> element should have a <code>width</code> attribute set to 500.");'
testString: assert($('svg').attr('width') == '500'||$('svg').css('width') == '500px');
- text: <code>svg</code>元素的<code>height</code>属性应设置为100。
testString: 'assert($("svg").attr("height") == "100", "The <code>svg</code> element should have a <code>height</code> attribute set to 100.");'
testString: assert($('svg').attr('height') == '100'||$('svg').css('height') == '100px');
```

6
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3.chinese.md
View File

@ -18,11 +18,11 @@ localeTitle: 使用D3选择一组元素
```yml
tests:
- text: 页面上应该有3个<code>li</code>元素，每个元素中的文本应该是“list item”。大写和间距应完全匹配。
testString: 'assert($("li").text().match(/list item/g).length == 3, "There should be 3 <code>li</code> elements on the page, and the text in each one should say "list item". Capitalization and spacing should match exactly.");'
testString: assert($('li').text().match(/list item/g).length == 3);
- text: 您的代码应该访问<code>d3</code>对象。
testString: 'assert(code.match(/d3/g), "Your code should access the <code>d3</code> object.");'
testString: assert(code.match(/d3/g));
- text: 您的代码应该使用<code>selectAll</code>方法。
testString: 'assert(code.match(/\.selectAll/g), "Your code should use the <code>selectAll</code> method.");'
testString: assert(code.match(/\.selectAll/g));
```

10
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.chinese.md
View File

@ -18,15 +18,15 @@ localeTitle: 在比例上设置域和范围
```yml
tests:
- text: 您的代码应使用<code>domain()</code>方法。
testString: 'assert(code.match(/\.domain/g), "Your code should use the <code>domain()</code> method.");'
testString: assert(code.match(/\.domain/g));
- text: '比例的<code>domain()</code>应设置为<code>[250, 500]</code> 。'
testString: 'assert(JSON.stringify(scale.domain()) == JSON.stringify([250, 500]), "The <code>domain()</code> of the scale should be set to <code>[250, 500]</code>.");'
testString: assert(JSON.stringify(scale.domain()) == JSON.stringify([250, 500]));
- text: 您的代码应使用<code>range()</code>方法。
testString: 'assert(code.match(/\.range/g), "Your code should use the <code>range()</code> method.");'
testString: assert(code.match(/\.range/g));
- text: '刻度的<code>range()</code>应设置为<code>[10, 150]</code> 。'
testString: 'assert(JSON.stringify(scale.range()) == JSON.stringify([10, 150]), "The <code>range()</code> of the scale should be set to <code>[10, 150]</code>.");'
testString: assert(JSON.stringify(scale.range()) == JSON.stringify([10, 150]));
- text: <code>h2</code>的文本应为-102。
testString: 'assert($("h2").text() == "-102", "The text in the <code>h2</code> should be -102.");'
testString: assert($('h2').text() == '-102');
```

4
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/style-d3-labels.chinese.md
View File

@ -18,9 +18,9 @@ localeTitle: 风格D3标签
```yml
tests:
- text: 标签应该都具有红色的<code>fill</code>颜色。
testString: 'assert($("text").css("fill") == "rgb(255, 0, 0)", "The labels should all have a <code>fill</code> color of red.");'
testString: assert($('text').css('fill') == 'rgb(255, 0, 0)');
- text: 标签应该都具有25像素的<code>font-size</code> 。
testString: 'assert($("text").css("font-size") == "25px", "The labels should all have a <code>font-size</code> of 25 pixels.");'
testString: assert($('text').css('font-size') == '25px');
```

18
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically.chinese.md
View File

@ -18,23 +18,23 @@ localeTitle: 动态更新元素的高度
```yml
tests:
- text: 第一个<code>div</code>的<code>height</code>应为12像素。
testString: 'assert($("div").eq(0).css("height") == "12px", "The first <code>div</code> should have a <code>height</code> of 12 pixels.");'
testString: assert($('div').eq(0)[0].style.height === '12px');
- text: 第二个<code>div</code>的<code>height</code>应为31像素。
testString: 'assert($("div").eq(1).css("height") == "31px", "The second <code>div</code> should have a <code>height</code> of 31 pixels.");'
testString: assert($('div').eq(1)[0].style.height === '31px');
- text: 第三个<code>div</code>的<code>height</code>应为22像素。
testString: 'assert($("div").eq(2).css("height") == "22px", "The third <code>div</code> should have a <code>height</code> of 22 pixels.");'
testString: assert($('div').eq(2)[0].style.height === '22px');
- text: 第四个<code>div</code>的<code>height</code>应为17像素。
testString: 'assert($("div").eq(3).css("height") == "17px", "The fourth <code>div</code> should have a <code>height</code> of 17 pixels.");'
testString: assert($('div').eq(3)[0].style.height === '17px');
- text: 第五个<code>div</code>的<code>height</code>应为25像素。
testString: 'assert($("div").eq(4).css("height") == "25px", "The fifth <code>div</code> should have a <code>height</code> of 25 pixels.");'
testString: assert($('div').eq(4)[0].style.height === '25px');
- text: 第六个<code>div</code>的<code>height</code>应为18像素。
testString: 'assert($("div").eq(5).css("height") == "18px", "The sixth <code>div</code> should have a <code>height</code> of 18 pixels.");'
testString: assert($('div').eq(5)[0].style.height === '18px');
- text: 第七个<code>div</code>的<code>height</code>应为29像素。
testString: 'assert($("div").eq(6).css("height") == "29px", "The seventh <code>div</code> should have a <code>height</code> of 29 pixels.");'
testString: assert($('div').eq(6)[0].style.height === '29px');
- text: 第八个<code>div</code>的<code>height</code>应为14像素。
testString: 'assert($("div").eq(7).css("height") == "14px", "The eighth <code>div</code> should have a <code>height</code> of 14 pixels.");'
testString: assert($('div').eq(7)[0].style.height === '14px');
- text: 第九个<code>div</code>的<code>height</code>应为9像素。
testString: 'assert($("div").eq(8).css("height") == "9px", "The ninth <code>div</code> should have a <code>height</code> of 9 pixels.");'
testString: assert($('div').eq(8)[0].style.height === '9px');
```

44
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.chinese.md
View File

@ -18,49 +18,49 @@ localeTitle: 使用预定义比例放置元素
```yml
tests:
- text: 您的代码应该有10个<code>circle</code>元素。
testString: 'assert($("circle").length == 10, "Your code should have 10 <code>circle</code> elements.");'
testString: assert($('circle').length == 10);
- text: 应用刻度后，第一个<code>circle</code>元素应具有大约91的<code>cx</code>值和大约368的<code>cy</code>值。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(0).attr("cx")) == "91" && Math.round($("circle").eq(0).attr("cy")) == "368" && $("circle").eq(0).attr("r") == "5", "The first <code>circle</code> element should have a <code>cx</code> value of approximately 91 and a <code>cy</code> value of approximately 368 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(0).attr('cx')) == '91' && Math.round($('circle').eq(0).attr('cy')) == '368' && $('circle').eq(0).attr('r') == '5');
- text: 应用刻度后，第二个<code>circle</code>元素的<code>cx</code>值应约为159， <code>cy</code>值应约为181。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(1).attr("cx")) == "159" && Math.round($("circle").eq(1).attr("cy")) == "181" && $("circle").eq(1).attr("r") == "5", "The second <code>circle</code> element should have a <code>cx</code> value of approximately 159 and a <code>cy</code> value of approximately 181 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(1).attr('cx')) == '159' && Math.round($('circle').eq(1).attr('cy')) == '181' && $('circle').eq(1).attr('r') == '5');
- text: 应用刻度后，第三个<code>circle</code>元素应具有约340的<code>cx</code>值和约329的<code>cy</code>值。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(2).attr("cx")) == "340" && Math.round($("circle").eq(2).attr("cy")) == "329" && $("circle").eq(2).attr("r") == "5", "The third <code>circle</code> element should have a <code>cx</code> value of approximately 340 and a <code>cy</code> value of approximately 329 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(2).attr('cx')) == '340' && Math.round($('circle').eq(2).attr('cy')) == '329' && $('circle').eq(2).attr('r') == '5');
- text: 应用刻度后，第四个<code>circle</code>元素应具有大约131的<code>cx</code>值和大约60的<code>cy</code>值。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(3).attr("cx")) == "131" && Math.round($("circle").eq(3).attr("cy")) == "60" && $("circle").eq(3).attr("r") == "5", "The fourth <code>circle</code> element should have a <code>cx</code> value of approximately 131 and a <code>cy</code> value of approximately 60 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(3).attr('cx')) == '131' && Math.round($('circle').eq(3).attr('cy')) == '60' && $('circle').eq(3).attr('r') == '5');
- text: 应用刻度后，第五个<code>circle</code>元素应具有大约440的<code>cx</code>值和大约237的<code>cy</code>值。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(4).attr("cx")) == "440" && Math.round($("circle").eq(4).attr("cy")) == "237" && $("circle").eq(4).attr("r") == "5", "The fifth <code>circle</code> element should have a <code>cx</code> value of approximately 440 and a <code>cy</code> value of approximately 237 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(4).attr('cx')) == '440' && Math.round($('circle').eq(4).attr('cy')) == '237' && $('circle').eq(4).attr('r') == '5');
- text: 应用刻度后，第六个<code>circle</code>元素应具有约271的<code>cx</code>值和约306的<code>cy</code>值。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(5).attr("cx")) == "271" && Math.round($("circle").eq(5).attr("cy")) == "306" && $("circle").eq(5).attr("r") == "5", "The sixth <code>circle</code> element should have a <code>cx</code> value of approximately 271 and a <code>cy</code> value of approximately 306 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(5).attr('cx')) == '271' && Math.round($('circle').eq(5).attr('cy')) == '306' && $('circle').eq(5).attr('r') == '5');
- text: 应用刻度后，第七个<code>circle</code>元素的<code>cx</code>值约为361， <code>cy</code>值约为351。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(6).attr("cx")) == "361" && Math.round($("circle").eq(6).attr("cy")) == "351" && $("circle").eq(6).attr("r") == "5", "The seventh <code>circle</code> element should have a <code>cx</code> value of approximately 361 and a <code>cy</code> value of approximately 351 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(6).attr('cx')) == '361' && Math.round($('circle').eq(6).attr('cy')) == '351' && $('circle').eq(6).attr('r') == '5');
- text: 应用刻度后，第八个<code>circle</code>元素应具有约261的<code>cx</code>值和约132的<code>cy</code>值。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(7).attr("cx")) == "261" && Math.round($("circle").eq(7).attr("cy")) == "132" && $("circle").eq(7).attr("r") == "5", "The eighth <code>circle</code> element should have a <code>cx</code> value of approximately 261 and a <code>cy</code> value of approximately 132 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(7).attr('cx')) == '261' && Math.round($('circle').eq(7).attr('cy')) == '132' && $('circle').eq(7).attr('r') == '5');
- text: 应用刻度后，第九个<code>circle</code>元素应具有大约131的<code>cx</code>值和大约144的<code>cy</code>值。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(8).attr("cx")) == "131" && Math.round($("circle").eq(8).attr("cy")) == "144" && $("circle").eq(8).attr("r") == "5", "The ninth <code>circle</code> element should have a <code>cx</code> value of approximately 131 and a <code>cy</code> value of approximately 144 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(8).attr('cx')) == '131' && Math.round($('circle').eq(8).attr('cy')) == '144' && $('circle').eq(8).attr('r') == '5');
- text: 应用刻度后，第十个<code>circle</code>元素应具有大约79的<code>cx</code>值和大约326的<code>cy</code>值。它的<code>r</code>值也应为5。
testString: 'assert(Math.round($("circle").eq(9).attr("cx")) == "79" && Math.round($("circle").eq(9).attr("cy")) == "326" && $("circle").eq(9).attr("r") == "5", "The tenth <code>circle</code> element should have a <code>cx</code> value of approximately 79 and a <code>cy</code> value of approximately 326 after applying the scales. It should also have an <code>r</code> value of 5.");'
testString: assert(Math.round($('circle').eq(9).attr('cx')) == '79' && Math.round($('circle').eq(9).attr('cy')) == '326' && $('circle').eq(9).attr('r') == '5');
- text: 您的代码应该有10个<code>text</code>元素。
testString: 'assert($("text").length == 10, "Your code should have 10 <code>text</code> elements.");'
testString: assert($('text').length == 10);
- text: 应用刻度后，第一个标签的<code>x</code>值约为100， <code>y</code>值约为368。
testString: 'assert(Math.round($("text").eq(0).attr("x")) == "100" && Math.round($("text").eq(0).attr("y")) == "368", "The first label should have an <code>x</code> value of approximately 100 and a <code>y</code> value of approximately 368 after applying the scales.");'
testString: assert(Math.round($('text').eq(0).attr('x')) == '100' && Math.round($('text').eq(0).attr('y')) == '368');
- text: 第二标签应该有一个<code>x</code>的大约168值和<code>y</code>施加鳞后的约181的值。
testString: 'assert(Math.round($("text").eq(1).attr("x")) == "168" && Math.round($("text").eq(1).attr("y")) == "181", "The second label should have an <code>x</code> value of approximately 168 and a <code>y</code> value of approximately 181 after applying the scales.");'
testString: assert(Math.round($('text').eq(1).attr('x')) == '168' && Math.round($('text').eq(1).attr('y')) == '181');
- text: 应用刻度后，第三个标签的<code>x</code>值约为350， <code>y</code>值约为329。
testString: 'assert(Math.round($("text").eq(2).attr("x")) == "350" && Math.round($("text").eq(2).attr("y")) == "329", "The third label should have an <code>x</code> value of approximately 350 and a <code>y</code> value of approximately 329 after applying the scales.");'
testString: assert(Math.round($('text').eq(2).attr('x')) == '350' && Math.round($('text').eq(2).attr('y')) == '329');
- text: 第四标签应该有一个<code>x</code>的大约141值和<code>y</code>施加鳞后的约60的值。
testString: 'assert(Math.round($("text").eq(3).attr("x")) == "141" && Math.round($("text").eq(3).attr("y")) == "60", "The fourth label should have an <code>x</code> value of approximately 141 and a <code>y</code> value of approximately 60 after applying the scales.");'
testString: assert(Math.round($('text').eq(3).attr('x')) == '141' && Math.round($('text').eq(3).attr('y')) == '60');
- text: 应用刻度后，第五个标签的<code>x</code>值约为449， <code>y</code>值约为237。
testString: 'assert(Math.round($("text").eq(4).attr("x")) == "449" && Math.round($("text").eq(4).attr("y")) == "237", "The fifth label should have an <code>x</code> value of approximately 449 and a <code>y</code> value of approximately 237 after applying the scales.");'
testString: assert(Math.round($('text').eq(4).attr('x')) == '449' && Math.round($('text').eq(4).attr('y')) == '237');
- text: 应用刻度后，第六个标签的<code>x</code>值约为280， <code>y</code>值约为306。
testString: 'assert(Math.round($("text").eq(5).attr("x")) == "280" && Math.round($("text").eq(5).attr("y")) == "306", "The sixth label should have an <code>x</code> value of approximately 280 and a <code>y</code> value of approximately 306 after applying the scales.");'
testString: assert(Math.round($('text').eq(5).attr('x')) == '280' && Math.round($('text').eq(5).attr('y')) == '306');
- text: 应用刻度后，第七个标签的<code>x</code>值约为370， <code>y</code>值约为351。
testString: 'assert(Math.round($("text").eq(6).attr("x")) == "370" && Math.round($("text").eq(6).attr("y")) == "351", "The seventh label should have an <code>x</code> value of approximately 370 and a <code>y</code> value of approximately 351 after applying the scales.");'
testString: assert(Math.round($('text').eq(6).attr('x')) == '370' && Math.round($('text').eq(6).attr('y')) == '351');
- text: 应用刻度后，第八个标签的<code>x</code>值约为270， <code>y</code>值约为132。
testString: 'assert(Math.round($("text").eq(7).attr("x")) == "270" && Math.round($("text").eq(7).attr("y")) == "132", "The eighth label should have an <code>x</code> value of approximately 270 and a <code>y</code> value of approximately 132 after applying the scales.");'
testString: assert(Math.round($('text').eq(7).attr('x')) == '270' && Math.round($('text').eq(7).attr('y')) == '132');
- text: 应用刻度后，第九个标签的<code>x</code>值约为140， <code>y</code>值约为144。
testString: 'assert(Math.round($("text").eq(8).attr("x")) == "140" && Math.round($("text").eq(8).attr("y")) == "144", "The ninth label should have an <code>x</code> value of approximately 140 and a <code>y</code> value of approximately 144 after applying the scales.");'
testString: assert(Math.round($('text').eq(8).attr('x')) == '140' && Math.round($('text').eq(8).attr('y')) == '144');
- text: 应用刻度后，第十个标签的<code>x</code>值约为88， <code>y</code>值约为326。
testString: 'assert(Math.round($("text").eq(9).attr("x")) == "88" && Math.round($("text").eq(9).attr("y")) == "326", "The tenth label should have an <code>x</code> value of approximately 88 and a <code>y</code> value of approximately 326 after applying the scales.");'
testString: assert(Math.round($('text').eq(9).attr('x')) == '88' && Math.round($('text').eq(9).attr('y')) == '326');
```

6
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.chinese.md
View File

@ -18,11 +18,11 @@ localeTitle: 使用动态比例
```yml
tests:
- text: <code>h2</code>的文本应为30。
testString: 'assert(output == 30 && $("h2").text() == "30", "The text in the <code>h2</code> should be 30.");'
testString: assert(output == 30 && $('h2').text() == '30');
- text: 'yScale的<code>domain()</code>应该等于<code>[0, 411]</code> 0,411 <code>[0, 411]</code> 。'
testString: 'assert(JSON.stringify(yScale.domain()) == JSON.stringify([0, 411]), "The <code>domain()</code> of yScale should be equivalent to <code>[0, 411]</code>.");'
testString: assert(JSON.stringify(yScale.domain()) == JSON.stringify([0, 411]));
- text: 'yScale的<code>range()</code>应相当于<code>[470, 30]</code> 470,30 <code>[470, 30]</code> 。'
testString: 'assert(JSON.stringify(yScale.range()) == JSON.stringify([470, 30]), "The <code>range()</code> of yScale should be equivalent to <code>[470, 30]</code>.");'
testString: assert(JSON.stringify(yScale.range()) == JSON.stringify([470, 30]));
```

4
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset.chinese.md
View File

@ -18,9 +18,9 @@ localeTitle: 使用d3.max和d3.min函数查找数据集中的最小值和最大
```yml
tests:
- text: <code>h2</code>的文本应为8。
testString: 'assert(output == 8 && $("h2").text() == "8", "The text in the <code>h2</code> should be 8.");'
testString: assert(output == 8 && $('h2').text() == '8');
- text: 您的代码应使用<code>max()</code>方法。
testString: 'assert(code.match(/\.max/g), "Your code should use the <code>max()</code> method.")'
testString: assert(code.match(/\.max/g), 'Your code should use the <code>max()</code> method.')
```

8
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/work-with-data-in-d3.chinese.md
View File

@ -18,13 +18,13 @@ localeTitle: 在D3中使用数据
```yml
tests:
- text: 您的文档应该有9个<code>h2</code>元素。
testString: 'assert($("h2").length == 9, "Your document should have 9 <code>h2</code> elements.");'
testString: assert($('h2').length == 9);
- text: <code>h2</code>元素中的文本应该是“New Title”。大写和间距应完全匹配。
testString: 'assert($("h2").text().match(/New Title/g).length == 9, "The text in the <code>h2</code> elements should say "New Title". The capitalization and spacing should match exactly.");'
testString: assert($('h2').text().match(/New Title/g).length == 9);
- text: 您的代码应该使用<code>data()</code>方法。
testString: 'assert(code.match(/\.data/g), "Your code should use the <code>data()</code> method.");'
testString: assert(code.match(/\.data/g));
- text: 您的代码应使用<code>enter()</code>方法。
testString: 'assert(code.match(/\.enter/g), "Your code should use the <code>enter()</code> method.");'
testString: assert(code.match(/\.enter/g));
```

18
curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3.chinese.md
View File

@ -18,23 +18,23 @@ localeTitle: 在D3中使用动态数据
```yml
tests:
- text: 第一个<code>h2</code>应该有“12美元”的文字。
testString: 'assert($("h2").eq(0).text() == "12 USD", "The first <code>h2</code> should have the text "12 USD".");'
testString: assert($('h2').eq(0).text() == "12 USD");
- text: 第二个<code>h2</code>应该有“31美元”的文字。
testString: 'assert($("h2").eq(1).text() == "31 USD", "The second <code>h2</code> should have the text "31 USD".");'
testString: assert($('h2').eq(1).text() == "31 USD");
- text: 第三个<code>h2</code>应该有“22美元”的文字。
testString: 'assert($("h2").eq(2).text() == "22 USD", "The third <code>h2</code> should have the text "22 USD".");'
testString: assert($('h2').eq(2).text() == "22 USD");
- text: 第四个<code>h2</code>应该有“17美元”的文字。
testString: 'assert($("h2").eq(3).text() == "17 USD", "The fourth <code>h2</code> should have the text "17 USD".");'
testString: assert($('h2').eq(3).text() == "17 USD");
- text: 第五个<code>h2</code>应该有“25美元”的文字。
testString: 'assert($("h2").eq(4).text() == "25 USD", "The fifth <code>h2</code> should have the text "25 USD".");'
testString: assert($('h2').eq(4).text() == "25 USD");
- text: 第六个<code>h2</code>应该有“18美元”的文字。
testString: 'assert($("h2").eq(5).text() == "18 USD", "The sixth <code>h2</code> should have the text "18 USD".");'
testString: assert($('h2').eq(5).text() == "18 USD");
- text: 第七个<code>h2</code>应该有“29美元”的文字。
testString: 'assert($("h2").eq(6).text() == "29 USD", "The seventh <code>h2</code> should have the text "29 USD".");'
testString: assert($('h2').eq(6).text() == "29 USD");
- text: 第八个<code>h2</code>应该有“14美元”的文字。
testString: 'assert($("h2").eq(7).text() == "14 USD", "The eighth <code>h2</code> should have the text "14 USD".");'
testString: assert($('h2').eq(7).text() == "14 USD");
- text: 第九个<code>h2</code>应该有“9美元”的文字。
testString: 'assert($("h2").eq(8).text() == "9 USD", "The ninth <code>h2</code> should have the text "9 USD".");'
testString: assert($('h2').eq(8).text() == "9 USD");
```