如何拼接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 ...
随机推荐
- Cypher查询语言--Neo4j 之高级篇 (六)
目录 排序Order by 通过节点属性排序节点 通过多节点属性排序节点 倒序排列节点 空值排序 Skip 跳过前三个 返回中间两个 Limit 返回第一部分 函数Functions 判断 All A ...
- Struts2的配置和一个简单的例子
Struts2的配置和一个简单的例子 笔记仓库:https://github.com/nnngu/LearningNotes 简介 这篇文章主要讲如何在 IntelliJ IDEA 中使用 Strut ...
- HDU 5608 function [杜教筛]
HDU 5608 function 题意:数论函数满足\(N^2-3N+2=\sum_{d|N} f(d)\),求前缀和 裸题-连卷上\(1\)都告诉你了 预处理\(S(n)\)的话反演一下用枚举倍数 ...
- [原]开源的视频转换器,支持gpu,绝对好用ffmpeg的GUI==》dmMediaConverter最新版本2.3
dmMediaConverter is a crossplatform FFmpeg frontend (GUI) exposing some of its features. It is inten ...
- Java数据结构和算法(十五)——无权无向图
前面我们介绍了树这种数据结构,树是由n(n>0)个有限节点通过连接它们的边组成一个具有层次关系的集合,把它叫做“树”是因为它看起来像一棵倒挂的树,包括二叉树.红黑树.2-3-4树.堆等各种不同的 ...
- Python中的浅拷贝与深拷贝
编者注:本文主要参考了<Python核心编程(第二版)> 以下都是参考资料后,我自己的理解,如有错误希望大家不吝赐教. 大家有没有遇到这样一种情况,对象赋值后,对其中一个变量进行修改,另外 ...
- 小甲鱼OD学习第11讲
这次我们的任务是破解这个需要注册的软件,如下图所示 我们这次从字符串入手,我们查找 unregistered 字符串 然后我们在如下图的字符串下断点 然后我们来到断点处,我们观察到 地址为 0040 ...
- CentOS安装EPEL Remi
EPEL,Remi 因为Centos官方源很多软件都没有,编译安装又比较麻烦,可以安装EPEL源Remi源解决此问题. CentOS 5.x : wget http://dl.fedoraprojec ...
- UITableView 之 点击cell 实现两个自定义cell之间的切换
- Math.abs(~2018),掌握规律!
Math.abs(~2018) 这要用到一些计算机的基础知识. Math.abs(x)指的是返回一个数的绝对值,而关键在"~2018",这是取反操作符,故取相反数得结果为-2018 ...