{ "chart":{ "caption":"Web visits", "compactdatamode":"1", "dataseparator":"|" }, "categories":"Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec", "dataset":[{ "seriesname":"2006", "data":"27400|29800|25800|26800|29600|32600|31800|36700|29700|31900|34800|24800" }, { "seriesname":"2005", "data": "10000|11500|12500|15000|11000|9800|11800|19700|21700|21900|22900|20800" } ], "trendlines": { "line": [ { "startvalue": "15000", "displayvalue": "Trend Line 1" }, { "startvalue": "33000", "endvalue": "35000", "istrendzone": "1", "displayvalue": "Trend Zone 1", "showontop": "1", } ] }, "vtrendlines": { "line": [ { "startindex": "5", "displayalways": "1", "displayvalue": "Split", "valueontop": "1" }, { "index": "30", "displayalways": "0", "displaywhencount": "20", "displayvalue": "Dividend", "dashed": "1", "showontop": "1", "color": "FF5904", "thickness":"2", "dashlen": "3", "dashgap": "3" } ] } }
注
Important note to users upgrading from FusionCharts XT-Service Release 2 or lower version:
To overcome a browser related issue, we had no options but to change the Compact JSON data format for Zoom line chart. The changes are listed below:
Change in the categories property: The list of categories are passed as a single string as the value of the categories property. For example, "categories": "Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec"
In earlier versions, the list of categories is passed through the category property in the following fashion: "categories": [{ "category":[ "Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec" ] } ]
Change in the data property of the dataset property: The list of data values are passed as a single string as the value of the data property. For example, "data": "27400|29800|25800|26800|29600|32600|31800|36700|29700|31900|34800|24800"
In earlier versions, the list of data values is passed through the data property in the following fashion: "data": [ "27400|29800|25800|26800|29600|32600|31800|36700|29700|31900|34800|24800" ]
在3.2和早期版本中数据格式应该是
{ "chart": [{ "compactdatamode": "1", "dataseparator": "|" }], "categories": [{"category":["1st January 2009|2nd January 2009|3rd January 2009| 4th January 2009|5th January 2009|6th January 2009|7th January 2009|8th January 2009|9th January 2009|10th January 2009|11th January 2009|12th January 2009|13th January 2009|14th January 2009|15th January 2009|16th January 2009|17th January 2009|18th January 2009|19th January 2009|20th January 2009|21st January 2009|22nd January 2009|23rd January 2009|24th January 2009|25th January 2009|26th January 2009|27th January 2009|28th January 2009|29th January 2009|30th January 2009|31st January 2009|1st February 2009|2nd February 2009|3rd February 2009|4th February 2009|5th February 2009|6th February 2009|7th February 2009|8th February 2009|9th February 2009|10th February 2009|11th February 2009|12th February 2009|13th February 2009|14th February 2009|15th February 2009|16th February 2009|17th February 2009|18th February 2009|19th February 2009|20th February 2009|21st February 2009|22nd February 2009|23rd February 2009|24th February 2009|25th February 2009|26th February 2009|27th February 2009|28th February 2009|1st March 2009|2nd March 2009|3rd March 2009|4th March 2009|5th March 2009|6th March 2009|7th March 2009|8th March 2009|9th March 2009|10th March 2009|11th March 2009|12th March 2009|13th March 2009|14th March 2009|15th March 2009|16th March 2009|17th March 2009|18th March 2009|19th March 2009|20th March 2009|21st March 2009|22nd March 2009|23rd March 2009|24th March 2009|25th March 2009|26th March 2009|27th March 2009|28th March 2009|29th March 2009|30th March 2009|31st March 2009|1st April 2009|2nd April 2009|3rd April 2009|4th April 2009|5th April 2009|6th April 2009|7th April 2009|8th April 2009|9th April 2009|10th April 2009|11th April 2009|12th April 2009|13th April 2009|14th April 2009|15th April 2009|16th April 2009|17th April 2009|18th April 2009|19th April 2009|20th April 2009|21st April 2009|22nd April 2009|23rd April 2009|24th April 2009|25th April 2009|26th April 2009|27th April 2009|28th April 2009|29th April 2009|30th April 2009|1st May 2009|2nd May 2009|3rd May 2009|4th May 2009|5th May 2009|6th May 2009|7th May 2009|8th May 2009|9th May 2009|10th May 2009|11th May 2009|12th May 2009|13th May 2009|14th May 2009|15th May 2009|16th May 2009|17th May 2009|18th May 2009|19th May 2009|20th May 2009|21st May 2009|22nd May 2009|23rd May 2009|24th May 2009|25th May 2009|26th May 2009|27th May 2009|28th May 2009|29th May 2009|30th May 2009|31st May 2009|1st June 2009|2nd June 2009|3rd June 2009|4th June 2009|5th June 2009|6th June 2009|7th June 2009|8th June 2009|9th June 2009|10th June 2009|11th June 2009|12th June 2009|13th June 2009|14th June 2009|15th June 2009|16th June 2009|17th June 2009|18th June 2009|19th June 2009|20th June 2009|21st June 2009|22nd June 2009|23rd June 2009|24th June 2009|25th June 2009|26th June 2009|27th June 2009|28th June 2009|29th June 2009|30th June 2009|1st July 2009|2nd July 2009|3rd July 2009|4th July 2009|5th July 2009|6th July 2009|7th July 2009|8th July 2009|9th July 2009|10th July 2009|11th July 2009|12th July 2009|13th July 2009|14th July 2009|15th July 2009|16th July 2009|17th July 2009|18th July 2009|19th July 2009|20th July 2009|21st July 2009|22nd July 2009|23rd July 2009|24th July 2009|25th July 2009|26th July 2009|27th July 2009|28th July 2009|29th July 2009|30th July 2009|31st July 2009|1st August 2009|2nd August 2009|3rd August 2009|4th August 2009|5th August 2009|6th August 2009|7th August 2009|8th August 2009|9th August 2009|10th August 2009|11th August 2009|12th August 2009|13th August 2009|14th August 2009|15th August 2009|16th August 2009|17th August 2009|18th August 2009|19th August 2009|20th August 2009|21st August 2009|22nd August 2009|23rd August 2009|24th August 2009|25th August 2009|26th August 2009|27th August 2009|28th August 2009|29th August 2009|30th August 2009|31st August 2009|1st September 2009|2nd September 2009|3rd September 2009|4th September 2009|5th September 2009|6th September 2009|7th September 2009|8th September 2009|9th September 2009|10th September 2009|11th September 2009|12th September 2009|13th September 2009|14th September 2009|15th September 2009|16th September 2009|17th September 2009|18th September 2009|19th September 2009|20th September 2009|21st September 2009|22nd September 2009|23rd September 2009|24th September 2009|25th September 2009|26th September 2009|27th September 2009|28th September 2009|29th September 2009|30th September 2009|1st October 2009|2nd October 2009|3rd October 2009|4th October 2009|5th October 2009|6th October 2009|7th October 2009|8th October 2009|9th October 2009|10th October 2009|11th October 2009|12th October 2009|13th October 2009|14th October 2009|15th October 2009|16th October 2009|17th October 2009|18th October 2009|19th October 2009|20th October 2009|21st October 2009|22nd October 2009|23rd October 2009|24th October 2009|25th October 2009|26th October 2009|27th October 2009|28th October 2009|29th October 2009|30th October 2009|31st October 2009|1st November 2009|2nd November 2009|3rd November 2009|4th November 2009|5th November 2009|6th November 2009|7th November 2009|8th November 2009|9th November 2009|10th November 2009|11th November 2009|12th November 2009|13th November 2009|14th November 2009|15th November 2009|16th November 2009|17th November 2009|18th November 2009|19th November 2009|20th November 2009|21st November 2009|22nd November 2009|23rd November 2009|24th November 2009|25th November 2009|26th November 2009|27th November 2009|28th November 2009|29th November 2009|30th November 2009|1st December 2009|2nd December 2009|3rd December 2009|4th December 2009|5th December 2009|6th December 2009|7th December 2009|8th December 2009|9th December 2009|10th December 2009|11th December 2009|12th December 2009|13th December 2009|14th December 2009|15th December 2009|16th December 2009|17th December 2009|18th December 2009|19th December 2009|20th December 2009|21st December 2009|22nd December 2009|23rd December 2009|24th December 2009|25th December 2009|26th December 2009|27th December 2009|28th December 2009|29th December 2009|30th December 2009|31st December 2009"]}] , "dataset": [ { "seriesname": "Website A", "data": ["300|349|627|445|623|575|567|576|745|409|647|690|502|471|694|707| 725|951|853|846|995|967|1084|1028|736|1105|541|780|940|1047|847|853| 1106|963|949|1079|797|941|964|1008|1267|1162|835|980|683|933|1163| 1277|984|678|1018|694|1038|598|922|835|686|789|873|724|1260|1746| 1070|711|854|725|812|944|952|989|1047|841|930|1051|1288|1213|1027| 1297|1022|886|866|1550|1345|871|784|1221|1142|1147|1520|1254|1665| 1027|1266|1088|1470|1760|1298|1184|879|957|719|730|1309|819|897|934| 960|717|656|1072|1021|1121|600|671|730|796|811|933|752|548|507|456| 905|887|824|818|769|648|1477|661|847|1551|780|636|672|455|880|884| 1120|1664|513|1174|935|760|942|1347|1004|814|617|852|632|808|990| 746|1099|679|750|544|1194|935|846|1043|741|669|689|872|1051|677|611| 709|441|598|586|941|919|822|1007|992|766|855|1016|903|761|574|309| 634|1098|633|993|957|1145|731|680|906|1232|1142|779|636|601|768| 582|1042|1096|1405|568|712|673|754|1082|1157|1203|845|659|475|896| 1128|1332|915|535|441|1020|1050|795|634|711|529|666|702|686|823|834| 797|1008|645|757|761|878|752|876|769|1264|1037|1202|965|1165|1167|896| 1285|851|808|893|831|695|801|848|1319|1126|1171|889|1108|1435|1130|975| 978|1501|1036|1161|1318|727|975|1821|1569|1247|1015|1034|953|1325|1543| 1515|1565|1517|962|1353|1541|1204|1476|1215|1262|885|1606|995|1872|1402| 1499|1031|870|1001|1541|1392|1716|1826|993|1152|732|792|1262|1860|1407| 1216|989|830|892|1620|1326|1164|1679|958|1254|971|1428|1696|952|1329| 1276|732|1335|1353|837|906|734|656|636|585|1103|910|995|1046|932|1123| 1158|895|1412|1406|971|926|649|1140|929|1350|701|611|544|527|483|522| 542|115|340|033|234|123|455|125|230|276"] }, { "seriesname": "Website B", "data": ["200|340|627|445|623|575|520|576|745|409|647|690|502|471|650| 707|725|951|853|846|995|967|1084|800|650|1105|541|780|940|1047|847| 853|1500|963|949|950|797|941|964|900|1267|1162|835|980|450|933|1163| 1277|984|500|1018|694|1038|598|910|835|686|705|873|690|1260|1746|825| 711|854|725|812|944|710|989|1047|512|930|1051|1288|1000|1027|1297|800| 886|866|1550|800|871|784|1221|1000|1147|1520|1254|1525|1027|1266|1088| 1470|1350|1298|1184|350|957|719|730|1309|819|897|934|960|717|656|1072| 1021|1121|600|671|730|796|811|933|752|548|507|456|905|887|824|818|769| 648|1477|661|847|1551|780|636|672|455|880|884|1120|1664|513|1174|935| 760|942|1347|1004|814|617|852|632|808|990|746|976|679|750|544|1194|935| 846|1043|741|669|689|872|800|677|611|709|441|598|586|941|523|822|1007| 992|766|855|1210|903|761|574|309|634|850|633|993|957|950|731|680|906| 750|1142|779|636|601|768|582|1042|1096|1405|568|712|400|754|1082|1157| 1033|845|659|475|896|1128|812|915|535|441|576|1050|795|634|711|529|666| 552|686|823|834|797|1212|645|757|761|878|752|556|769|1264|1037|1202|750| 1165|1167|896|1285|551|808|893|831|695|801|520|1319|1126|1171|889|905| 1435|1130|975|978|1501|1036|825|1318|727|975|750|1569|1247|1015|1034| 500|1325|1543|1515|1565|1517|962|1353|1541|1641|1476|1215|1262|250| 1606|995|1250|1402|1499|1031|780|1001|1541|1392|1716|1200|993|1152| 732|792|1262|1560|1407|1216|989|830|892|1620|1326|1164|1219|958|1254| 971|1428|1696|952|1329|1276|732|1152|1353|837|906|734|656|636|585|1541| 910|995|1046|932|1123|1158|895|1332|1406|971|926|649|1140|929|1350|701| 611|544|527|450|522|542|115|340|033|234|123|455|176|200|250"] } ] };
其他属性设置
When specifying data in compact mode, you will necessarily need to specify two attributes in the chart object: "compactDataMode":"1" : This tells the chart that data has been specified in compact mode. "dataSeparator"="|" : This specifies the separator character that will be used to separate labels and data. In the example above, we have used the '|' (pipe) character. You can use comma, semi-colon or any other character. Just make sure that the character is not a part of any label text. The Zoom Line chart supports horizontal trend lines (trendlines and zones) like a standard multi-series chart. However, it supports index based vertical trend lines (vtrendlines) that can be displayed conditionally based on what level of zoom the user has applied on the chart. Following is the JSON code for a vertical trendline: { "startindex": "5", "displayalways": "1", "displayvalue": "Split", "valueontop": "1" } The above vertical trendline has an attribute displayAlways='1' which instructs the chart to show the trendlines at all times, irrespective of level of zoom the chart is being viewed at. Also, the position of trend line is specified in indexes (startIndex and endIndex). Index is based on the number of data items plotted on x-axis (category). The first x-axis label has an index of 1. Following is the JSON code for a conditional vertical trendline: { "index": "30", "displayalways": "0", "displaywhencount": "20", "displayvalue": "Dividend", "dashed": "1", "showontop": "1", "color": "FF5904", "thickness": "2", "dashlen": "3", "dashgap": "3" }
