v5browser
v5browser

Jqplot图形报表-绘制饼图、柱状图、折线图....

1、首先下载Jqplot插件 下载

2、将下载后的 plugins文件夹、jquery.jqplot.min.js、jquery.jqplot.min.css、excanvas.min.js、excanvas.js 文件导入项目js中。

3、打开下载文件 ist\examples 中的网页 内有实例

Jqplot图形报表-绘制饼图、柱状图、折线图...._第1张图片



jqplot的背景颜色设置

grid:{  
                background: "#000000"  
            }

Jqplot插件生成饼图后修改字体颜色的说明

在用到Jqplot插件制作一个饼图的时候，在饼图上面显示的数据百分比的字体颜色，客户看起来感觉效果不是很好，想改

成其他颜色，在Jqplot提供的文档中找了好久都没有找到可以对应作修改的属性。后来解决的方法是找到Jqplot自带的样

式jquery.jqplot.min.css文件中的this.color属性，将其修改成自已想要的那个颜色便可以了。


.jqplot-target{position:relative;color:#666;font-family:"Trebuchet ......

如上CSS代码中将color改掉属性值便可以了，如 

.jqplot-target{position:relative;color:#000;font-family:"Trebuchet






你可能感兴趣的:(jqplot)

  • 【整理】前端图表框架 芸尚非 归纳整理前端echartsjavascript
    目录echarts（apache）chart.jshighchartsd3.jsJsChartsamchartschartlistc3.jstauchartsflotchartsflotr2FusionChartscanvasJscanvasExpressnvd3ZingChartrgraphjqplotprotovisdc.jsdygraphsdatawrapperaxiisAwesomeCha
  • 展现数据、制作表格和图表的JavaScript库 东北老T Web
    展现数据、制作表格和图表的JavaScript库，列在前20位的如下：HighCharts——它非常强大，你可以在JSFiddle中查看和编辑大量示例。它不免费，但拥有很多客户（IBM、NASA、MasterCard等）。它还向下兼容IE8。jqPlot——如果你已经在使用jQuery，不想为HighCharts付费，而且情况很简单，不需要D3那样复杂的库，那么jqPlot是很好的选择。dygra
  • jqplot AJAX JSON对象创建饼状图 wsk7860
    上篇文章为柱状图，这篇为饼状，主要是渲染的方式和构建JSON对象不同WEB端：/*饼状图函数*//*返回JSON对象必需类似于[[['name1',100],['name2',100]]]，jqplot自动换算成name1:50%,name2:50%*/functioncreatePieCharts(){varajaxDataRenderer=function(url,plot,options){
  • jqplot AJAX 获取JSON对象 动态生成柱状图 wsk7860
    项目需求，需要用到报表插件，以前提到过用Highcharts但商业用收费，继续找插件后来找到了jqplot虽然没有Highcharts好看但能实现功能就行了。直接贴代码WEB端：//柱状图函数/*多项数据对比显示AJAX返回JSON对象必需类似于[{'name':'名称1','list':[1,2],'year',2012},{'name':'名称2','list':[6,7],'year',20
  • 几个Web Charts框架 D_SJ
    jqPlotjqPlotispackagedwithallthebasiccharts,aswellasgaugesandcandlestick.Thesoftwareisopensourceandtotallyfree.jqPlotisbasedonthejQuerylibraryandusesthecanvasapproachforplottingcharts.Thisproducthasav
  • jqplot参数描述 z466459262 小框架或小语言
    jqPlot图形报表插件简介及参数详解(jquery)jqPlot是一款基于jquery类库的图标绘制插件。通过jqPlot可以再网页中绘制线状、柱状、饼状等多种样式图表。而且，jqPlot具有插件可扩展性(Pluggability)，你可以编写自己的图表样式。功能概述：有多种图表样式可供选择可以自定义日期轴线可设置旋转轴文字自动计算趋势线工具条提示和高亮数据点默认最优设置，非常易于使用以上功能在
  • freemarker中巧妙处理Object类型的js参数 weyoung001 javascriptfreemarker
    最近工作中写freemarker的时候碰到一种情况如下：$("#obj").jqplot({arg0:${arg0?html},arg1:${arg1?html},arg2:${arg1?html},arg3:"arg3"});jqplot方法的入参是一个Object类型的js对象，因为需要判断入参是否放在了freemarker的参数列表里，所以使用了if语句，同时为了保证当所有参数都不存在时入参
  • web前端js绘制统计图表,访问数据库 merrick326 JavaScript数据库
    现在有很多js库可以方便地在web客户端绘制出漂亮的统计图表，显示效果和开发易用性并不亚于在JSPServer端使用诸如JFreeChart组件生成图片流传递到客户端。一般要求浏览器支持html5的canvas功能，为兼容不支持的浏览器，js库另外提供了canvas脚本库。本例记录了采用免费开源基于jquery的js绘图库——jqplot、MSActiveX框架、MSAcess开发学习实例.部分源
  • jquery生成曲线 fairyhawk javaScript
    用的jquery报表。有些属性要设置。看效果主要设置1.数据来源数组2.2个纵坐标。并且起始为0，行数设置。3.横坐标日期显示。斜着显示。日期斜着显示找了半天。意外的好用了4.鼠标移动时的效果。需要的引用的js下载地址http://download.csdn.net/detail/fairyhawk/3626616.jqplot-cursor-legend{width:160px;font-fam
  • ECharts与Highcharts图表比较 sven_xu 第三方
    用过Highchars图表组件的朋友应该都知道其可配置性强，但是图表与用户的交互性还是有所欠缺。今天我们就来聊聊一款既配置性强有与用户有着良好交互性的图表ECharts吧！业界有无数js图表库，不乏优秀的代表，如chartjs，FusionCharts，amCharts，flot，RGraph，jqPlot，gRapha?l等等。有的是免费甚至开源的，有的则是商业的，百度一下就能找到他们。无法跟他
  • 使用jQuery jqPlot插件绘制柱状图
    在一个项目研发过程中，需要显示账户的资金情况，为了给客户良好的体验我们采用了柱状图形展现，绘图的过程如果使用原生态脚本绘制这样比较麻烦，时间也会比较长，所以我们选择了jqPlot插件进行绘制，这样可以节省大量的时间，也能很快就能展示给用户。插件官方地址：http://www.jqplot.com/具体实现如下：引用JS文件：复制代码代码如下:Html代码复制代码代码如下:Javascript脚本：
  • jQuery插件 Jqplot图表实例 酷小孩
    $(function(){//--------------官网---------------------------//varplot1=$.jqplot('chart1',[[3,7,9,1,4,6,8,2,5]]);//----------------实例-------------------------//varticks=['20110915','20111024','20111003',
  • jqPlot jQuery绘图插件的使用 沫鱼
    jqPlot是一个jQuery绘图插件，可以利用它制作漂亮的线状图和柱状图。jqPlot支持为图表设置各种不同的样式。提供Tooltips，数据点高亮显示等功能。官网：http://www.jqplot.com/这里贡献上中文教程，基本上所有的api都很齐全，供有需要的童鞋们瞧瞧，更重要的是作为自己滴收藏~~哦耶耶~jqPlot整的来说有三个地方需要配置。格式如：$.jqplot(‘target'
  • jqPlot 参数 q617610589 jqplot
    转载自：http://www.cnblogs.com/mofish/archive/2011/08/15/2139728.htmljqPlot整的来说有三个地方需要配置。格式如：    $.jqplot(‘target’,data,options);target：要显示的位置。data：显示的数据。options：其它配置seriesColors:["#4bb2c5","#c5b47f","#EA
  • 图表插件--jqplot交互演示样例 jqplot
    简单交互 在之前的学习中，我们已经能够绘制各种类型的图表，也能够给图表加入不同的组件，如标题、图例等等。但这些图表仅仅能用于展示数据，一旦希望对图表有所操作——比方查看数据明细——就显得束手无策了。事实上jqPlot是提供了图表事件交互功能的，且实现起来，也相当的简单。接下来我们要做的就是，学习假设监听图表事件，并对事件进行处理。 在jqPlot的源代码中，我们可以看到这种代码片段：
  • jquery 图形报表插件jqplot 柱状图 jquery
    jqplot默认制作曲线图，如果想做柱状图，必须引入plugin包中的插件js： 一、几个简单柱状图实例： <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>demo1.html</title> &n
  • 强大的 Jquery图表绘制插件 —— jqPlot jquery
    jqPlot是 一款基于jquery类库的图标绘制插件。通过jqPlot可以再网页中绘制线状、柱状、饼状等多种样式图表。而且，jqPlot具有插件可扩展性 (Pluggability)，你可以编写自己的图表样式。jqPlot在之前有人 介 绍过了，这里我主要介绍它的一些用法和示例。 在jqPlot主页的自我介绍中有这样一句话：“jqPlot is a plotting plugin fo
  • jquery 图形报表插件jqplot 曲线图 jquery
       下载jqPlot压缩包后（目前是0.70版 本），可以看到以下主要文件：jquery-1.3.2.js，jquery1.3.2类库文件；jquery.jqplot.js，功能主文 件；jquery.jqplot.css，图表样式文件；excanvas.js，针对ie浏览器的修正文件；test*.html，一些示例文 件；plugins文件夹中放置jqplot的各种图表插件
  • jquery 图形报表插件jqplot 简介及参数详解 jquery
    前边也讲过一个基于java的图形报表，功能及外观也不错，但存在通用性的问 题。所以我们来学一个具有易用性+兼容性+可扩展性的js图表插件。 jqPlot是 一款基于jquery类库的图标绘制插件。通过jqPlot可以再网页中绘制线状、柱状、饼状等多种样式图表。而且，jqPlot具有插件可扩展性 (Pluggability)，你可以编写自己的图表样式。 功能概述： 有多种图表样式可供选择
  • jqPlot的Option配置对象详解 option
           如果看过本文姊妹篇《jqPlot ——基于jquery的图表绘制工具》的朋友，应该知道jqPlot大致的操作方法；如果还是不太清楚的话，可以参考jqPlot官方网站的使 用方法介绍。这里主要介绍jqPlot中核心部分——Option配置对象。同时，也会对jqplot的各个渲染器做个简单介绍。  &nbs
  • JQ 报表插件 jquery.jqplot 使用 jquery
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>显示报表</title> <meta http-equiv="content-type" co
  • jqplot配置详解 jqplot
    1 options = 2 { 3 seriesColors: [ "#4bb2c5", "#c5b47f", "#EAA228", "#579575", "#839557", "#958c12", 4
  • jqplot总结 jqplot
    JqPlot需要三个参数，1.位置，2.数据，3.配置。 重点是3.配置。 配置大概分为title(标题)，axes(xy轴)，series(数据的连续图)，dataRenderer外部数据加载方式，highlighter鼠标靠近，数据显示方式，cursor鼠标样式变化，以及显示当前数值。   axes轴里面有轴名字label；轴名字的渲染引擎labelRenderer，以及轴名
  • 不错的jQuery图表插件 . jquery
             很多时候我们需要在网页中显示数据统计报表，从而能很直观地了解数据的走向，更好地帮助决策分析。今天就给大家分享几个个人觉得好用的jQuery图表插件，这几个图表插件使用起来非常方便，而且挺灵活的，相信大家会喜欢。 1、jqPlot（中文API说明及示例和源码）推荐 jqPlot是一款基于jquery类库的图标绘制插件。通过jqP
  • 做统计图的好工具 工具
    http://www.jqplot.com/tests/coretests.php   http://jpuzi.com/html/effect16.html   A Versatile and Expandable jQuery Plotting Plugin! jqPlot is a plotting and charting plugin for the j
  • jqplot使用小心得 jqplot
    　 这两天做一个项目，需要画饼图，所以在网上搜到jqplot这个插件。下面就说说我对他的简单的使用心得。    先说说我想要的效果：1.我需要修改饼图每个部分的背景色 　　　　　　　　　　　2.我需要修改饼图里面文本的颜色和字体大小 　　　　　　　　　　　3.还需要右侧说明文本都是带链接的 　　　　　　　　　　　4.标题放在图表下面 　上效果图：左侧是我的，右侧是对比
  • jqplot统计图工具简单例子 jqplot
    代码 <% @ Page Language = " C# "  AutoEventWireup = " true "  CodeBehind = " Default.aspx.cs "  Inherits = " 统计图._Default "  
  • jqplot 饼图 jqplot
    1 <script type="text/javascript" src="jquery-1.7.1.min.js"></script> 2 3 <link href="jquery.jqplot.css" rel="stylesheet" type="text/cs
  • jQuery插件jqplot的详细配置说明和渲染器 jquery插件
    jQuery插件jqplot的详细配置说明和渲染器   (2012-08-23 08:57:42) 转载▼ 标签：  jqplot   详细配置   渲染器   it 分类：  技术类 jQuery.jqplot插件的官方网址：http://www.jqplot.com/ jQuery.jqplot
  • jquery jqPlot API 中文使用教程 jquery
    jqPlot是一个灰常强大的图表工具，曲线，柱状，饼图，应该有尽有，更要命的是，调用方便~~ 官网：http://www.jqplot.com/ 这里贡献上中文教程，基本上所有的api都很齐全，供有需要的童鞋们瞧瞧，更重要的是作为自己滴收藏~~哦耶耶~ jqPlot整的来说有三个地方需要配置。格式如：    $.jqplot(‘target’, data, op
  • 基本数据类型和引用类型的初始值 3213213333332132 java基础
    package com.array; /** * @Description 测试初始值 * @author FuJianyong * 2015-1-22上午10:31:53 */ public class ArrayTest { ArrayTest at; String str; byte bt; short s; int i; long
  • 摘抄笔记--《编写高质量代码：改善Java程序的151个建议》 白糖_ 高质量代码
            记得3年前刚到公司，同桌同事见我无事可做就借我看《编写高质量代码：改善Java程序的151个建议》这本书，当时看了几页没上心就没研究了。到上个月在公司偶然看到，于是乎又找来看看，我的天，真是非常多的干货，对于我这种静不下心的人真是帮助莫大呀。           看完整本书，也记了不少笔记
  • 【备忘】Django 常用命令及最佳实践 dongwei_6688 django
    注意：本文基于 Django 1.8.2 版本   生成数据库迁移脚本（python 脚本） python manage.py makemigrations polls  说明：polls 是你的应用名字，运行该命令时需要根据你的应用名字进行调整   查看该次迁移需要执行的 SQL 语句（只查看语句，并不应用到数据库上）： python manage.p
  • 阶乘算法之一N! 末尾有多少个零 周凡杨 java算法阶乘面试效率
                                     &n
  • spring注入servlet g21121 Spring注入
    传统的配置方法是无法将bean或属性直接注入到servlet中的，配置代理servlet亦比较麻烦，这里其实有比较简单的方法，其实就是在servlet的init()方法中加入要注入的内容： ServletContext application = getServletContext(); WebApplicationContext wac = WebApplicationContextUtil
  • Jenkins 命令行操作说明文档 510888780 centos
    假设Jenkins的URL为http://22.11.140.38:9080/jenkins/ 基本的格式为 java 基本的格式为 java -jar jenkins-cli.jar [-s JENKINS_URL] command [options][args] 下面具体介绍各个命令的作用及基本使用方法 1. &nb
  • UnicodeBlock检测中文用法 布衣凌宇 UnicodeBlock
    /**  * 判断输入的是汉字  */ public static boolean isChinese(char c) {        Character.UnicodeBlock ub = Character.UnicodeBlock.of(c);    
  • java下实现调用oracle的存储过程和函数 aijuans javaorale
    1.创建表：STOCK_PRICES     2.插入测试数据：     3.建立一个返回游标：  PKG_PUB_UTILS   4.创建和存储过程：P_GET_PRICE     5.创建函数：   6.JAVA调用存储过程返回结果集 JDBCoracle10G_INVO
  • Velocity Toolbox antlove 模板toolboxvelocity
    velocity.VelocityUtil package velocity; import org.apache.velocity.Template; import org.apache.velocity.app.Velocity; import org.apache.velocity.app.VelocityEngine; import org.apache.velocity.c
  • JAVA正则表达式匹配基础 百合不是茶 java正则表达式的匹配
      正则表达式;提高程序的性能,简化代码,提高代码的可读性,简化对字符串的操作   正则表达式的用途; 字符串的匹配 字符串的分割 字符串的查找 字符串的替换       正则表达式的验证语法     [a] //[]表示这个字符只出现一次 ,[a] 表示a只出现一
  • 是否使用EL表达式的配置 bijian1013 jspweb.xmlELEasyTemplate
            今天在开发过程中发现一个细节问题，由于前端采用EasyTemplate模板方法实现数据展示，但老是不能正常显示出来。后来发现竟是EL将我的EasyTemplate的${...}解释执行了，导致我的模板不能正常展示后台数据。         网
  • 精通Oracle10编程SQL(1-3)PLSQL基础 bijian1013 oracle数据库plsql
    --只包含执行部分的PL/SQL块 --set serveroutput off begin dbms_output.put_line('Hello,everyone!'); end; select * from emp; --包含定义部分和执行部分的PL/SQL块 declare v_ename varchar2(5); begin select
  • 【Nginx三】Nginx作为反向代理服务器 bit1129 nginx
    Nginx一个常用的功能是作为代理服务器。代理服务器通常完成如下的功能：   接受客户端请求 将请求转发给被代理的服务器 从被代理的服务器获得响应结果 把响应结果返回给客户端 实例 本文把Nginx配置成一个简单的代理服务器 对于静态的html和图片，直接从Nginx获取 对于动态的页面，例如JSP或者Servlet，Nginx则将请求转发给Res
  • Plugin execution not covered by lifecycle configuration: org.apache.maven.plugin blackproof maven报错
    转：http://stackoverflow.com/questions/6352208/how-to-solve-plugin-execution-not-covered-by-lifecycle-configuration-for-sprin   maven报错： Plugin execution not covered by lifecycle configuration:
  • 发布docker程序到marathon ronin47 docker 发布应用
    1 发布docker程序到marathon 1.1 搭建私有docker registry 1.1.1 安装docker regisry docker pull docker-registry docker run -t -p 5000:5000 docker-registry 下载docker镜像并发布到私有registry docker pull consol/tomcat-8.0
  • java-57-用两个栈实现队列&&用两个队列实现一个栈 bylijinnan java
    import java.util.ArrayList; import java.util.List; import java.util.Stack; /* * Q 57 用两个栈实现队列 */ public class QueueImplementByTwoStacks { private Stack<Integer> stack1; pr
  • Nginx配置性能优化 cfyme nginx
    转载地址：http://blog.csdn.net/xifeijian/article/details/20956605   大多数的Nginx安装指南告诉你如下基础知识——通过apt-get安装，修改这里或那里的几行配置，好了，你已经有了一个Web服务器了。而且，在大多数情况下，一个常规安装的nginx对你的网站来说已经能很好地工作了。然而，如果你真的想挤压出Nginx的性能，你必
  • [JAVA图形图像]JAVA体系需要稳扎稳打,逐步推进图像图形处理技术 comsci java
         对图形图像进行精确处理，需要大量的数学工具，即使是从底层硬件模拟层开始设计，也离不开大量的数学工具包，因为我认为，JAVA语言体系在图形图像处理模块上面的研发工作，需要从开发一些基础的，类似实时数学函数构造器和解析器的软件包入手，而不是急于利用第三方代码工具来实现一个不严格的图形图像处理软件......   &nb
  • MonkeyRunner的使用 dai_lm androidMonkeyRunner
    要使用MonkeyRunner，就要学习使用Python，哎 先抄一段官方doc里的代码 作用是启动一个程序（应该是启动程序默认的Activity），然后按MENU键，并截屏 # Imports the monkeyrunner modules used by this program from com.android.monkeyrunner import MonkeyRun
  • Hadoop-- 海量文件的分布式计算处理方案 datamachine mapreducehadoop分布式计算
    csdn的一个关于hadoop的分布式处理方案，存档。 原帖：http://blog.csdn.net/calvinxiu/article/details/1506112。     Hadoop 是Google MapReduce的一个Java实现。MapReduce是一种简化的分布式编程模式，让程序自动分布到一个由普通机器组成的超大集群上并发执行。就如同ja
  • 以資料庫驗證登入 dcj3sjt126com yii
    以資料庫驗證登入 由於 Yii 內定的原始框架程式, 採用綁定在UserIdentity.php 的 demo 與 admin 帳號密碼:    public function authenticate()    {        $users=array( &nbs
  • github做webhooks：[2]php版本自动触发更新 dcj3sjt126com githubgitwebhooks
    上次已经说过了如何在github控制面板做查看url的返回信息了。这次就到了直接贴钩子代码的时候了。 工具/原料 git github 方法/步骤   在github的setting里面的webhooks里把我们的url地址填进去。   钩子更新的代码如下： error_reportin
  • Eos开发常用表达式 蕃薯耀 Eos开发Eos入门Eos开发常用表达式
    Eos开发常用表达式 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2014年8月18日 15:03:35 星期一     &
  • SpringSecurity3.X--SpEL 表达式 hanqunfeng SpringSecurity
    使用 Spring 表达式语言配置访问控制，要实现这一功能的直接方式是在<http>配置元素上添加 use-expressions 属性：   <http auto-config="true" use-expressions="true"> 这样就会在投票器中自动增加一个投票器：org.springframework
  • Redis vs Memcache IXHONG redis
    1. Redis中，并不是所有的数据都一直存储在内存中的，这是和Memcached相比一个最大的区别。 2. Redis不仅仅支持简单的k/v类型的数据，同时还提供list，set，hash等数据结构的存储。 3. Redis支持数据的备份，即master-slave模式的数据备份。 4. Redis支持数据的持久化，可以将内存中的数据保持在磁盘中，重启的时候可以再次加载进行使用。 Red
  • Python - 装饰器使用过程中的误区解读 kvhur JavaScriptjqueryhtml5css
    大家都知道装饰器是一个很著名的设计模式，经常被用于AOP(面向切面编程)的场景，较为经典的有插入日志，性能测试，事务处理，Web权限校验， Cache等。 原文链接：http://www.gbtags.com/gb/share/5563.htm Python语言本身提供了装饰器语法（@），典型的装饰器实现如下：   @function_wrapper de
  • 架构师之mybatis-----update 带case when 针对多种情况更新 nannan408 case when
    1.前言.    如题. 2. 代码.   <update id="batchUpdate" parameterType="java.util.List"> <foreach collection="list" item="list" index=&
  • Algorithm算法视频教程 栏目记者 Algorithm算法
    课程：Algorithm算法视频教程 百度网盘下载地址： http://pan.baidu.com/s/1qWFjjQW 密码: 2mji 程序写的好不好,还得看算法屌不屌！Algorithm算法博大精深。 一、课程内容： 课时1、算法的基本概念 + Sequential search 课时2、Binary search 课时3、Hash table 课时4、Algor
  • C语言算法之冒泡排序 qiufeihu c算法
    任意输入10个数字由小到大进行排序。 代码： #include <stdio.h> int main() { int i,j,t,a[11]; /*定义变量及数组为基本类型*/ for(i = 1;i < 11;i++){ scanf("%d",&a[i]); /*从键盘中输入10个数*/ } for
  • JSP异常处理 wyzuomumu Webjsp
    1.在可能发生异常的网页中通过指令将HTTP请求转发给另一个专门处理异常的网页中: <%@ page errorPage="errors.jsp"%>   2.在处理异常的网页中做如下声明： errors.jsp: <%@ page isErrorPage="true"%>，这样设置完后就可以在网页中直接访问exc
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他