整改docs文档

Signed-off-by: Nwangshuainan <wangshuainan1@huawei.com>

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md

@@ -18,9 +18,9 @@ Canvas(context?: CanvasRenderingContext2D)
 
 **参数：**
 
-  | 参数名     | 参数类型                                     | 必填   | 默认值  | 参数描述                         |
-  | ------- | ---------------------------------------- | ---- | ---- | ---------------------------- |
-  | context | [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md) | 否    | -    | 见CanvasRenderingContext2D对象。 |
+| 参数名     | 参数类型                                     | 必填   | 默认值  | 参数描述                         |
+| ------- | ---------------------------------------- | ---- | ---- | ---------------------------- |
+| context | [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md) | 否    | -    | 见CanvasRenderingContext2D对象。 |
 
 ## 属性
 
@@ -41,8 +41,8 @@ Canvas(context?: CanvasRenderingContext2D)
 @Entry
 @Component
 struct CanvasExample {
-  private settings: RenderingContextSettings = new RenderingContextSettings(true)
-  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
+  private settings: RenderingContextSettings = new RenderingContextSettings(true);
+  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
 
   build() {
     Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
@@ -50,10 +50,10 @@ struct CanvasExample {
         .width('100%')
         .height('100%')
         .backgroundColor('#ffff00')
-        .onReady(() =>{
-          this.context.fillRect(0,30,100,100)
-        })
-    }
+        .onReady(() => {
+          this.context.fillRect(0, 30, 100, 100)
+        });
+    };
     .width('100%')
     .height('100%')
   }

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-shape.md

@@ -22,9 +22,9 @@
 Shape(value?: PixelMap)
 
 - 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
+  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
   | -------- | -------- | -------- | -------- | -------- |
-  | value | PixelMap | 否 | - | 绘制目标，可将图形绘制在指定的PixelMap对象中，若未设置，则在当前绘制目标中进行绘制。 | 
+  | value | [PixelMap](../apis/js-apis-image.md#pixelmap7) | 否 | - | 绘制目标，可将图形绘制在指定的PixelMap对象中，若未设置，则在当前绘制目标中进行绘制。 |
 
 
 ## 属性

zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-basic-button.md

@@ -18,7 +18,7 @@
 
 | 名称 | 类型 | 默认值 | 必填 | 描述 |
 | -------- | -------- | -------- | -------- | -------- |
-| type | string | - | 否 | 不支持动态修改。如果该属性缺省，展示类胶囊型按钮，不同于胶囊类型，四边圆角可以通过border-radius分别指定，如果需要设置该属性，可选值如下：<br/>-&nbsp;"capsule"：胶囊型按钮，带圆角按钮，有背景色和文本。<br/>-&nbsp;"circle"：圆形按钮，支持放置图标。<br/>-&nbsp;"text"：文本按钮，仅包含文本显示。 |
+| type | string | capsule | 否 | 不支持动态修改。如果该属性缺省，展示类胶囊型按钮，不同于胶囊类型，四边圆角可以通过border-radius分别指定，如果需要设置该属性，可选值如下：<br/>-&nbsp;"capsule"：胶囊型按钮，带圆角按钮，有背景色和文本。<br/>-&nbsp;"circle"：圆形按钮，支持放置图标。<br/>-&nbsp;"text"：文本按钮，仅包含文本显示。 |
 | value | string | - | 否 | button的文本值，circle类型不生效。 |
 | icon | string | - | 否 | button的图标路径，图标格式为jpg，png和svg。 |
 | placement | string | end | 否 | 仅在type属性为缺省时生效，设置图标位于文本的位置，可选值为：<br/>-&nbsp;"start"：图标位于文本起始处。<br/>-&nbsp;"end"：图标位于文本结束处。<br/>-&nbsp;"top"：图标位于文本上方。<br/>-&nbsp;"bottom"：图标位于文本下方。 |

zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-basic-chart.md

@@ -16,14 +16,14 @@
 
 除支持[通用属性](js-service-widget-common-attributes.md)外，还支持如下属性：
 
-| 名称                | 类型                                 | 默认值  | 必填   | 描述                                       |
-| ----------------- | ---------------------------------- | ---- | ---- | ---------------------------------------- |
-| type              | string                             | line | 否    | 设置图表类型（不支持动态修改），可选项有：<br/>-&nbsp;bar：柱状图。<br/>-&nbsp;line：线形图。<br/>-&nbsp;gauge：量规图。<br/>-&nbsp;progress：进度类圆形图表。<br/>-&nbsp;loading：加载类圆形图表。<br/>-&nbsp;rainbow：占比类圆形图表。 |
-| options           | ChartOptions                       | -    | 否    | 图表参数设置，柱状图和线形图必须设置参数设置，量规图不生效。可以设置x轴、y轴的最小值、最大值、刻度数、是否显示，线条宽度、是否平滑等。（不支持动态修改） |
-| datasets          | Array\<ChartDataset>               | -    | 否    | 数据集合，柱状图和线形图必须设置数据集合，量规图不生效。可以设置多条数据集及其背景色。 |
-| segments          | DataSegment \| Array\<DataSegment> |      | 否    | 进度类、加载类和占比类圆形图表使用的数据结构。<br/>DataSegment针对进度类和加载类圆形图表使用，Array\<DataSegment>针对占比类图标使用，DataSegment最多9个。 |
-| effects           | boolean                            | true | 否    | 是否开启占比类、进度类圆形图表特效。                       |
-| animationduration | number                             | 3000 | 否    | 设置占比类圆形图表展开动画时长，单位为ms。                   |
+| 名称              | 类型                               | 默认值 | 必填 | 描述                                                         |
+| ----------------- | ---------------------------------- | ------ | ---- | ------------------------------------------------------------ |
+| type              | string                             | line   | 否   | 设置图表类型（不支持动态修改），可选项有：<br/>-&nbsp;bar：柱状图。<br/>-&nbsp;line：线形图。<br/>-&nbsp;gauge：量规图。<br/>-&nbsp;progress：进度类圆形图表。<br/>-&nbsp;loading：加载类圆形图表。<br/>-&nbsp;rainbow：占比类圆形图表。 |
+| options           | ChartOptions                       | -      | 否   | 图表参数设置，用于设置x轴、y轴的最小值、最大值、刻度数、是否显示，线条宽度、是否平滑等。（不支持动态修改）,量规图不生效。 |
+| datasets          | Array\<ChartDataset>               | -      | 否   | 数据集合，用于设置多条数据集及其背景色，量规图不生效。       |
+| segments          | DataSegment \| Array\<DataSegment> |        | 否   | 进度类、加载类和占比类圆形图表使用的数据结构。<br/>DataSegment针对进度类和加载类圆形图表使用，Array\<DataSegment>针对占比类图标使用，DataSegment最多9个。 |
+| effects           | boolean                            | true   | 否   | 是否开启占比类、进度类圆形图表特效。                         |
+| animationduration | number                             | 3000   | 否   | 设置占比类圆形图表展开动画时长，单位为ms。                   |
 
   **表1** ChartOptions
 

zh-cn/application-dev/ui/ui-js-building-ui-event.md

@@ -48,16 +48,18 @@ longpress：用户在相同位置长时间保持与屏幕接触。
 ```css
 /* xxx.css */
 .container {
+  width: 100%;
+  height: 100%;
   flex-direction: column;
   justify-content: center;
   align-items: center;
 }
 .text-container {
-  margin-top: 10px;
+  margin-top: 30px;
   flex-direction: column;
-  width: 750px;
-  height: 50px;
-  background-color: #09ba07;
+  width: 600px;
+  height: 70px;
+  background-color: #0000FF;
 }
 .text-style {
   width: 100%;
@@ -99,3 +101,5 @@ export default {
   },
 }
 ```
+
+![zh-cn_image_00000011](figures/zh-cn_image_00000011.gif)
\ No newline at end of file

zh-cn/application-dev/ui/ui-js-components-canvas.md

@@ -118,8 +118,6 @@ import prompt from '@system.prompt';
 export default {
   data:{
     dataURL:null,
-    antialia: false,
-    porc:'open',
   },
   onShow(){
     let el = this.$refs.canvas1;

zh-cn/application-dev/ui/ui-js-components-marquee.md

@@ -79,7 +79,7 @@ marquee通过color和font-weight属性设置跑马灯中文本的颜色、字体
 <div class="tutorial-page">
   <div class="mymarquee">
     <marquee loop="{{loopval}}" scrollamount="{{scroll}}" direction="{{isleft}}" class="marqueetext" id="testmarquee" onclick="makestart">
-      It's a racing lamp
+      Life is a journey, not the destination.
     </marquee>
   </div>
   <div style="width: 600px;height: 150px;flex-direction: row;justify-content: space-around;">
@@ -128,7 +128,9 @@ button{
 // xxx.js
 export default {
   private: {
-    loopval: -1,    scroll: 10,    isleft: "left",
+    loopval: -1,
+    scroll: 10,    
+    isleft: "left",
   },
   onInit(){
   },
@@ -163,7 +165,7 @@ export default {
   <div class="mymarquee">
     <marquee  style="color: {{color1}}" loop="{{loopval}}" scrollamount="{{scroll}}" direction="{{isleft}}" class="marqueetext" 
     id="testmarquee" onfinish="setfinish">
-      It's a racing lamp
+      Life is a journey, not the destination.
     </marquee>
   </div>
   <div style="width: 600px;height: 150px;flex-direction: row;justify-content: space-around;">

zh-cn/application-dev/ui/ui-js-components-search.md

@@ -62,7 +62,7 @@
 
 ## 添加样式
 
-通过color、placeholder和caret-color样式来设置搜索框的文本颜色、提示文本颜色和光标颜色。
+通过color、placeholder-color和caret-color样式来设置搜索框的文本颜色、提示文本颜色和光标颜色。
 
 
 ```html
@@ -84,7 +84,9 @@
   background-color: #F1F3F5;
 }
 search{
-  color: black;  placeholder-color: black;  caret-color: red;
+  color: black;
+  placeholder-color: black;
+  caret-color: red;
 }
 ```