jqplot - 单个值,而不是堆积图中的总计

2023-11-22

In a stacked bar chart we can show total of each series in every stack, like this current However I want value of each series to be shown, not total like this(please ignore the fact that the two samples have different number of series) desired Additionally I would like to show the total of the stack at the top. What i mean is that, f you look at the first graph, in the first bar, values are 5,15(5+10),24(15+9). My desired result should be like the second graph, where values for the first bar are like, 10,9 and finally a total at the top 19
Is it possible with this library?


这里有点黑客行为。由于您希望为每个系列多一个标签,因此我引入了一个“空”系列。不过,它很好地复制了你想要的东西。小提琴here.

$(document).ready(function(){
  var s1 = [5, 6];
  var s2 = [7, 5];
  var s3 = [14, 9];
  var s4 = [0, 0]; //empty series just for total labels

  var pLabels1 = []; // arrays for each inner label
  var pLabels2 = [];
  var pLabels3 = [];
  var pLabelsTotal = []; // array of totals above each column
  for (var i = 0; i < s1.length; i++){
      pLabels1.push('<div style="border:1px solid gray">'+s1[i]+'</div>');
      pLabels2.push('<div style="border:1px solid gray">'+s2[i]+'</div>');
      pLabels3.push('<div style="border:1px solid gray">'+s3[i]+'</div>');
      pLabelsTotal.push(s1[i]+s2[i]+s3[i]);      
  }   

  plot3 = $.jqplot('chart2', [s1, s2, s3, s4], {
    // Tell the plot to stack the bars.
    stackSeries: true,
    captureRightClick: true,
    seriesDefaults:{
      renderer:$.jqplot.BarRenderer,
      rendererOptions: {
          // Put a 30 pixel margin between bars.
          barMargin: 30,
          // Highlight bars when mouse button pressed.
          // Disables default highlighting on mouse over.
          highlightMouseDown: true   
      },
    },
    series:[
        {
            pointLabels:{
                show:true,
                labels:pLabels1,
                ypadding: -25,
                escapeHTML:false
            }
        },
        {
            pointLabels:{
                show:true,
                labels:pLabels2,
                ypadding: -25,
                escapeHTML:false
            }
        },
                {
            pointLabels:{
                show:true,
                labels:pLabels3,
                ypadding: -25,
                escapeHTML:false
            }
        },
              {
            pointLabels:{
                show:true,
                labels:pLabelsTotal,
                ypadding: 7,
                escapeHTML:false
            }
        }
    ],
    axes: {
      xaxis: {
          renderer: $.jqplot.CategoryAxisRenderer
      },
      yaxis: {
        padMin: 0,
        min: 0
      }
    },
    legend: {
      show: false,
    }      
  });
});

生产:

enter image description here

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jqplot - 单个值,而不是堆积图中的总计 的相关文章

  • 在 Magento 中使用缩略图切换基本图像

    在定制的产品视图页面上 我正在处理基本图像 大图像 和缩略图列表 这些缩略图是与媒体库中的产品相关的其他图像 它们只是普通图像 而不是定义的图像 缩略图 我的任务是获取它 以便当您单击缩略图时它会更改上面的基本图像 我已经可以工作了 但是我
  • 我无法自动播放 vimeo 视频(移动设备)

    我试图autoplay包含在的视频iframe在移动设备上 该应用程序运行良好 但用户必须单击 iFrame 内的按钮才能播放视频 我已经尝试使用 autoplay 1 中的参数iframe但它在移动设备上不起作用 在桌面上也很好 你能帮助
  • 无限水平滚动 Div

    我需要一个 div 当您将鼠标进一步向右或向左移动时 它会水平滚动 我发现 Smooth Div Scroll 插件 http www smoothdivscroll com 非常接近我的需要 然而 这存在一些问题 我需要能够使滚动元素从设
  • HTML 解析 - 从 div 内的表格获取数据?

    我对 HTML 解析 抓取的整个想法还比较陌生 我希望我能来这里获得我需要的帮助 基本上我想要做的 我认为 是指定我希望从中获取数据的页面的 url 在这种情况下 http www epgpweb com guild us Caelestr
  • JQuery:获取单选按钮值

    我有以下 HTML HTML
  • jQuery:在 jQuery 对象中存储附加/额外的数据/信息?

    在 jQuery 对象中存储额外的数据是否可能且明智 现在我有包含一些数据的对象 但这些对象也有该数据的视觉表示 这可行 但我有很多代码来保持它们同步 例如 如果您从 dom 中删除一个对象 我还必须从对象数组中删除相关对象 删除相当简单
  • javaScript从单个值数组返回一个新的成对值数组[重复]

    这个问题在这里已经有答案了 可能的重复 将数组分割成块 https stackoverflow com questions 8495687 split array into chunks 我正在尝试将值数组转换为新的配对值数组 例如我需要转
  • Web API 复杂参数属性均为 null

    我有一个 Web API 服务调用可以更新用户的首选项 不幸的是 当我从 jQuery ajax 调用中调用此 POST 方法时 请求参数对象的属性始终为 null 或默认值 而不是传入的值 如果我使用 REST 客户端调用相同的方法 我使
  • 引导多重选择(刷新)无法正常工作

    我正在使用引导多选列表框 当用户在多选上选择选项时 它会正确显示 但有一个选项可以重置以前选择的选项 当用户点击重置按钮时 自动style display none添加到下拉按钮 下拉列表变得不可见 这是我的代码 button click
  • 带分页的过滤表

    我想要一个带有分页的表格 同时在表格标题中带有搜索框 所以使用这段代码jsfiddle分页 http jsfiddle net Xugej 1445 I want output like this 这是我的过滤代码 function sea
  • 如何在没有消息时隐藏 Bootstrap 警报框

    我用 Bootstrap 做了一个简单的警报框 如下所示 div class alertBox span class alert alert info bag session username span div When there is
  • 在 jQuery 中将值转换为小数点后两位 [重复]

    这个问题在这里已经有答案了 可能的重复 JavaScript 格式化数字 精确到两位小数 https stackoverflow com questions 1726630 javascript formatting number with
  • 如何在 jQuery.knob 中添加值后缀

    我有问题jQuery knob http anthonyterrien com knob 我需要添加一个Sufixx至旋钮中的值 例如 我需要一个后缀 数值后 我只是输入数值字段 它会显示 但此时旋钮不会显示状态 它不会显示旋钮状态 但后缀
  • 有没有办法一次性禁用一堆表单元素?

    我想根据某些条件禁用 HTML 表单元素的一部分 这似乎是执行此操作的理想方法 fieldset fieldset
  • 数据表在按钮单击后初始化表(ajax,jquery)

    我在加载数据表对象时遇到问题 当我在页面加载时初始化并填充表时 它可以正常工作 下面的代码在页面重新加载时完美运行
  • Javascript 函数 - 将地理位置代码转换为街道地址

    我正在寻找一个 javascript 函数或 jquery 库来将地理位置代码 例如 42 2342 32 23452 转换为街道地址 举些例子 navigator geolocation getCurrentPosition functi
  • AttachEvent 或 addEventListener - 存储在哪里?

    在 jQuery 中 如果我这样做 a click function Do something 点击事件存储在 a data events 我可以像这样获取它 jQuery each a data events function i eve
  • 将箭头添加到 Twitter Bootstrap 的下拉药丸中?

    我的 Twitter 引导下拉按钮成功工作 但我有一个小问题 这里的黑色导航栏 http twitter github com bootstrap javascript html dropdowns http twitter github
  • 如何使用 jQuery 获取数组键?

    下午好 我有一个数组 其中包含一些键和值 然后我需要获取数组键而不是其中的数据 我想用 jQuery 来做到这一点 例如 我知道 PHP 有一个名为 array keys 的函数 它将数组作为参数 并返回一个数组 其中包含每个索引中的每个键
  • jQuery 显示/隐藏兄弟姐妹

    我有这段代码 旨在首先隐藏除第一个元素之外的所有相关元素 这个 做的不错啊接下来 它应该根据选择的项目显示 隐藏这些元素 但这部分不起作用 想法 jQuery accordion dl not first child hide hide a

随机推荐

  • Mongoose 将存储的 UTC 日期转换为本地时间?

    我想知道这是否正常 或者我是否在架构设置或查询过程中遗漏了某些内容 我的应用程序和猫鼬在 mongodb 中正确存储了 UTC 日期 通过 mongo shell 查看文档可以确认这一点 当我通过 mongoose 从 mongodb 检索
  • 在 SQL Server 中将 varchar 转换为 uniqueidentifier

    我无法控制其架构的表包含定义为 varchar 50 的列 该列以 a89b1acd95016ae6b9c8aabb07da2010 格式存储唯一标识符 无连字符 我想将它们转换为 SQL 中的唯一标识符 以便传递给 Net GUID 但是
  • 在 Spring MVC 中从控制器查找区域设置

    我正在使用 Spring 3 0 如何在基于注释的控制器中找到由 LocaleResolver 设置的当前区域设置 Thanks 您可以声明类型的参数Locale在你的控制器方法中 RequestMapping public ModelAn
  • 使用 Java API 将 Parquet 格式写入 HDFS,而不使用 Avro 和 MR

    简单的写法是什么实木复合地板格式 to HDFS 使用Java API 通过直接创建 Parquet SchemaPojo 的 不使用avro and MR 我发现的示例已经过时 并且使用已弃用的方法 还使用 Avro spark 或 MR
  • 应用程序池和工作进程线程之间有什么关系?

    我正在对 ASP NET 应用程序中的重新启动进行故障排除 该应用程序每天重新启动大约 20 次 我们强烈怀疑应用程序的一部分 因为当这一特定功能投入生产时 重启就开始了 我已经使用 log4net 库向这些页面添加了一些日志记录 但我在解
  • 将文本附加到 RichTextBox 的最快方法?

    我有一个带有 RichTextBox 控件的应用程序 其中的过程几乎总是添加文本 RichTextBox1 Text vbNewLine Title AlbumName RichTextBox1 Text vbNewLine Genre A
  • 序数编码或 One-Hot 编码

    如果我们不确定分类特征的性质 例如它们是名义特征还是序数特征 我们应该使用哪种编码 序数编码还是单热编码 关于这个主题有明确的规则吗 我看到很多人在没有方向的分类数据上使用序数编码 假设有一个频数表 some data some col v
  • Swift 中开关盒的详尽条件

    苹果文档 says 每个 switch 语句都必须是详尽的 也就是说 每一个可能的 正在考虑的类型的值必须与其中之一匹配 切换案例 所以在新的 Xcode 中我放置了这样的代码 println UInt16 min Output 0 pri
  • C# 通过 T 的成员对列表 进行二进制搜索

    我有一个基类Event with a DateTime member TimeStamp 许多其他事件类将从中派生 我希望能够快速搜索事件列表 因此我想使用二分搜索 列表数据按时间戳排序 但同时发生的事件可能存在重复的时间戳 所以我开始写这
  • Node.js MySQL 模块 - 抛出错误; // 重新抛出非 MySQL 错误;

    今天我尝试了来自 w3schools 的 node js mysql 片段 var mysql require mysql var con mysql createConnection host localhost user roots W
  • 如何在 Coq 中使用归纳类型来处理案例

    我想使用destruct通过案例来证明陈述的策略 我在网上读了几个例子 但我很困惑 有人可以更好地解释一下吗 这是一个小例子 还有其他方法可以解决它 但尝试使用destruct Inductive three zero one two Le
  • Visual Studio C++ 是否可以在不链接的情况下编译对象

    我正在运行 VS 2010 SP1 并且有一个每周运行一次的特殊分析配置 因为构建服务器需要很长时间来分析所有内容 我希望此配置无需链接即可运行 如果分析通过了项目中的所有代码 那么我希望构建继续进行下一个项目而不链接 我看不出有什么方法可
  • Python套接字接受块-防止应用程序退出

    我编写了一个非常简单的 python 类 它等待套接字上的连接 目的是将此类粘贴到现有应用程序中 并将数据异步发送到连接的客户端 问题是 当等待 socket accept 时 我无法通过按 ctrl c 来结束我的应用程序 我也无法检测到
  • JDBC 到 Spark Dataframe - 如何确保均匀分区?

    我是 Spark 新手 正在致力于通过 JDBC 从 Postgres 数据库表创建 DataFrame 使用spark read jdbc 我对分区选项有点困惑 特别是分区列 下界 上限 and 分区数 文档似乎表明这些字段是可选的 如果
  • JSON - Spring MVC:如何将 json 数据发布到 spring MVC 控制器

    我在发布 JSON 数据时遇到问题jsp to controller 每次我尝试都会收到 ajax 错误Bad Request 我对 JSON 很陌生 我真的不知道我做错了什么 我搜索并尝试了一些可以在该网站中找到的示例 但仍然遇到问题 在
  • 使用 JAX-WS:如何设置用户代理属性

    我对此进行了搜索并发现了一些未遂事件 我创建了一个 java 客户端来使用 JAX WS 来使用 Web 服务 使用 JAX 时有没有办法设置 HTTP USER AGENT 值 我希望在特定客户端 我的 访问它时获得我的网络服务日志 因此
  • 检测何时连接新显示器

    我正在编写一个需要两个显示器的应用程序 一个用于控制面板 另一个用于输出 我所拥有的是这样的 如果只有一个显示器 应用程序会在其上显示两种表单 但如果有两个显示器 则输出表单将转到另一个 问题是这只在应用程序启动时才会发生 换句话说 如果应
  • 在jsf中使用json将数据从bean发送到javascript

    我想将我的数组列表从 ManagedBean 发送到 JavaScript 代码 我的豆子在这里 public void getDataAsJson String dizi Tokyo Jakarta New York Seoul Mani
  • 如何计算列的平均值,然后将其包含在oracle中的选择查询中?

    我的桌子是 create table mobile id integer m name varchar 20 cost integer 其值为 insert into mobile values 10 NOkia 100 insert in
  • jqplot - 单个值,而不是堆积图中的总计

    In a stacked bar chart we can show total of each series in every stack like this However I want value of each series to