fix line config

This commit is contained in:
Qiuxia Fan 2022-03-18 11:43:13 +08:00
parent c1bd2950ee
commit d01631ef04
6 changed files with 39 additions and 5 deletions

View File

@ -106,6 +106,8 @@ const msg = {
no: "No", no: "No",
tableHeaderCol1: "Name of the first column of the table", tableHeaderCol1: "Name of the first column of the table",
tableHeaderCol2: "Name of the second column of the table", tableHeaderCol2: "Name of the second column of the table",
showXAxis: "Show X Axis",
showYAxis: "Show Y Axis",
hourTip: "Select Hour", hourTip: "Select Hour",
minuteTip: "Select Minute", minuteTip: "Select Minute",
secondTip: "Select Second", secondTip: "Select Second",

View File

@ -106,6 +106,8 @@ const msg = {
no: "否", no: "否",
tableHeaderCol1: "表格的第一列的名称", tableHeaderCol1: "表格的第一列的名称",
tableHeaderCol2: "表格的第二列的名称", tableHeaderCol2: "表格的第二列的名称",
showXAxis: "显示X轴",
showYAxis: "显示Y轴",
hourTip: "选择小时", hourTip: "选择小时",
minuteTip: "选择分钟", minuteTip: "选择分钟",
secondTip: "选择秒数", secondTip: "选择秒数",

View File

@ -31,7 +31,13 @@ limitations under the License. -->
:is="dashboardStore.selectedGrid.graph.type" :is="dashboardStore.selectedGrid.graph.type"
:intervalTime="appStoreWithOut.intervalTime" :intervalTime="appStoreWithOut.intervalTime"
:data="states.source" :data="states.source"
:config="dashboardStore.selectedGrid" :config="{
...dashboardStore.selectedGrid.graph,
i: dashboardStore.selectedGrid.i,
metrics: dashboardStore.selectedGrid.metrics,
metricTypes: dashboardStore.selectedGrid.metricTypes,
standard: dashboardStore.selectedGrid.standard,
}"
/> />
<div v-show="!dashboardStore.selectedGrid.graph.type" class="no-data"> <div v-show="!dashboardStore.selectedGrid.graph.type" class="no-data">
{{ t("noData") }} {{ t("noData") }}

View File

@ -13,6 +13,24 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and See the License for the specific language governing permissions and
limitations under the License. --> limitations under the License. -->
<template> <template>
<div>
<span class="label">{{ t("showXAxis") }}</span>
<el-switch
v-model="selectedGrid.graph.showXAxis"
active-text="Yes"
inactive-text="No"
@change="updateConfig({ showXAxis: selectedGrid.graph.showXAxis })"
/>
</div>
<div>
<span class="label">{{ t("showYAxis") }}</span>
<el-switch
v-model="selectedGrid.graph.showYAxis"
active-text="Yes"
inactive-text="No"
@change="updateConfig({ showYAxis: selectedGrid.graph.showYAxis })"
/>
</div>
<div> <div>
<span class="label">{{ t("smooth") }}</span> <span class="label">{{ t("smooth") }}</span>
<el-switch <el-switch

View File

@ -87,11 +87,15 @@ export const DefaultGraphConfig: { [key: string]: any } = {
type: "EndpointList", type: "EndpointList",
dashboardName: "", dashboardName: "",
fontSize: 12, fontSize: 12,
showXAxis: false,
showYAxis: false,
}, },
ServiceList: { ServiceList: {
type: "ServiceList", type: "ServiceList",
dashboardName: "", dashboardName: "",
fontSize: 12, fontSize: 12,
showXAxis: false,
showYAxis: false,
}, },
HeatMap: { HeatMap: {
type: "HeatMap", type: "HeatMap",

View File

@ -37,6 +37,8 @@ const props = defineProps({
smooth: false, smooth: false,
showSymbol: false, showSymbol: false,
opacity: 0.4, opacity: 0.4,
showXAxis: true,
showYAxis: true,
}), }),
}, },
}); });
@ -76,11 +78,11 @@ function getOption() {
]), ]),
name: i, name: i,
type: "line", type: "line",
symbol: "none", symbol: "circle",
barMaxWidth: 10, barMaxWidth: 10,
step: props.config.step, step: props.config.step,
smooth: props.config.smooth, smooth: props.config.smooth,
showSymbol: true, showSymbol: props.config.showSymbol,
lineStyle: { lineStyle: {
width: 1.5, width: 1.5,
type: "solid", type: "solid",
@ -173,7 +175,7 @@ function getOption() {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
show: true, show: props.config.showXAxis,
axisTick: { axisTick: {
lineStyle: { color: "#c1c5ca41" }, lineStyle: { color: "#c1c5ca41" },
alignWithLabel: true, alignWithLabel: true,
@ -190,7 +192,7 @@ function getOption() {
axisLabel: { axisLabel: {
color: "#9da5b2", color: "#9da5b2",
fontSize: "11", fontSize: "11",
show: true, show: props.config.showYAxis,
}, },
}, },
series: temp, series: temp,