You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2020/06/15 15:53:14 UTC
[incubator-echarts-doc] branch live-example updated: example:
locate to the property after panel opened.
This is an automated email from the ASF dual-hosted git repository.
shenyi pushed a commit to branch live-example
in repository https://gitbox.apache.org/repos/asf/incubator-echarts-doc.git
The following commit(s) were added to refs/heads/live-example by this push:
new 1e8380c example: locate to the property after panel opened.
1e8380c is described below
commit 1e8380c4064094ba31de58dd807784d6860fd0b2
Author: pissang <bm...@gmail.com>
AuthorDate: Mon Jun 15 23:51:45 2020 +0800
example: locate to the property after panel opened.
---
src/components/DocContent.vue | 1 +
src/components/DocContentItemCard.vue | 15 +++++++++++--
src/controls/ControlPercent.vue | 41 ++++++++++++++++++++++++-----------
zh/option/partial/barGrid.md | 5 +++--
4 files changed, 45 insertions(+), 17 deletions(-)
diff --git a/src/components/DocContent.vue b/src/components/DocContent.vue
index 3b9031b..433f91b 100644
--- a/src/components/DocContent.vue
+++ b/src/components/DocContent.vue
@@ -22,6 +22,7 @@
:desc-map="pageDescMap"
:max-depth="maxDepth"
:depth="1"
+ @scroll-to-self="scrollTo"
@toggle-expanded="handleCardExpandToggle"
></DocContentItemCard>
</div>
diff --git a/src/components/DocContentItemCard.vue b/src/components/DocContentItemCard.vue
index e6bea75..d7a65b7 100644
--- a/src/components/DocContentItemCard.vue
+++ b/src/components/DocContentItemCard.vue
@@ -58,7 +58,8 @@
:desc-map="descMap"
:depth="depth + 1"
:max-depth="maxDepth"
- @toggle-expanded="bubbleEvent"
+ @toggle-expanded="bubbleEventToggleExapndedEvent"
+ @scroll-to-self="bubbleScrollToSelfEvent"
></DocContentItemCard>
</div>
<PropertiesList
@@ -108,6 +109,12 @@ export default {
));
}
else {
+ // Let container scroll to the path because layout may be changed
+ // after control is open.
+ if (!this.shared.showOptionExample) {
+ this.$emit('scroll-to-self', this.nodeData.path, 300, 100);
+ }
+
this.shared.showOptionExample = true;
}
}
@@ -179,12 +186,16 @@ export default {
},
methods: {
- bubbleEvent() {
+ bubbleEventToggleExapndedEvent() {
this.$emit('toggle-expanded');
},
toggleExpanded() {
this.manualExpanded = !this.expanded;
this.$emit('toggle-expanded');
+ },
+
+ bubbleScrollToSelfEvent(path, time, delay) {
+ this.$emit('scroll-to-self', path, time, delay);
}
}
}
diff --git a/src/controls/ControlPercent.vue b/src/controls/ControlPercent.vue
index e656d94..56af0b6 100644
--- a/src/controls/ControlPercent.vue
+++ b/src/controls/ControlPercent.vue
@@ -1,34 +1,49 @@
<template>
<div class="control-percent">
- <el-slider
- v-model="innerValue"
- :min="min == null ? 0 : +min"
- :max="max == null ? 100 : +max"
- :step="step == null ? 1 : +step"
- :format-tooltip="formatTooltip"
- @change="onValueChange"
- ></el-slider>
<el-input-number
+ v-if="absoluteMode"
controls-position="right"
- v-model="innerValue"
+ v-model="absoluteValue"
size="mini"
- :min="min == null ? 0 : +min"
- :max="max == null ? 100 : +max"
+ :min="min == null ? -1e4 : +min"
+ :max="max == null ? 1e4 : +max"
:step="step == null ? 1 : +step"
@change="onValueChange"
>
</el-input-number>
+ <div v-else>
+ <el-slider
+ v-model="innerValue"
+ :min="0"
+ :max="100"
+ :step="1"
+ :format-tooltip="formatTooltip"
+ @change="onValueChange"
+ ></el-slider>
+ <el-input-number
+ controls-position="right"
+ v-model="innerValue"
+ size="mini"
+ :min="0"
+ :max="100"
+ :step="1"
+ @change="onValueChange"
+ >
+ </el-input-number>
+ </div>
</div>
</template>
<script>
export default {
- props: ['value', 'min', 'max', 'step'],
+ props: ['value', 'min', 'max', 'absolute', 'step'],
data() {
return {
- innerValue: +this.value.replace('%', '')
+ innerValue: +this.value.replace('%', ''),
+ absoluteValue: 0,
+ absoluteMode: this.value.indexOf('%') >= 0
}
},
diff --git a/zh/option/partial/barGrid.md b/zh/option/partial/barGrid.md
index 94b56a6..6674639 100644
--- a/zh/option/partial/barGrid.md
+++ b/zh/option/partial/barGrid.md
@@ -1,3 +1,4 @@
+
{{target:partial-barGrid}}
## barWidth(number|string) = 自适应
@@ -34,7 +35,7 @@
## barGap(string) = ${barGapDefault|default('30%')}
-<ExampleUIControlPercent default="30" min="-100" max="100" />
+<ExampleUIControlPercent default="30%"/>
不同系列的柱间距离，为百分比（如 `'30%'`，表示柱子宽度的 `30%`）。
@@ -47,7 +48,7 @@
## barCategoryGap(string) = '20%'
-<ExampleUIControlPercent default="20" min="-100" max="100" />
+<ExampleUIControlPercent default="20%"/>
同一系列的柱间距离，默认为类目间距的20%，可设固定值
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org