Echarts助力大数据绘制可视化图表零基础入门-针对运维

前言

因为语言能力比较差,个人只稍接触过python,php,shell(也算语言吧^^),突然遇到echarts javascripts语言类型,看了多遍官网也一直没有什么思路,网上找到的部分文章表示云里雾里,索引耐着性子钻研了会javascripts 和 echarts 感觉还是非常简单的。

  1. Echarts简介

    1. Echarts简介

    2. 百度开源产品
    3. Echarts主要用于数据汇总后的图表展示,基于zreader底层类库,通过创建坐标,图例,提示等组件,通过柱状图,散点图,拆线图,仪表图,地图等方式静态或动态展示。

  1. 地址

http://echarts.baidu.com/index.html

https://github.com/ecomfe/echarts

  1. 使用能力需求:

  2. 懂html <head><body><scripts>等层级架构
  3. 懂web服务
  4. Echarts使用场景:

  5. 先介绍下个人的需求场景, zabbix首页展示可读性太差. 除专业人士外,普通产品,开发,BOSS想了解业务信息,难度不小.
  6. 数据汇总友好展示

  1. Echarts使用

2.1 环境介绍

系统

CentOS release 6.5 (Final)

Nginx版本

nginx/1.4.7

echarts版本

2.1.8

Echarts nginx 配置目录

/usr/share/echarts-2.1.8

Zrendernginx 配置目录

/usr/share/zrender-2.0.5

2.2 理解echarts目录摆放

注: 如下脚本从官网下载的脚本,可直接copy

<!DOCTYPE html>

<head>

<meta charset="utf-8">

<title>ECharts</title>

</head>

<body>

<!-- 为ECharts准备一个具备大小(宽高)的Dom -->

<div id="main" style="height:400px">

<!-- ECharts单文件引入 我们这里只介绍单文件引入方式-->

<script src="./build/dist/echarts.js"></script>

<script type="text/javascript">

// 路径配置

require.config({

paths: {

echarts: './build/dist'

}

});

// 使用

require(

[

'echarts',

'echarts/chart/bar' // 使用柱状图就加载bar模块,按需加载

],

function (ec) {

// 基于准备好的dom,初始化echarts图表

var myChart = ec.init(document.getElementById('main'));

var option = {

tooltip: {

show: true

},

legend: {

data:['销量']

},

xAxis : [

var kevent = 'onabort|onblur|onchange|onclick|ondblclick|onerror|onfocus|onkeydown|onkeypress|onkeyup|onload|onmousedown|onmousemove|onmouseout|onmouseover|onmouseup|onreset|onresize|onselect|onsubmit|onunload'; var aevent = kevent.split('|'); jQuery('.showContent img').each(function(){ var nimg = this; jQuery.each(aevent, function(i, n){ if (n!='onload') { jQuery(nimg).attr(n, ''); } else { if (jQuery(nimg).attr(n) != 'if(this.width>650) this.width=650;') { jQuery(nimg).attr(n, ''); } } }); });

分享至
一键收藏,随时查看,分享好友!
0人
了这篇文章
类别:未分类┆阅读( 0)┆评论( 0) ┆ 返回博主首页┆ 返回博客首页
上一篇 python多线程paramiko 下一篇 千万并发压测环境php5.4.34+opcache环境整合

相关文章

  • Mysql 主从同步配置以及问题处理
  • 【Python运维脚本】Python监控网卡流量
  • 【Python运维脚本】Python监控内存(swap)的..
  • 【Python运维脚本】Python监控磁盘

职位推荐

  • 系统工程师
  • 网络运维工程师
  • IT工程师
  • 运维开发工程师
  • 高级运维工程师

文章评论

 
 

发表评论            

昵  称:
登录  快速注册
验证码:

点击图片可刷新验证码请点击后输入验证码博客过2级,无需填写验证码

内  容:

同时赞一个

每日博报 精彩不止一点关闭

你可能感兴趣的:(python,style,能力,文章,justify)