2021-06-10

king

2021-06-10 5cfe6db94c1449810a44660b299dba8e7e98e5c5

2021-06-10

 src/menu/components/chart/antv-bar/chartcompile/formconfig.jsx

@@ -162,6 +162,28 @@
  let xfields = columns.filter(item => /^Nvarchar/ig.test(item.datatype))
  let yfields = columns.filter(item => /^(Int|Decimal)/ig.test(item.datatype))

  let labelOptions = [{
    value: 'false',
    text: '隐藏'
  }, {
    value: 'true',
    text: '显示'
  }]

  if (card.chartType === 'bar') {
    labelOptions[1].text = '外部'
    labelOptions.push(...[{
      value: 'top',
      text: '顶部'
    }, {
      value: 'middle',
      text: '中间'
    }, {
      value: 'bottom',
      text: '底部'
    }])
  }

  return [
    {
      type: 'radio',
@@ -289,17 +311,25 @@
        text: '百分比'
      }]
    }, {
      type: 'radio',
      type: labelOptions.length > 2 ? 'select' : 'radio',
      key: 'label',
      label: '标注值',
      label: '标签',
      initVal: card.label || 'false',
      required: false,
      options: labelOptions
    }, {
      type: 'radio',
      key: 'labelColor',
      label: '标签颜色',
      initVal: card.labelColor || 'system',
      tooltip: '使用系统色时，使用色系选项设置的系统颜色，使用自定义为颜色设置中定义的图形颜色。',
      required: false,
      options: [{
        value: 'true',
        text: '显示'
        value: 'system',
        text: '系统'
      }, {
        value: 'false',
        text: '隐藏'
        value: 'custom',
        text: '自定义'
      }]
    // }, {
    //   type: 'radio',

 src/menu/components/chart/antv-bar/index.jsx

@@ -333,15 +333,20 @@
      } else {
        _chart.color('key')
      }
      if (plot.label === 'true') {
        _chart.label('value', (value) => {
      if (plot.label !== 'false') {
        _chart.label('value*key', (value, key) => {
          if (plot.show === 'percent') {
            value = value + '%'
          }
          let _color = color

          if (plot.labelColor === 'custom' && colors.has(key)) {
            _color = colors.get(key)
          }
          return {
            content: value,
            style: {
              fill: color
              fill: _color
            }
          }
        })
@@ -540,6 +545,27 @@
    chart.scale({
      nice: true
    })

    let lablecfg = {
      position: 'top',
      offset: 2,
      style: {
        fill: '#fff'
      }
    }

    if (plot.label === 'top') {
      lablecfg.offset = -5
      lablecfg.style.textBaseline = 'top'
    } else if (plot.label === 'middle') {
      lablecfg.position = 'middle'
      lablecfg.offset = 0
    } else if (plot.label === 'bottom') {
      lablecfg.position = 'bottom'
      lablecfg.offset = 0
    } else if (plot.label === 'true') {
      lablecfg.style.fill = color
    }
    
    if (Bar_axis.length) {
      const view1 = chart.createView({
@@ -609,16 +635,18 @@
        } else {
          _chart.color('key')
        }
        if (plot.label === 'true') {
          _chart.label('value', (value) => {
        if (plot.label !== 'false') {
          _chart.label('value*key', (value, key) => {
            if (plot.show === 'percent') {
              value = value + '%'
            }

            if (plot.label === 'true' && plot.labelColor === 'custom' && colors.has(key)) {
              lablecfg.style.fill = colors.get(key)
            }
            return {
              content: value,
              style: {
                fill: color
              }
              ...lablecfg
            }
          })
        }
@@ -658,16 +686,19 @@
        } else {
          _chart.color('key')
        }
        if (plot.label === 'true') {
          _chart.label('value', (value) => {
        if (plot.label !== 'false') {
          _chart.label('value*key', (value, key) => {
            if (plot.show === 'percent') {
              value = value + '%'
            }

            if (plot.label === 'true' && plot.labelColor === 'custom' && colors.has(key)) {
              lablecfg.style.fill = colors.get(key)
            }

            return {
              content: value,
              style: {
                fill: color
              }
              ...lablecfg
            }
          })
        }
@@ -720,16 +751,18 @@
        if (plot.barSize) {
          _chart.size(plot.barSize || 35)
        }
        if (item.label === 'true') {
        if (item.label !== 'false') {
          _chart.label(item.name, (value) => {
            if (plot.show === 'percent') {
              value = value + '%'
            }

            if (plot.label === 'true' && plot.labelColor === 'custom') {
              lablecfg.style.fill = item.color
            }
            return {
              content: value,
              style: {
                fill: color
              }
              ...lablecfg
            }
          })
        }
@@ -761,15 +794,20 @@
            }
          })

        if (item.label === 'true') {
        if (item.label !== 'false') {
          _chart.label(item.name, (value) => {
            if (plot.show === 'percent') {
              value = value + '%'
            }
            let _color = color

            if (plot.labelColor === 'custom') {
              _color = item.color
            }
            return {
              content: value,
              style: {
                fill: color
                fill: _color
              }
            }
          })
@@ -876,10 +914,6 @@
        })
      }
  
      if (plot.transpose === 'true') {
        chart.coordinate().transpose()
      }
  
      if (plot.coordinate === 'polar') {
        chart.coordinate('polar', {
          innerRadius: 0.1,
@@ -889,6 +923,45 @@

      let colors = new Map()
      let colorIndex = 0
      let lablecfg = {
        position: 'top',
        offset: 2,
        style: {
          fill: '#fff'
        }
      }

      if (plot.label === 'top') {
        lablecfg.offset = -5
        lablecfg.style.textBaseline = 'top'
      } else if (plot.label === 'middle') {
        lablecfg.position = 'middle'
        lablecfg.offset = 0
      } else if (plot.label === 'bottom') {
        lablecfg.position = 'bottom'
        lablecfg.offset = 0
      } else if (plot.label === 'true') {
        lablecfg.style.fill = color
      }

      if (plot.transpose === 'true') {
        chart.coordinate().transpose()
        if (plot.label === 'top') {
          delete lablecfg.style.textBaseline
          lablecfg.position = 'right'
          lablecfg.offset = -3
          lablecfg.style.textAlign = 'end'
        } else if (plot.label === 'middle') {
          lablecfg.position = 'middle'
          lablecfg.offset = 0
        } else if (plot.label === 'bottom') {
          lablecfg.position = 'left'
          lablecfg.offset = 2
        } else if (plot.label === 'true') {
          lablecfg.position = 'right'
          lablecfg.offset = 2
        }
      }

      if (plot.colors && plot.colors.length > 0) {
        if (plot.ramp === 'true') {
@@ -940,16 +1013,19 @@
        } else {
          _chart.color('key')
        }
        if (plot.label === 'true') {
          _chart.label('value', (value) => {
        if (plot.label !== 'false') {
          _chart.label('value*key', (value, key) => {
            if (plot.show === 'percent') {
              value = value + '%'
            }

            if (plot.label === 'true' && plot.labelColor === 'custom' && colors.has(key)) {
              lablecfg.style.fill = colors.get(key)
            }
            
            return {
              content: value,
              style: {
                fill: color
              }
              ...lablecfg
            }
          })
        }
@@ -998,16 +1074,18 @@
        } else {
          _chart.color('key')
        }
        if (plot.label === 'true') {
          _chart.label('value', (value) => {
        if (plot.label !== 'false') {
          _chart.label('value*key', (value, key) => {
            if (plot.show === 'percent') {
              value = value + '%'
            }

            if (plot.label === 'true' && plot.labelColor === 'custom' && colors.has(key)) {
              lablecfg.style.fill = colors.get(key)
            }
            return {
              content: value,
              style: {
                fill: color
              }
              ...lablecfg
            }
          })
        }

 src/menu/components/chart/antv-dashboard/index.jsx

@@ -156,9 +156,12 @@
  }

  componentDidMount () {
    this.viewrender()
    MKEmitter.addListener('tabsChange', this.handleTabsChange)
    MKEmitter.addListener('submitStyle', this.getStyle)

    setTimeout(() => {
      this.viewrender()
    }, 1000)
  }

  shouldComponentUpdate (nextProps, nextState) {

 src/menu/components/chart/antv-pie/chartcompile/formconfig.jsx

@@ -251,7 +251,7 @@
    {
      type: 'radio',
      key: 'label',
      label: '标注值',
      label: '标签',
      initVal: card.label || 'false',
      required: false,
      options: [{
@@ -262,7 +262,10 @@
        text: '内侧'
      }, {
        value: 'outer',
        text: '外侧'
        text: '蜘蛛'
      }, {
        value: 'normal',
        text: '常规'
      }],
    }, {
      type: 'radio',

 src/menu/components/chart/antv-pie/index.jsx

@@ -112,9 +112,12 @@
  }

  componentDidMount () {
    this.pierender()
    MKEmitter.addListener('tabsChange', this.handleTabsChange)
    MKEmitter.addListener('submitStyle', this.getStyle)

    setTimeout(() => {
      this.viewrender()
    }, 1000)
  }

  shouldComponentUpdate (nextProps, nextState) {
@@ -142,7 +145,17 @@
      }

      this.$timer && clearTimeout(this.$timer)
      this.$timer = setTimeout(this.pierender, 100)
      this.$timer = setTimeout(this.viewrender, 100)
    }
  }

  viewrender = () => {
    const { card } = this.state

    if (card.plot.shape === 'nest') {
      this.nestrender()
    } else {
      this.pierender()
    }
  }

@@ -349,19 +362,13 @@
        chart2.label(Y_axis, {
          offset: -30,
          content: (data) => {
            let _label = ''
            let _val = ''
            if (plot.show !== 'value') {
              _val = `${(data[Y_axis] * 100).toFixed(2)}%`
            } else {
              _val = `${data[Y_axis]}`
            }
            if (plot.label === 'inner') {
              _label = _val
            } else {
              _label = `${data[X_axis]}: ${_val}`
            }
            return _label
            return _val
          },
          style: {
            textAlign: 'center',
@@ -373,22 +380,17 @@
        })
      } else {
        chart2.label(Y_axis, {
          layout: { type: 'pie-spider' },
          layout: { type: plot.label === 'outer' ? 'pie-spider' : 'fixed-overlap' },
          labelHeight: 20,
          content: (data) => {
            let _label = ''
            let _val = ''
            if (plot.show !== 'value') {
              _val = `${(data[Y_axis] * 100).toFixed(2)}%`
            } else {
              _val = `${data[Y_axis]}`
            }
            if (plot.label === 'inner') {
              _label = _val
            } else {
              _label = `${data[X_axis]}: ${_val}`
            }
            return _label

            return `${data[X_axis]}: ${_val}`
          },
          labelLine: {
            style: {
@@ -414,11 +416,6 @@
  pierender = () => {
    const { card } = this.state
    const plot = card.plot

    if (plot.shape === 'nest') {
      this.nestrender()
      return
    }

    let color = plot.color || 'rgba(0, 0, 0, 0.85)'
    let X_axis = plot.Xaxis || 'x'
@@ -530,19 +527,13 @@
          _chart.label(Y_axis, {
            offset: -30,
            content: (data) => {
              let _label = ''
              let _val = ''
              if (plot.show !== 'value') {
                _val = `${(data[Y_axis] * 100).toFixed(2)}%`
              } else {
                _val = `${data[Y_axis]}`
              }
              if (plot.label === 'inner') {
                _label = _val
              } else {
                _label = `${data[X_axis]}: ${_val}`
              }
              return _label
              return _val
            },
            style: {
              textAlign: 'center',
@@ -554,22 +545,17 @@
          })
        } else {
          _chart.label(Y_axis, {
            layout: { type: 'pie-spider' },
            layout: { type: plot.label === 'outer' ? 'pie-spider' : 'fixed-overlap' },
            labelHeight: 20,
            content: (data) => {
              let _label = ''
              let _val = ''
              if (plot.show !== 'value') {
                _val = `${(data[Y_axis] * 100).toFixed(2)}%`
              } else {
                _val = `${data[Y_axis]}`
              }
              if (plot.label === 'inner') {
                _label = _val
              } else {
                _label = `${data[X_axis]}: ${_val}`
              }
              return _label

              return `${data[X_axis]}: ${_val}`
            },
            labelLine: {
              style: {
@@ -628,7 +614,7 @@
      }
      this.$timer && clearTimeout(this.$timer)
      this.$timer = setTimeout(() => {
        this.pierender()
        this.viewrender()
      }, 150)
    }


 src/tabviews/custom/components/chart/antv-bar-line/index.jsx

@@ -1054,6 +1054,27 @@
      nice: true
    })

    let lablecfg = {
      position: 'top',
      offset: 2,
      style: {
        fill: '#fff'
      }
    }

    if (plot.label === 'top') {
      lablecfg.offset = -5
      lablecfg.style.textBaseline = 'top'
    } else if (plot.label === 'middle') {
      lablecfg.position = 'middle'
      lablecfg.offset = 0
    } else if (plot.label === 'bottom') {
      lablecfg.position = 'bottom'
      lablecfg.offset = 0
    } else if (plot.label === 'true') {
      lablecfg.style.fill = plot.color
    }

    if (plot.Bar_axis) {
      const view1 = chart.createView({
        region: {
@@ -1126,15 +1147,17 @@
          _chart.color('key')
        }
        if (plot.label === 'true') {
          _chart.label('value', (value) => {
          _chart.label('value*key', (value, key) => {
            if (plot.show === 'percent') {
              value = value + '%'
            }

            if (plot.label === 'true' && plot.labelColor === 'custom' && plot.$colors && plot.$colors.has(key)) {
              lablecfg.style.fill = plot.$colors.get(key)
            }
            return {
              content: value,
              style: {
                fill: plot.color
              }
              ...lablecfg
            }
          })
        }
@@ -1175,15 +1198,16 @@
          _chart.color('key')
        }
        if (plot.label === 'true') {
          _chart.label('value', (value) => {
          _chart.label('value*key', (value, key) => {
            if (plot.show === 'percent') {
              value = value + '%'
            }
            if (plot.label === 'true' && plot.labelColor === 'custom' && plot.$colors && plot.$colors.has(key)) {
              lablecfg.style.fill = plot.$colors.get(key)
            }
            return {
              content: value,
              style: {
                fill: plot.color
              }
              ...lablecfg
            }
          })
        }
@@ -1236,11 +1260,12 @@
            if (plot.show === 'percent') {
              value = value + '%'
            }
            if (plot.label === 'true' && plot.labelColor === 'custom' && item.color) {
              lablecfg.style.fill = item.color
            }
            return {
              content: value,
              style: {
                fill: plot.color
              }
              ...lablecfg
            }
          })
        }
@@ -1410,10 +1435,44 @@
      })
    }

    let offset = {offsetY: 5}
    let lablecfg = {
      position: 'top',
      offset: 2,
      style: {
        fill: '#fff'
      }
    }

    if (plot.label === 'top') {
      lablecfg.offset = -5
      lablecfg.style.textBaseline = 'top'
    } else if (plot.label === 'middle') {
      lablecfg.position = 'middle'
      lablecfg.offset = 0
    } else if (plot.label === 'bottom') {
      lablecfg.position = 'bottom'
      lablecfg.offset = 0
    } else if (plot.label === 'true') {
      lablecfg.style.fill = plot.color
    }

    if (plot.transpose === 'true') {
      chart.coordinate().transpose()
      offset = {offsetY: 0, offsetX: -10}
      if (plot.label === 'top') {
        delete lablecfg.style.textBaseline
        lablecfg.position = 'right'
        lablecfg.offset = -3
        lablecfg.style.textAlign = 'end'
      } else if (plot.label === 'middle') {
        lablecfg.position = 'middle'
        lablecfg.offset = 0
      } else if (plot.label === 'bottom') {
        lablecfg.position = 'left'
        lablecfg.offset = 2
      } else if (plot.label === 'true') {
        lablecfg.position = 'right'
        lablecfg.offset = 2
      }
    }

    if (plot.coordinate === 'polar') {
@@ -1455,16 +1514,18 @@
        _chart.color(_typefield)
      }
      if (plot.label === 'true') {
        _chart.label(_valfield, (value) => {
        _chart.label(`${_valfield}*${_typefield}`, (value, key) => {
          if (plot.show === 'percent') {
            value = value + '%'
          }

          if (plot.label === 'true' && plot.labelColor === 'custom' && plot.$colors && plot.$colors.has(key)) {
            lablecfg.style.fill = plot.$colors.get(key)
          }

          return {
            content: value,
            style: {
              fill: plot.color
            },
            ...offset
            ...lablecfg
          }
        })
      }
@@ -1511,15 +1572,18 @@
        _chart.color(_typefield)
      }
      if (plot.label === 'true') {
        _chart.label(_valfield, (value) => {
        _chart.label(`${_valfield}*${_typefield}`, (value, key) => {
          if (plot.show === 'percent') {
            value = value + '%'
          }

          if (plot.label === 'true' && plot.labelColor === 'custom' && plot.$colors && plot.$colors.has(key)) {
            lablecfg.style.fill = plot.$colors.get(key)
          }

          return {
            content: value,
            style: {
              fill: plot.color
            }
            ...lablecfg
          }
        })
      }

 src/tabviews/custom/components/chart/antv-pie/index.jsx

@@ -207,11 +207,18 @@
  }

  handleData = () => {
    let _element = document.getElementById(this.state.chartId)
    const { plot, chartId } = this.state
    
    let _element = document.getElementById(chartId)
    if (_element) {
      _element.innerHTML = ''
    }
    this.pierender()

    if (plot.shape === 'nest') {
      this.nestrender()
    } else {
      this.pierender()
    }
  }

  async loadData (hastimer) {
@@ -682,19 +689,13 @@
        chart2.label(Y_axis, {
          offset: -30,
          content: (data) => {
            let _label = ''
            let _val = ''
            if (plot.show !== 'value') {
              _val = `${(data[Y_axis] * 100).toFixed(2)}%`
            } else {
              _val = `${data[Y_axis]}`
            }
            if (plot.label === 'inner') {
              _label = _val
            } else {
              _label = `${data[X_axis]}: ${_val}`
            }
            return _label
            return _val
          },
          style: {
            textAlign: 'center',
@@ -706,22 +707,17 @@
        })
      } else {
        chart2.label(Y_axis, {
          layout: { type: 'pie-spider' },
          layout: { type: plot.label === 'outer' ? 'pie-spider' : 'fixed-overlap' },
          labelHeight: 20,
          content: (data) => {
            let _label = ''
            let _val = ''
            if (plot.show !== 'value') {
              _val = `${(data[Y_axis] * 100).toFixed(2)}%`
            } else {
              _val = `${data[Y_axis]}`
            }
            if (plot.label === 'inner') {
              _label = _val
            } else {
              _label = `${data[X_axis]}: ${_val}`
            }
            return _label

            return `${data[X_axis]}: ${_val}`
          },
          labelLine: {
            style: {
@@ -747,11 +743,6 @@
   */
  pierender = () => {
    const { plot, chartId } = this.state

    if (plot.shape === 'nest') {
      this.nestrender()
      return
    }

    let color = plot.color

@@ -898,7 +889,7 @@
          })
        } else {
          _chart.label(Y_axis, {
            layout: { type: 'pie-spider' },
            layout: { type: plot.label === 'outer' ? 'pie-spider' : 'fixed-overlap' },
            labelHeight: 20,
            content: (data) => {
              let _val = ''