如何拼接FusionCharts的JSON格式的双轴图
1、问题背景
假如,项目中遇到这样一个问题:利用FusionCharts中的JSON格式拼接双轴图,并将JSON字符串转换成JSON对象传输到前台,在页面上展示出来。
2、设计源码
/** * * @title:DoubleYaxis.java * @Package:com.you.utils * @Description:<h3>一句话描述功能</h3> * @author:游海东 * @date:2015-3-25下午8:06:57 * @version V1.0 * */ package com.you.utils; import net.sf.json.JSONObject; /** * * 项目名称:SSH * 类名称:DoubleYaxis * 类描述: * 创建人:游海东 * 创建时间:2015-3-25下午8:06:57 * 修改人:游海东 * 修改时间:2015-3-25下午8:06:57 * 修改备注: * @version V1.0 * */ public class DoubleYaxis { /** * * 方法名:transform * 方法类型:ChartUtils * 参数:@param str * 参数:@return * @return:StringBuilder * @throws */ public static StringBuilder transform(String str) { return new StringBuilder(str); } /** * * 方法名:buildJson * 方法类型:DoubleYaxis * 参数:@return * @return :JSONObject * @throws */ public static JSONObject buildJson() { StringBuilder chartHead = new StringBuilder(); StringBuilder xAxis = new StringBuilder(); StringBuilder yAxisOne = new StringBuilder(); StringBuilder yAxisTwo = new StringBuilder(); //FusionChart中的chart chartHead.append("{'chart':{'caption':'2014年销售水平分布','xaxisname':'月份','yaxisname':'销量','showvalues':'0'},'categories':[{'category':["); for(int i=1;i<=12;i++) { xAxis.append("{'label':'").append(i).append("月'},"); } yAxisOne.append("'dataset':[{'seriesname':'苹果','data':["); yAxisTwo.append("{'seriesname':'橘子','parentyaxis':'S','data':["); for(int j=1;j<=12;j++) { yAxisOne.append("{'value':'").append(j*100).append("'},"); yAxisTwo.append("{'value':'").append(j*200).append("'},"); } chartHead.append(xAxis.toString().substring(0, xAxis.toString().length()-1)) .append("]}],") .append(yAxisOne.toString().substring(0, yAxisOne.length()-1)) .append("]},") .append(yAxisTwo.toString().substring(0, yAxisTwo.length()-1)) .append("]}]}"); JSONObject jsonobject = JSONObject.fromObject(chartHead.toString()); return jsonobject; } /** * * 方法名:main * 方法类型:DoubleYaxis * 参数:@param args * @return :void * @throws */ public static void main(String[] args) { System.out.println("FusionChart多系列图之双轴图:"+buildJson()); } }
运行结果:
FusionChart多系列图之双轴图:{"chart":{"caption":"2014年销售分布","xaxisname":"月份","yaxisname":"销量","showvalues":"0"},"categories":[{"category":[{"label":"1月"},{"label":"2月"},{"label":"3月"},{"label":"4月"},{"label":"5月"},{"label":"6月"},{"label":"7月"},{"label":"8月"},{"label":"9月"},{"label":"10月"},{"label":"11月"},{"label":"12月"}]}],"dataset":[{"seriesname":"苹果","data":[{"value":"100"},{"value":"200"},{"value":"300"},{"value":"400"},{"value":"500"},{"value":"600"},{"value":"700"},{"value":"800"},{"value":"900"},{"value":"1000"},{"value":"1100"},{"value":"1200"}]},{"seriesname":"橘子","parentyaxis":"S","data":[{"value":"200"},{"value":"400"},{"value":"600"},{"value":"800"},{"value":"1000"},{"value":"1200"},{"value":"1400"},{"value":"1600"},{"value":"1800"},{"value":"2000"},{"value":"2200"},{"value":"2400"}]}]}
3、格式化后
{ "chart": { "caption": "2014年销售分布", "xaxisname": "销量", "yaxisname": "人数", "showvalues": "0" }, "categories": [ { "category": [ { "label": "1月" }, { "label": "2月" }, { "label": "3月" }, { "label": "4月" }, { "label": "5月" }, { "label": "6月" }, { "label": "7月" }, { "label": "8月" }, { "label": "9月" }, { "label": "10月" }, { "label": "11月" }, { "label": "12月" } ] } ], "dataset": [ { "seriesname": "苹果", "data": [ { "value": "100" }, { "value": "200" }, { "value": "300" }, { "value": "400" }, { "value": "500" }, { "value": "600" }, { "value": "700" }, { "value": "800" }, { "value": "900" }, { "value": "1000" }, { "value": "1100" }, { "value": "1200" } ] }, { "seriesname": "橘子", "parentyaxis": "S", "data": [ { "value": "200" }, { "value": "400" }, { "value": "600" }, { "value": "800" }, { "value": "1000" }, { "value": "1200" }, { "value": "1400" }, { "value": "1600" }, { "value": "1800" }, { "value": "2000" }, { "value": "2200" }, { "value": "2400" } ] } ] }
如何拼接FusionCharts的JSON格式的双轴图的更多相关文章
- pyhton中matplotlib箱线图的绘制(matplotlib双轴图、箱线图、散点图以及相关系数矩阵图))
//2019.07.23 1.箱形图,又称为盒式图,一般可以很好地反映出数据分布的特征,也可以进行多项数据之间分布特征的比较,它主要包含五个基础数据:中位数,两个上下分位数以及上下边缘线数据 其中的一 ...
- HighCharts之2D柱状图、折线图的组合双轴图
HighCharts之2D柱状图.折线图的组合双轴图 1.实例源码 DoubleAxis.html: <!DOCTYPE html> <html> <head> & ...
- http接口调用,传递json格式带双引号问题
springmvc 配置好会自动转换json格式,只要配置他转格式之前,在转次String类型就好
- Echarts双轴图的配置.
在series中的数据组加个属性,yAxisIndex: 1,表示第二个数据用的是第二个y轴,不加这个属性的话都是默认0,即第一个属性,再配置yAxis的值第一个为左侧坐标轴,右册坐标轴为第二个配置参 ...
- python字典转化成json格式。JSONEncoder和JSONDecoder两个类来实现Json字符串和dict类型数据的互相转换
遇到问题:进行Webservice接口测试时,对接口入参数据进行了处理,变成了dict格式,去进行接口请求报错. 需要转成成json格式,双引号去扩. 如下: 更改代码: # 在Python标准库的j ...
- Flex实现双轴条状图
1.问题背景 一般的,柱状图可以实现双轴图,但是如何实现双轴条状图? 2.实现实例 <?xml version="1.0" encoding="utf-8" ...
- Ajax请求ashx 返回 json 格式数据常见问题
问题:ashx 返回的字符串json格式,在前台ajax自动解析失败. 问题分析:经过排查,发现是拼接json时出现” ’ “单引号,jquery无法解析,用” “ “双引号才可以.例如: stri ...
- servlet与ajax数据交换(json格式)
JSON数据格式: JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式. 易于人阅读和编写.同时也易于机器解析和生成. 它基于的一个子集. JSON采用完全独 ...
- servlet中将值以json格式传入
详细连接https://blog.csdn.net/e_wsq/article/details/71038270$('#but_json_json').click(function(){ }; $.a ...
随机推荐
- mysql5.6默认情况下内存占用太大
下载了mysql5.6.12 ,默认占用内存达400多M, 而原来使用的5.0 只有30M.. 解决方案:调整以下参数----------------performance_schema_max_t ...
- GitHub入门之路(1)
介绍 从本篇文章开始,是一系列介绍GitHub相关内容以及Git的一些基本操作的文章,记录了自己的学习过程. 概要 简单介绍GitHub是什么,Git又是什么. 1.Git是什么 Git是一款分散型的 ...
- BZOJ 1037: [ZJOI2008]生日聚会Party [序列DP]
1037: [ZJOI2008]生日聚会Party Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 2249 Solved: 1337[Submit] ...
- flask入门与发送邮件与QQ邮箱
前言: 快两个月没写博客了, 原因是懒了, 没有最初写博客那种看到阅读量上涨, 别人给自己文章点赞后的开心. 心态也发生了不少变化. 有机会再来写写. 前两个月我去厦门某公司实习, 本着去厦门玩一玩还 ...
- tomcat管理授权:tomcat-users.xml
ou are not authorized to view this page. If you have already configured the Manager application to a ...
- 洛谷P1854 花店橱窗布置 分析+题解代码
洛谷P1854 花店橱窗布置 分析+题解代码 蒟蒻的第一道提高+/省选-,纪念一下. 题目描述: 某花店现有F束花,每一束花的品种都不一样,同时至少有同样数量的花瓶,被按顺序摆成一行,花瓶的位置是固定 ...
- ie 浏览器文本输入框和密码输入框的默认样式
登录页在ie浏览器上的默认样式 输入框后面的X 密码框后面的眼睛 如下图 解决方案 /*ie文本框背景色*/ input::-ms-clear { display: none; } /*ie文本 ...
- Java经典编程题50道之三十五
有一个数组,将其最大的元素与第一个元素交换,最小的元素与最后一个元素交换,然后输出数组. public class Example35 { public static void main(Str ...
- ASP.NET Core Logging in Elasticsearch with Kibana
在微服务化盛行的今天,日志的收集.分析越来越重要.ASP.NET Core 提供了一个统一的,轻量级的Logining系统,并可以很方便的与第三方日志框架集成.我们也可以根据不同的场景进行扩展,因为A ...
- Smarty3.1.3安装使用
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Verdana } span.s1 { } Smarty简介 Smarty是一个PHP的模板引 ...