feat: 优先从10种初始颜色中获取随机颜色

This commit is contained in:
maxmon 2021-07-09 22:48:54 +08:00
parent ac9817acd3
commit e8a242f8d1
3 changed files with 46 additions and 18 deletions

View File

@ -101,16 +101,10 @@
</template>
<script>
import { getColor } from '../../js/color.js'
//
const isLocal = false
function getColor () {
const idxs = '0123456789abcdef'
let color = '#'
for (let i = 0; i < 6; i += 1) {
color += idxs[Math.random() * idxs.length | 0]
}
return color
}
function get (url, cb) {
query('GET', url, '', cb)
@ -376,7 +370,7 @@ export default {
if (!newType) return false
if (that.types[newType]) return false
that.$set(that.types, newType, {
color: getColor()
color: getColor(that.types)
})
that.typeList.push(newType)
updateType2Server(that.projectName, that.typeList, that.types)

View File

@ -61,14 +61,8 @@
</template>
<script>
function getColor () {
const idxs = '0123456789abcdef'
let color = '#'
for (let i = 0; i < 6; i += 1) {
color += idxs[Math.random() * idxs.length | 0]
}
return color
}
import { getColor } from '../../js/color'
function get (url, cb) {
query('GET', url, '', cb)
}
@ -197,7 +191,7 @@ export default {
if (!newType) return false
if (that.types[newType]) return false
that.$set(that.types, newType, {
color: getColor()
color: getColor(that.types)
})
that.typeList.push(newType)
console.log(that.typeList)

40
fe/src/js/color.js Normal file
View File

@ -0,0 +1,40 @@
const COLORS = [
'#e12d2d', // 红
'#f5a314', // 橙
'#fff838', // 黄
'#72ca2b', // 绿
'#529dff', // 蓝
'#647cf7', // 靛
'#a855ec', // 紫
'#eb98de', // 粉
'#c08c8e', // 褐
'#d2ff8f' // 青
]
function getColor (types = {}) {
const alreadyColorDic = {}
Object.keys(types).forEach(type => {
const { color } = types[type]
alreadyColorDic[color] = true
})
const remainingColors = []
COLORS.forEach(color => {
if (!alreadyColorDic[color]) remainingColors.push(color)
})
if (remainingColors.length) {
// 优先选用未选择的初始颜色
const idx = Math.random() * remainingColors.length | 0
return remainingColors[idx]
} else {
const idxs = '0123456789abcdef'
let color = '#'
for (let i = 0; i < 6; i += 1) {
color += idxs[Math.random() * idxs.length | 0]
}
return color
}
}
export {
getColor
}