|
|
@@ -223,6 +223,27 @@
|
|
|
<el-form-item label="图形标记">
|
|
|
<el-input clearable type="string" v-model="inHourDataOption.legend.data" size="small" placeholder="请输入图形标记"></el-input>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="雷达范围">
|
|
|
+ <el-input clearable v-model="distList" @change="change" size="small" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="边线颜色">
|
|
|
+ <el-input clearable type="string" v-model="inHourDataOption.series[0].lineStyle.color" size="small" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="边线宽度">
|
|
|
+ <el-input clearable type="string" v-model="inHourDataOption.series[0].lineStyle.width" size="small" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="折点颜色">
|
|
|
+ <el-input clearable type="string" v-model="inHourDataOption.series[0].itemStyle.color" size="small" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="折点大小">
|
|
|
+ <el-input clearable type="string" v-model="inHourDataOption.series[0].itemStyle.borderWidth" size="small" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="幕布颜色">
|
|
|
+ <el-input clearable type="string" v-model="inHourDataOption.series[0].areaStyle.color" size="small" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="幕布透明">
|
|
|
+ <el-input clearable type="string" v-model="inHourDataOption.series[0].areaStyle.opacity" size="small" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
</el-drawer>
|
|
|
@@ -507,6 +528,7 @@ const radarOption = {
|
|
|
{ name: 'Information Technology', max: 30000 },
|
|
|
{ name: 'Customer Support', max: 38000 },
|
|
|
{ name: 'Development', max: 52000 },
|
|
|
+ { name: 'Marketing', max: 25000 },
|
|
|
{ name: 'Marketing', max: 25000 }
|
|
|
]
|
|
|
},
|
|
|
@@ -514,6 +536,20 @@ const radarOption = {
|
|
|
{
|
|
|
name: 'Budget vs spending',
|
|
|
type: 'radar',
|
|
|
+ lineStyle: {
|
|
|
+ //边缘颜色
|
|
|
+ width: 1,
|
|
|
+ color: 'black',
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ borderWidth: 1,
|
|
|
+ color: 'yellow',
|
|
|
+ borderColor: '#F2F063',
|
|
|
+ },
|
|
|
+ areaStyle: {
|
|
|
+ color: 'red',
|
|
|
+ opacity: 0.1,
|
|
|
+ },
|
|
|
data: [
|
|
|
{
|
|
|
value: [4200, 3000, 20000, 35000, 50000, 18000],
|
|
|
@@ -591,6 +627,7 @@ export default {
|
|
|
v: 'center',
|
|
|
k: '里'
|
|
|
}],
|
|
|
+ distList: JSON.stringify(this._.cloneDeep(radarOption).radar.indicator)
|
|
|
}
|
|
|
},
|
|
|
components: {
|
|
|
@@ -598,6 +635,14 @@ export default {
|
|
|
BarChartsr
|
|
|
},
|
|
|
watch: {
|
|
|
+ // distList: {
|
|
|
+ // handler (val) {
|
|
|
+ // console.log()
|
|
|
+ // // this.inHourDataOption.radar.indicator = val
|
|
|
+ // },
|
|
|
+ // deep: true,
|
|
|
+ // immediate: true,
|
|
|
+ // },
|
|
|
tableForm: {
|
|
|
handler (val) {
|
|
|
if (val.parenttype == '折线图') {
|
|
|
@@ -618,12 +663,19 @@ export default {
|
|
|
immediate: true,
|
|
|
},
|
|
|
},
|
|
|
+ computed: {
|
|
|
+ // distList () {
|
|
|
+ // return JSON.stringify(this.inHourDataOption.radar.indicator)
|
|
|
+ // }
|
|
|
+ },
|
|
|
mounted() {
|
|
|
// this.inHourDataOption.series[0].areaStyle = null
|
|
|
// console.log(this.inHourDataOption.series[0].areaStyle)
|
|
|
},
|
|
|
methods: {
|
|
|
-
|
|
|
+ change(e) {
|
|
|
+ this.inHourDataOption.radar.indicator = JSON.parse(e)
|
|
|
+ }
|
|
|
}
|
|
|
};
|
|
|
</script>
|
