[GitHub] [incubator-echarts] eniaclyl opened a new issue #10740: lines直线超出坐标轴如何裁剪

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

eniaclyl opened a new issue #10740: lines直线超出坐标轴如何裁剪
URL: https://github.com/apache/incubator-echarts/issues/10740
 
 
   ### What problem does this feature solve?
   用lines绘制带箭头的直线时，放大以后直线超出坐标轴的部分不会裁剪，请问如何裁剪？
   
   ### What does the proposed API look like?
   var lineData = []
   
       function getColor() {
           //定义字符串变量colorValue存放可以构成十六进制颜色值的值
           var colorValue = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f";
           //以","为分隔符，将colorValue字符串分割为字符数组["0","1",...,"f"]
           var colorArray = colorValue.split(",");
           var color = "#";//定义一个存放十六进制颜色值的字符串变量，先将#存放进去
           //使用for循环语句生成剩余的六位十六进制值
           for (var i = 0; i < 6; i  ) {
               //colorArray[Math.floor(Math.random()*16)]随机取出
               // 由16个元素组成的colorArray的某一个值，然后将其加在color中，
               //字符串相加后，得出的仍是字符串
               color  = colorArray[Math.floor(Math.random() * 16)];
           }
           return color;
       }
   
   for (var i = 0; i < 20;   i) {
      var x = Math.floor(Math.random()*600 50)
      var y = Math.floor(Math.random()*600 50)
      var xSign = Math.floor(Math.random()*2 1)
      var ySign = Math.floor(Math.random()*2 1)
      //负数
      if (xSign === 1) {
           x *= -1;    
      }
      if (ySign === 1) {
          y *= -1;
      }
     
      var obj = {
           name: "测试直线" i 1,
           coords: [
               [0, 0],
               [x, y]
           ],
           label: {
               show:false
           },
           lineStyle: {
               normal: {
                   color: getColor(),
                   width: 1
               }
           }
       }
      lineData.push(obj);
   }
   
   option = {
       animation: false,
       title: {
           text: '网络拓扑图'
       },
       xAxis: {
           min: -1000,
           max: 1000,
           splitLine:{
   　　　　lineStyle: {
   　　　　    width: 1
   　　　　}
   　　}
       },
       yAxis: {
           min: -1000,
           max: 1000,
           splitLine:{
   　　　　lineStyle: {
   　　　　    width: 1
   　　　　}
   　　}
       },
       dataZoom: [{
               type: 'inside',
               xAxisIndex: 0,
               filterMode: 'empty'
           },
           {
               type: 'inside',
               yAxisIndex: 0,
               filterMode: 'empty'
           }
       ],
       series: [{
           type: 'lines',
           name: '网络拓扑图',
           coordinateSystem: 'cartesian2d',
           lineStyle: {
               normal: {
                   color: '#F00',
                   width: 1
               }
           },
           label: {
             fontSize: 15  
           },
           symbol: ['none', 'arrow'],
           // 数据
           data: lineData
       }]
   };
   
   <!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
   

----------------------------------------------------------------
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.
 
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