[GitHub] [echarts] chenweihao-demo commented on issue #7254: 散点图超出Gird部分hide的优化建议。

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

chenweihao-demo commented on issue #7254:
URL: https://github.com/apache/echarts/issues/7254#issuecomment-1207134959

   使用自定义图表custom，它的clip属性会裁剪超出坐标轴的部分，这是例子
   `var categoryData = [];
   var errorData = [];
   var barData = [];
   var dataCount = 100;
   for (var i = 0; i < dataCount; i++) {
     var val = Math.random() * 1000;
     categoryData.push('category' + i);
     errorData.push([
       i,
       echarts.number.round(Math.max(0, val - Math.random() * 100)),
       echarts.number.round(val + Math.random() * 80)
     ]);
     barData.push(echarts.number.round(val, 2));
   }
   option = {
     tooltip: {
       trigger: 'item',
       axisPointer: {
         type: 'shadow'
       }
     },
     title: {
       text: 'Error chart'
     },
     legend: {
       data: ['error']
     },
     xAxis: {
       data: categoryData
     },
     yAxis: {},
     series: [
       {
         type: 'custom',
         name: 'error',
         itemStyle: {
           borderWidth: 1.5
         },
         clip: true,
         renderItem: function (params, api) {
           var xValue = api.value(0);
           var highPoint = api.coord([xValue, api.value(1)]);
           var lowPoint = api.coord([xValue, api.value(2)]);
           var halfWidth = api.size([1, 0])[0] * 0.1;
           var style = api.style({
             stroke: api.visual('color'),
             fill: api.visual('color'),
           });
           return {
             type: 'circle',
             transition: ['shape'],
             shape: {
               cx: highPoint[0],
               cy: highPoint[1],
               r: 10
             },
             style: style
           };
         },
         data: errorData,
         z: 100
       }
     ]
   };`
   ![image](https://user-images.githubusercontent.com/47056630/183231300-980c8c83-05b7-4c1d-96fa-96ddb9165200.png)
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org


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