1. var myChart = echarts.init(document.getElementById('sitesChar'));
  2. var option = {
  3. title : {
  4. text: 'Nodejs站点服务器分布',
  5. subtext: '平台组',
  6. x:'center'
  7. },
  8. tooltip : {
  9. trigger: 'item',
  10. formatter: "{a} <br/>{b} : {c} ({d}%)"
  11. },
  12. legend: {
  13. orient : 'vertical',
  14. x : 'left',
  15. data: _ips
  16. },
  17. toolbox: {
  18. show : true,
  19. feature : {
  20. mark : {show: false},
  21. dataView : {show: true, readOnly: false},
  22. magicType : {
  23. show: false,
  24. type: ['pie', 'funnel'],
  25. option: {
  26. funnel: {
  27. x: '25%',
  28. width: '50%',
  29. funnelAlign: 'left'
  30. //max: 1548
  31. }
  32. }
  33. },
  34. restore : {show: true},
  35. saveAsImage : {show: true}
  36. }
  37. },
  38. calculable : true,
  39. series : [
  40. {
  41. name:'服务器IP:站点数',
  42. type:'pie',
  43. radius : '55%',
  44. center: ['50%', '60%'],
  45. data: _data
  46. }
  47. ]
  48. };
  49.  
  50. // 为echarts对象加载数据
  51. myChart.setOption(option);
  52. // 加上这一句即可
  53. window.onresize = myChart.resize;

  

Echarts自适应浏览器大小的更多相关文章

  1. css自适应浏览器大小

    css自适应浏览器大小 1.屏幕 > 900px :显示3列 2.450px < 屏幕 < 900px :显示2列 3.屏幕 < 450px :显示1列 <!DOCTYP ...

  2. jQuery easyui layout布局自适应浏览器大小(转)

    首先解释一下标题的含义,当我们用jQuery easyui layout 进行布局的时候,可能会遇到这样一个问题,那就是当手工调整浏览器大小,或者最大化.还原窗口的时候,layout的某个区域不能填充 ...

  3. vue Echarts自适应浏览器窗口大小

    <template> <div class="chinaecharts"> <div id="mapChart" ref=&quo ...

  4. HTML中使背景图片自适应浏览器大小

    由于<body>标签的图片不能够拉伸, 解决办法: 1.图片不够大,又background属性不能拉伸图片: 2.只能用个div,把其z-index值设为负,并使这个div大小为整个bod ...

  5. echarts图表自适应浏览器窗口的大小

    echarts问题描述 当浏览器窗口发生变化时,echarts图表未能自适应浏览器的变化,产生如下的效果 解决方案 在$(function(){}中添加 window.onresize = funct ...

  6. Echarts图表随浏览器大小,模块大小,位置实时更新

    1.图表位置随浏览器大小改变 2.图表位置随模块的改变而改变 只需要在事件函数中添加:

  7. ExtJS6 自适应浏览器窗口大小

    ExtJS6官方文档推荐使用Ext.on.做一个小例子,创建一个Panel显示在页面上,使它的大小随浏览器变化,自适应浏览器窗口大小. html:增加一个css样式给Panel加上红色border. ...

  8. Atitit html5 Canvas 如何自适应屏幕大小

    Atitit  html5 Canvas 如何自适应屏幕大小     可以用JS监控屏幕大小,然后调整Canvas的大小.在代码中加入JS 1 2 3 4 5 6 7 $(window).resize ...

  9. Unity Web自适应浏览器

    unity web的自适应浏览器比我想象中要更简单,但是这里也只有更改最简单的东西实现了自适应.发布web时,在playersetting里面设置分辨率为你在Game窗口自定义的分辨率大小,以保证内容 ...

随机推荐

  1. Tomcat 配置支持APR

    对ARP支持,需要安装以下库: APR library JNI wrappers for APR used by Tomcat (libtcnative) OpenSSL libraries 其中JN ...

  2. wamp配置sendmail发送邮件

    下载 sendmail ( 地址: http://www.glob.com.au/sendmail/sendmail.zip ) [PHP.ini 配置] [mail function]; For W ...

  3. Java 编码 字符集

    Java 编码 字符集 @author ixenos 1.   字符集 a)    字符集建立了两字节Unicode码元序列与使用本地字符编码方式的字节序列之间的映射. b)    为了兼容其它命名, ...

  4. JavaEE XML 基础知识

    JavaEE XML 基础知识 @author ixenos 1.    XML开头都需要一个声明 <?和?>表明这是一个处理指令 <?xml version=”1.0” encod ...

  5. 关于NLog的target和Layout

    这个没啥好说的,都是用别人的东西,看文档就行了,写的很详细. https://github.com/NLog/NLog/wiki/Configuration-file https://github.c ...

  6. NOIP2014-普及组复赛-第二题-比例简化

    题目描述 Description 在社交媒体上,经常会看到针对某一个观点同意与否的民意调查以及结果.例如,对某一观点表示支持的有1498 人,反对的有 902人,那么赞同与反对的比例可以简单的记为14 ...

  7. php 实现简易模板引擎

    1.MVC简介 MVC 是一种使用 MVC(Model View Controller 模型-视图-控制器)设计创建 Web 应用程序的模式(详情自己百度): 1. Model(模型)表示应用程序核心 ...

  8. ACE_Message_Block消息数据类

    ACE_Message_Block ACE_Message_Block用于构建"固定"和"可变"长度的消息.ACE_Message_Block可以将多条消息连接 ...

  9. SQL多表连接查询以及mysql数据库、sqlserver数据库常见不同点

    mysql数据库表及数据准备语句: USE test; DROP TABLE IF EXISTS `teacher_table`; DROP TABLE IF EXISTS `student_tabl ...

  10. input type="file" 的一些问题

    file可以上传文件,但通常 情况下大家都会需要设置文件上传的格式 上传文件的格式由一个 accept 属性来控制 列如: <input type="file" id=&qu ...