[GitHub] EzioReturner commented on issue #8975: custom类别的图形 双Y轴位置异常

[GitBox <gi...@apache.org>]

EzioReturner commented on issue #8975: custom类别的图形 双Y轴位置异常
URL: https://github.com/apache/incubator-echarts/issues/8975#issuecomment-417527900
 
 
   
   
       
   
   
   
       font{
           line-height: 1.6;
       }
       ul,ol{
           padding-left: 20px;
           list-style-position: inside;
       }
   
   
       
   您好，您给的代码中双Y轴必须在xAxis中配置了scale为true才能实现，但如果用户场景需要显示0刻度时不能配置scale:true，那么双Y轴无法正常显示，参考如下代码var data = [[10, 16, 3, 'A'], [16, 18, 15, 'B'], [18, 26, 12, 'C'], [26, 32, 22, 'D'], [32, 56, 7, 'E'], [56, 62, 17, 'F']];var colorList = ['#4f81bd', '#c0504d', '#9bbb59', '#604a7b', '#948a54', '#e46c0b'];data = echarts.util.map(data, function (item, index) {    return {        value: item,        itemStyle: {            normal: {                color: colorList[index]            }        }    };});function renderItem(params, api) {    var yValue = api.value(2);    var start = api.coord([api.value(0), yValue]);    var size = api.size([api.value(1) - api.value(0), yValue]);    var style = api.style();    return {        type: 'rect',        shape: {            x: start[0],            y: start[1],            width: size[0],            height: size[1]        },        style: style    };}option = {    title: {        text: 'Profit',        left: 'center'    },    tooltip: {    },    xAxis: {    },    yAxis: [{        name: '1'    }, {        name: '2'    }],    series: [{        type: 'custom',        renderItem: renderItem,        label: {            normal: {                show: true,                position: 'top'            }        },        dimensions: ['from', 'to', 'profit'],        encode: {            x: [0, 1],            y: 2,            tooltip: [0, 1, 2],            itemName: 3        },        data: data    }, {        type: 'custom',        renderItem: renderItem,        yAxisIndex: 1,        label: {            normal: {                show: true,                position: 'top'            }        },        dimensions: ['from', 'to', 'profit'],        encode: {            x: [0, 1],            y: 2,            tooltip: [0, 1, 2],            itemName: 3        },        data: data    }]};
   
   
       
           a#ntes-pcmail-signature-default:hover {
               text-decoration: underline;
               color: #3593db;
               cursor: pointer;
           }
       
   
          
       
           
                       
               
                   
                       
                               
                                   
                               
                               
                                   ezioreturner
                               
                       
                           
                               
                                       ezioreturner@gmail.com
                               
                           
                   
               
           
           
       
       
           签名由
           网易邮箱大师
           定制
       
     
   
   
   
       在2018年08月30日 21:35，Wenli Zhang<no...@github.com> 写道： 
   
   
   你自己检查一下哪里写错了吧，下面的代码可以实现自定义系列双 Y 轴：
   var data = [[10, 16, 3, 'A'], [16, 18, 15, 'B'], [18, 26, 12, 'C'], [26, 32, 22, 'D'], [32, 56, 7, 'E'], [56, 62, 17, 'F']];
   var colorList = ['#4f81bd', '#c0504d', '#9bbb59', '#604a7b', '#948a54', '#e46c0b'];
   
   data = echarts.util.map(data, function (item, index) {
       return {
           value: item,
           itemStyle: {
               normal: {
                   color: colorList[index]
               }
           }
       };
   });
   
   function renderItem(params, api) {
       var yValue = api.value(2);
       var start = api.coord([api.value(0), yValue]);
       var size = api.size([api.value(1) - api.value(0), yValue]);
       var style = api.style();
   
       return {
           type: 'rect',
           shape: {
               x: start[0],
               y: start[1],
               width: size[0],
               height: size[1]
           },
           style: style
       };
   }
   
   option = {
       title: {
           text: 'Profit',
           left: 'center'
       },
       tooltip: {
       },
       xAxis: {
           scale: true
       },
       yAxis: [{
           name: '1'
       }, {
           name: '2'
       }],
       series: [{
           type: 'custom',
           renderItem: renderItem,
           label: {
               normal: {
                   show: true,
                   position: 'top'
               }
           },
           dimensions: ['from', 'to', 'profit'],
           encode: {
               x: [0, 1],
               y: 2,
               tooltip: [0, 1, 2],
               itemName: 3
           },
           data: data
       }, {
           type: 'custom',
           renderItem: renderItem,
           yAxisIndex: 1,
           label: {
               normal: {
                   show: true,
                   position: 'top'
               }
           },
           dimensions: ['from', 'to', 'profit'],
           encode: {
               x: [0, 1],
               y: 2,
               tooltip: [0, 1, 2],
               itemName: 3
           },
           data: data
       }]
   };
   
   —You are receiving this because you authored the thread.Reply to this email directly, view it on GitHub, or mute the thread.

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@echarts.apache.org
For additional commands, e-mail: dev-help@echarts.apache.org