/** * [rgbToHex 将rgb转换为hex] * @param {[type]} r [description] * @param {[type]} g [description] * @param {[type]} b [description] * @return {[type]} [description] */ function rgbToHex(r, g, b) { var hex = ((r << 16) | (g << 8) | b).toString(16); return "#" + new Array(Math.abs(hex.length - 7)).join("0") + hex; } /** * [hexToRgb 将hex转换为rgb] * @param {[type]} hex [description] * @return {[type]} [description] */ function hexToRgb(hex) { var rgb = []; for (var i = 1; i < 7; i += 2) { rgb.push(parseInt("0x" + hex.slice(i, i + 2))); } return rgb; } /** * [gradient 生成渐变颜色] * @param {[type]} startColor [description] * @param {[type]} endColor [description] * @param {[type]} step [description] * @return {[type]} [description] */ function gradient(startColor, endColor, step) { //将hex转换为rgb var sColor = hexToRgb(startColor), eColor = hexToRgb(endColor); //计算R\G\B每一步的差值 var rStep = (eColor[0] - sColor[0]) / step, gStep = (eColor[1] - sColor[1]) / step, bStep = (eColor[2] - sColor[2]) / step; var gradientColorArr = []; for (var i = 0; i < step; i++) { //计算每一步的hex值 gradientColorArr.push(rgbToHex(parseInt(rStep * i + sColor[0]), parseInt(gStep * i + sColor[1]), parseInt(bStep * i + sColor[2]))); } return gradientColorArr; } // var color = ['#4dc2ff', '#5fff7a', '#ffa662', '#7d9cef', '#00ffea']; var color = ['#0197d4', '#6dcaf3', '#066db7', '#15d7fa', '#00b0f0']; var data = [{ name: '企业画像', children: [{ name: '基本数据', value: 4, itemStyle: { color: color[0] }, children: [{ name: '社会统一\n信用代码', value: 1, itemStyle: { color: color[0] }, // 应用场景:金融贷款、政府扶持、税收征管、信用报告、政府招投标 children: [{ name: '金融贷款', value: 6, itemStyle: { color: color[4] } }, { name: '政府扶持', value: 7, itemStyle: { color: color[3] } }, { name: '税收征管', value: 6, itemStyle: { color: color[2] } }, { name: '信用报告', value: 7, itemStyle: { color: color[1] } }, { name: '政府招投标', value: 6, itemStyle: { color: color[0] } }] }, { name: '登记日期', value: 1, itemStyle: { color: color[1] }, }, { name: '法定代表人', value: 1, itemStyle: { color: color[2] } }, { name: '行业类型', value: 1, itemStyle: { color: color[3] } }] }, { name: '税收数据', value: 4, itemStyle: { color: color[1] }, children: [{ name: '所属日期起', value: 1, itemStyle: { color: color[0] } }, { name: '所属日期止', value: 1, itemStyle: { color: color[1] } }, { name: '应税销售收入', value: 1, itemStyle: { color: color[2] } }, { name: '入库税额', value: 1, itemStyle: { color: color[3] } }] }, { name: '欠税信息', value: 3, itemStyle: { color: color[2] }, children: [{ name: '增值税欠税金额', value: 1, itemStyle: { color: color[0] } }, { name: '消费税欠税金额', value: 1, itemStyle: { color: color[1] } }, { name: '所得税欠税金额', value: 1, itemStyle: { color: color[2] } }] }, { name: '行政处罚信息', value: 4, itemStyle: { color: color[3] }, children: [{ name: '案件名称', value: 1, itemStyle: { color: color[0] } }, { name: '行政处罚事由', value: 1, itemStyle: { color: color[1] } }, { name: '处罚金额', value: 1, itemStyle: { color: color[2] } }, { name: '处罚机关', value: 1, itemStyle: { color: color[3] } }] }, { name: '重大违法信息', value: 3, itemStyle: { color: color[4] }, children: [{ name: '案件性质', value: 1, itemStyle: { color: color[0] } }, { name: '主要违法事实', value: 1, itemStyle: { color: color[1] } }, { name: '处罚情况', value: 1, itemStyle: { color: color[2] } }] }, { name: '增值税申报信息', value: 3, itemStyle: { color: color[0] }, children: [{ name: '申报月份', value: 1, itemStyle: { color: color[2] } }, { name: '按适用税率\n计税销售额', value: 1, itemStyle: { color: color[2] } }, { name: '应补退税额', value: 1, itemStyle: { color: color[2] } }] }, { name: '缴税情况', value: 4, itemStyle: { color: color[1] }, children: [{ name: '属期起止', value: 1, itemStyle: { color: color[0] }, }, { name: '税款种类', value: 1, itemStyle: { color: color[1] } }, { name: '实缴时间', value: 1, itemStyle: { color: color[2] } }, { name: '实缴税额', value: 1, itemStyle: { color: color[3] } }] }, { name: '税务信用评级', value: 3, itemStyle: { color: color[2] }, children: [{ name: '信用级别', value: 1, itemStyle: { color: color[0] } }, { name: '信用评级年度', value: 1, itemStyle: { color: color[1] } }, { name: '信用评分分数', value: 1, itemStyle: { color: color[2] } }] }, { name: '所得税年\n度汇算清缴', value: 4, itemStyle: { color: color[3] }, children: [{ name: '年度', value: 1, itemStyle: { color: color[0] }, }, { name: '汇算清缴日期', value: 1, itemStyle: { color: color[1] } }, { name: '营业收入', value: 1, itemStyle: { color: color[2] } }, { name: '应纳所得税额', value: 1, itemStyle: { color: color[3] } }] }] }] // '#007ec7','#09b4dc'//'#25d7fa', '#066db7' var dc = data[0].children, color1 = gradient('#007ec7','#09b4dc', dc.length); for (var i = 0; i < dc.length; i++) { dc[i].itemStyle.color = color1[i]; var dcc = dc[i].children, color2 = gradient('#007ec7','#09b4dc', dcc.length); for (var j = 0; j < dcc.length; j++) { dcc[j].itemStyle.color = color2[j]; if (dcc[j].children) { var dccc = dcc[j].children, color3 = gradient('#007ec7','#09b4dc', dccc.length); for (var k = 0; k < dccc.length; k++) { dccc[k].itemStyle.color = color3[k]; } } } } option = { backgroundColor: '#01052a', toolbox: { show: true, feature: { dataView: { show: true, readOnly: false }, magicType: { show: true, type: ['line', 'bar'] }, restore: { show: true }, saveAsImage: { show: true } } }, color: color, series: { type: 'sunburst', highlightPolicy: 'ancestor', data: data, radius: [0, '90%'], sort: null, label: { rotate: 'radial', //formatter: '{b}: {@score}xxxx' }, levels: [{}, { r0: '0%', r: '12%', itemStyle: { align: 'right', borderWidth: 0, }, label: { // rotate: 0 rotate: 'tangential', } }, { r0: '21%', r: '42%', itemStyle: { align: 'center', borderWidth: 0 }, label: { align: 'center' } }, { r0: '45%', r: '70%', itemStyle: { borderWidth: 0 } }, { r0: '72%', r: '88%', label: { // position: 'outside', padding: 3, silent: false, textBorderWidth: 0 }, itemStyle: { borderWidth: 0 } }] } }