uniapp ucharts接口数据处理

uniapp ucharts接口数据处理

项目需要进行环形图的数据更改

		<view class="subassembly-top">
			<uv-row>
				<uv-col span="1">

					<view class="icon-cstj1">
						<image src="../../../../static/fire/csfx-csfx-1.png" class="icon-cstj"></image>
					</view>
				</uv-col>
				<uv-col span="3">
					<view class="fxtj-zt">场所风险等级排行</view>
				</uv-col>

				<uv-col span="3">

				</uv-col>
				<uv-col span="3">
					<view class="csfx-wxcd">
						<view class="csfx-zt">
							<uv-picker ref="picker" :columns="columns" @confirm="confirm">
							</uv-picker>

							<button @click="openPicker" class="dj">高危
								<image src="../../../../static/workbench/xl.png" class="icon-csfx"></image>
							</button>

						</view>
					</view>
				</uv-col>
			</uv-row>
		</view>

js

let state1 = reactive({

	ringData: {
		series: [{
			data: [{
					"name": "高危:",
					"value": 16,
					"labelText": "高危:16(12%)"

				},
				{
					"name": "危险",
					"value": 29,
					"labelText": "危险:30(28%)"
				},
				{
					"name": "一般",
					"value": 68,
					"labelText": "一般:68(47%)"
				},
				{
					"name": "良好",
					"value": 23,
					"labelText": "良好:68(29%)"
				},
				{
					"name": "暂无等级",
					"value": 23,
					"labelText": "暂无等级:23(29%)"
				},
			]

		}],
	},
	ringOpt: {
		rotate: false,
		rotateLock: false,
		color: ['#E54949', '#FABE4F', '#69A2FC ', '#6CCEB1', '#CECECE'],
		padding: [5, 5, 5, 5],
		dataLabel: true,
		enableScroll: false,

		legend: {
			show: true,
			position: "bottom",
			lineHeight: 25
		},
		title: {
			name: '200',
			fontSize: 30,
			color: '#000000'
		},
		subtitle: {
			name: '场所总数',
			fontSize: 15,
			color: '#666666',
		},
		extra: {
			ring: {
				customRadius: 100,
				ringWidth: 35,
				offsetAngle: 0,
				labelWidth: 10,
				border: true,
				borderWidth: 3,
				borderColor: '#FFFFFF'
			}
		}
	},

})

把原有的数据标签(name之类的)改成自己想要的标签

/**
* @description: 风险等级分布
* @return {*}
*/
const getPlanceRelease = async () => {

	const data = {
		orgName: state.orgName,
		startTime: state.startDate,
		// type: state.statusSwitch ? '1' : '2',
	}
	console.log(data)
	if (state.tagValue != 0) {
		data.placeCategory = state.tagValue
	}
	let res = await StatisticsListApi.getPlanceRelease(data)
	if(res.code === 200) {
		const arr = []
		res.data.riskCount.forEach((item, index) => {
			const riskLevel = ['高危', '危险', '一般', '良好', '暂无等级']
			const obj = {
				name: riskLevel[index],
				value: item.riskCount,
				labelText: item.percentage
			}
			arr.push((obj))
		})
		console.log(arr,'999999')
		state1.ringData.series[0].data = arr
	}

}

如何改变文本的样式

重要代码
name: riskLevel[index],
value: item.riskCount,
labelText: item.percentage

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值