源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jQuery简单图表peity.js使用示例

  • 时间:2022-06-17 14:43 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jQuery简单图表peity.js使用示例
[img]http://files.jb51.net/file_images/article/201405/20140502140729.gif?20144214754[/img]
[u]复制代码[/u] 代码如下:
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>无标题页</title> <script type="text/javascript" src="jQuery.js"></script> <script type="text/javascript" src="jquery.peity.js"></script> <script type="text/javascript"> jQuery(function(){ $(".bar-colours-1").peity("bar", { colours: ["red", "green", "blue"],width: 100,height:100 }) $(".bar-colours-2").peity("bar", { colours: function(value) { return value > 0 ? "green" : "red" },width: 100,height:100 }) $(".bar-colours-3").peity("bar", { colours: function(_, i, all) { var g = parseInt((i / all.length) * 255) return "rgb(255, " + g + ", 0)" },width: 100,height:100 }) $(".pie-colours-1").peity("pie", { colours: ["cyan", "magenta", "yellow", "black"],diameter:100 }) $(".pie-colours-2").peity("pie", { colours: function(_, i, all) { var g = parseInt((i / all.length) * 255) return "rgb(255, " + g + ", 0)" },diameter:100 }) var updatingChart = $(".updating-chart").peity("line", { width: 150,height:50}) setInterval(function() { var random = Math.round(Math.random() * 10) var values = updatingChart.text().split(",") values.shift() values.push(random) updatingChart .text(values.join(",")) .change() }, 1000) }) </script> </head> <body> <span class="bar-colours-1">5,3,9,6,5,9,7,3,5,2</span> <span class="bar-colours-2">5,3,2,-1,-3,-2,2,3,5,2</span> <span class="bar-colours-3">0,-3,-6,-4,-5,-4,-7,-3,-5,-2</span> <br /> <span class="pie-colours-1">4,7,6,5</span> <span class="pie-colours-2">5,3,9,6,5</span> <br /> <span class="updating-chart">5,3,9,6,5,9,7,3,5,2,5,3,9,6,5,9,7,3,5,2</span> </body> </html>
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部