挺好用的,碰到几个问题,有的是瞎试解决了的:

1、我想折线图能够响应单击事件,即点击某个节点后,就能加载进一步的信息,帮助没找到,参照另外一个地方的写法,居然支持事件

            Morris.Line({
element: 'graph',
data: year_data,
xkey: 'period',
ykeys: ['zhichu', 'shouru'],
labels: ['支出', '收入'],
parseTime: false,
lineColors:['#0000ff', '#ff0000'],
gridTextSize:24,
hoverFontSize:24
}).on('click', function(i, row){
$.ajax({ url: "GetMonth.aspx?Year="+$("#DropDownList1").val()+"&Mon="+i,
success: function(data){
var obj = JSON.parse(data)
loadMonth(obj.mon)
}});
});

2、文字大小调整,hoverFontSize,设置了不太管用,有些浏览器支持有些不行,关键是,微信小程序的浏览器不行,于是改了两个地方:

1)morris.css中的样式,改了似乎用处不大

2)分析页面,找到样式,直接用jquery设置

$(".morris-hover morris-default-style").css({"font-size":"24px"});

大概效果如下,手机中看起来不错。

我的博客即将搬运同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan

Morris图表使用小记的更多相关文章

  1. 简洁AngularJS框架后台管理系统bootstrap后台模板

    最近在做一个后台管理的项目,但是没有设计图完全,所以就发现一款非常不错的模版. 这个模版是基于 AngularJS 和 bootstrap 的后台管理系统模版. Minovate是 AngularJS ...

  2. 一款免费的js图表工具--morris

    前段时间需要使用免费的图表工具做报表,同事提及了一款图表工具morris.官方网站: http://www.oesmith.co.uk/morris.js/ 该插件遵循BSD协议,可以用于商业软件,也 ...

  3. Morris 轻量级 图表

    Morris.js 是基于 jQuery 和 Raphaël 的轻量级矢量图形库,帮助开发人员轻松绘制各种形式的图表.示例: HTML: <div id="myfirstchart&q ...

  4. 时间作为横轴的图表(morris.js)超越昨天的自己系列(8)

    超越昨天的自己系列(8) morris.js的官网有详细的例子:http://www.oesmith.co.uk/morris.js/ 特别注意它的依赖: <link rel="sty ...

  5. jquery图表插件morris.js参数详解和highcharts图表插件

    一.morris.js 优点:轻巧.简单好用 缺点:没highcharts功能多,常用的足以 网址:http://morrisjs.github.io/morris.js/ 核心代码 1.head调用 ...

  6. 轻量级的绘制图表js库--Morris.js

    Morris.js 是一个轻量级的 JS 库,使用 jQuery 和 Raphaël 来生成各种时序图. 虽说现在移动手机网络已经到了4G,但是在移动web客户端开发过中,为了达到良好的体验效果,需要 ...

  7. 【MVVMLight小记】二.开发一个简单图表生成程序附源码

    上一篇文章介绍了怎样快速搭建一个基于MVVMLight的程序http://www.cnblogs.com/whosedream/p/mvvmlight1.html算是简单入门了下,今天我们来做一个稍许 ...

  8. Morris.js和flot绘制折线图的比较

    [文章摘要] 最近用开源的AdminLTE做框架感觉效果特别好,其针对图表库Morris.js和flot都提供了不错的支持,也都提供了这两者的例子.不过Morris.js是基于Raphael.js来的 ...

  9. ConCurrent in Practice小记 (1)

    ConCurrent in Practice小记 (1) 杂记,随书自己写的笔记: 综述问题 1.线程允许在同一个进程中的资源,包括共享内存,内存句柄,文件句柄.但是每个进程有自己的程序计数器,栈和局 ...

随机推荐

  1. hdu4419

    对于这类面积覆盖的题,大致就两点要注意的 1.同一把矩形放在笛卡尔坐标系上做 2.pushup函数要注意下细节:及在统计子区间和之前要先判断是否有子区间 用sum数组来保存区间被覆盖的情况,如果遇到多 ...

  2. python 全栈开发,Day11(函数名应用,闭包,装饰器初识,带参数以及带返回值的装饰器)

    一.函数名应用 函数名是什么?函数名是函数的名字,本质:变量,特殊的变量. 函数名(),执行此函数. python 规范写法 1. #后面加一个空格,再写内容,就没有波浪线了. 2.一行代码写完,下面 ...

  3. 【C++ Primer 第13章】3. 交换操作

    交换操作 class HasPtr { friend void swap(HasPtr &rhs, HasPtr &yhs); //其他成员定义 }; void swap(HasPtr ...

  4. python访问百度地图接口并返回信息

    import urllib.parse import urllib.request data = urllib.parse.urlencode({'address': '广东省湛江市霞山区', 'ou ...

  5. MVC的WebViewPage

    采用Razor引擎的View文件(.cshtml或者.vbhtml)最终都会编译成一个WebViewPage类型,所以通过RazorView/WebFormView体现的View的呈现机制最终体现在对 ...

  6. AOJ 2200 Mr. Rito Post Office (floyd+DP)

    题意: 快递到了:你是某个岛国(ACM-ICPC Japan)上的一个苦逼程序员,你有一个当邮递员的好基友利腾桑遇到麻烦了:全岛有一些镇子通过水路和旱路相连,走水路必须要用船,在X处下船了船就停在X处 ...

  7. 天天爱跑步&&弹球

    题解: 弹球题目地址:https://www.nowcoder.com/acm/contest/113/E 后面这题 应该是天天爱跑步的加强版本 原理都是查询子树中dep[x]+f[x]的值的个数 由 ...

  8. 2015 Benelux Algorithm Programming Contest I- Interesting Integers

    题目大意:给你一个数字n(n<=1e9) ,让你求一个能包含这个数的斐波那契数列的第一项a 和第二项b,找出b最小的那个. 帮我复习了一下扩展欧几里得.... 思路:a,b,a+b,a+2b…… ...

  9. docker swarm学习命令

    引用自:https://blog.csdn.net/wanglei_storage/article/details/77508620 引用自:https://www.cnblogs.com/wj563 ...

  10. BZOJ1192 [HNOI2006]鬼谷子的钱袋 数学推理

    欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - BZOJ1192 题意概括 把一个数m拆成很多数字. 问至少拆成多少个数字,1~m中的所有数字才可以用这些数字 ...