通路详情图

• 基于Echrets封装的通路详情图

/**
 * 通路详情图
 * @param {*} id 当前选中容器
 * @param {*} seriesData 当前数据
 * @param {*} xData 当前x轴数据
 * @param {*} container 当前图表实例组合
 * 
 **/

  import { initAccessDetailsChart } from '~'

    const chartMap = new Map();
    // x轴分类信息
    let xData = [ 'SOS1', 'RIT1', 'RAPGGEF2', 'PDGFRB', 'PDGFRA', 'NTRK3', 'MARK1', 'KSR2', 'ARHGAP35', 'ABL1', 'NF1', 'EGFR', 'CBL', 'KRAS', 'KIT', 'PTPN11', 'NRAS', 'FLT3',];
    // mock图表需要的数据
    const seriesData = xData.map(item => {
      return {
        name: item,
        data: [] || new Array(100).fill(0).map(_ => Math.random() > 0.8), // 将柱状图分成100份 有值的地方填充true 没有值填充false
      };
    });

    let ArrayLength100 = new Array(100).fill(0);
        // mock数据 还原设计图
    xData.forEach((name,i)=>{
      if(i === 0){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 98?true:false)
      }else if(i === 1){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 90?true:false)
      }else if(i === 2){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 97?true:false)
      }else if(i === 3){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 71?true:false)
      }else if(i === 4){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 76?true:false)
      }else if(i === 5){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 96?true:false)
      }else if(i === 6){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 95?true:false)
      }else if(i === 7){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 94?true:false)
      }else if(i === 8){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 51?true:false)
      }else if(i === 9){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 92?true:false)
      }else if(i === 10){
        seriesData[i].data = ArrayLength100.map((_,index)=> index === 91?true:false)
      }else if(i === 11){
        seriesData[i].data = ArrayLength100.map((_,index)=> [89,90].includes(index) ? true:false)
      }else if(i === 12){
        seriesData[i].data = ArrayLength100.map((_,index)=> [87,88].includes(index) ? true:false)
      }else if(i === 13){
        seriesData[i].data = ArrayLength100.map((_,index)=> [60,86].includes(index) ? true:false)
      }else if(i === 14){
        seriesData[i].data = ArrayLength100.map((_,index)=> [80,81,82,83,84,85].includes(index) ? true:false)
      }else if(i === 15){
        seriesData[i].data = ArrayLength100.map((_,index)=> [74,75,76,77,78,79].includes(index) ? true:false)
      }else if(i === 16){
        seriesData[i].data = ArrayLength100.map((_,index)=> [66,67,68,69,70,71,72,73].includes(index) ? true:false)
      }else if(i === 17){
        seriesData[i].data = ArrayLength100.map((_,index)=> index<65 ? true:false)
      }
    })

    // 初始化通路详情图
    initAccessDetailsChart({ seriesData,xData,id:'accessDetails',chartMap })