zoukankan      html  css  js  c++  java
  • 百度echarts样式开发

    Echarts如何进行实例化

    var a1 = null;
    a1=  echarts.init(document.getElementById('a1'));
               a1.setOption({
                   color: ['#01a5e8'],
                   tooltip: {
                       trigger: 'axis',
                       axisPointer: {            // 坐标轴指示器,坐标轴触发有效
                           type: 'shadow'        // 默认为直线,可选为:'line' | 'shadow'
                       }
                   },
                   grid: {
                       left: '3%',
                       right: '4%',
                       bottom: '3%',
                       containLabel: true,
                       top:"3%"
                   },
                   xAxis: [
                       {
                           type: 'category',
                           data: ['pe0/1','pe0/2','pe0/3','pe0/4','pe0/5'],
                           axisTick: {
                               alignWithLabel: true
                           }
                       }
                   ],
                   yAxis: [
                       {
                           type: 'value'
                       }
                   ],
                   series: [
                       {
                           name: '巡检服务器数',
                           type: 'bar',
                           barWidth: '20',
                           data: [390, 334, 300,210, 200 ],
                         
                       }
                   ]
               });

    刷新数据

    //更新数据
          var option = myChart.getOption();
          option.series[0].data = data;   
          myChart.setOption(option);    

     Echarts中,控制图表在父窗体中的饱满程度。(这个非常重要,因为这个最常用)。但是通常理解为Echarts的bug。之前在老郭的平台中就遇到过这些问题,结果经历了长时间的技术沉淀终于解决了这些问题。

    grid: {  
     left: '3%',  
     right: '4%',  
     bottom: '3%',  
     containLabel: true,  
     top:"3%"  
     },  
    x轴线
    axisLabel: {
                             
                            rotate:45,
                            textStyle: {
                                color: '#fff',
                                fontSize: 14
                            }
                        }
    
    
    
    y轴
    axisLabel: {
                             
                            rotate:45,
                            textStyle: {
                                color: '#fff',
                                fontSize: 14
                            }
                        }
    
    
    在legend上加
      textStyle:{color:'#fff',
    
    fontSize:16
    
    }
    
    在条目上加
    
    
     label: {
                    normal: {
                        show: true,
                        position: 'top',
                        textStyle:{color:'#c3c3c3',fontSize:"16"},
                    }
                }
    
    
    
     textStyle:{color:'#c3c3c3',fontSize:"16"},

     Echarts更多的问题总结。

    如何多张图共用一张图例。多张图进行合并。

  • 相关阅读:
    论文复现
    20199324 2019-2020-2 《网络攻防实践》第12周作业
    20199324 2019-2020-2 《网络攻防实践》第10周作业
    20199324 2019-2020-2 《网络攻防实践》第9周作业
    Android Dalvikvm的学习笔记
    20199324 2019-2020-2 《网络攻防实践》第8周作业
    20199324 2019-2020-2 《网络攻防实践》第7周作业
    445. Add Two Numbers II
    167. Two Sum II
    643. Maximum Average Subarray I
  • 原文地址:https://www.cnblogs.com/sexintercourse/p/7256497.html
Copyright © 2011-2022 走看看