amolchaudhari69@gmail.com

JavaScript chart- Legends Color is missing in Exported chart

Recommended Posts

Hello Team,

 

I a using javascript driven Quadrant  chart for which the client side export functionality is enabled.

 

I am showing only anchor tags (data tags) in the chart ,every anchor has a unique color code and also same color code is appearing for its legend.

 

but whenever I am exporting this graph to PDF or PNG the legends color is not appearing in exported chart, only in SVG export is working fine(with legend color).

 

Could you please help me out to resolve this issue.

 

Attaching Json which I am using.

 

any help is appreciated .

 

Regards,

#Amol

Share this post


Link to post
Share on other sites
{

"message" : "SUCCESS",

"chart" : {

"yaxisname" : "Web Rate",

"xaxisname" : "Reputation",

"yaxismaxvalue" : "449.66",

"yaxisminvalue" : "375.0",

"drawQuadrant" : "0",

"quadrantLineColor" : "009933",

"quadrantLineThickness" : "1",

"exportEnabled" : "1",

"exportAtClient" : "1",

"exportFormats" : "PDF=Download as PDF|PNG=Download as PNG|SVG=Download as SVG",

"bgColor" : "FFFFFF",

"bgAlpha" : "0",

"setAdaptiveYMin" : "1",

"canvasBorderThickness" : "1",

"canvasBorderAlpha" : "30",

"borderColor" : "#B1B1B1",

"xAxisLabelMode" : "AUTO",

"canvasBorderColor" : "#c7c7c7",

"vDivLineColor" : "FFFFFF",

"divLineColor" : "FFFFFF",

"legendBorderThickness" : "1",

"legendBorderColor" : "#c7c7c7",

"legendBorderAlpha" : "10",

"showAlternateHGridColor" : "0",

"showExportDataMenuItem":"1",

"exportDataMenuItemLabel":"Export To Excel"

},

"dataset" : [{

"seriesName" : "The Marbury",

"color" : "",

"anchorSides" : "0",

"anchorRadius" : "4",

"anchorBgColor" : "#F8CF03",

"set" : [{

"y" : "418.06",

"x" : "5.872609"

}

],

"anchorBorderColor" : "#F8CF03"

}, {

"seriesName" : "Blue Line Hotel",

"color" : "",

"anchorSides" : "0",

"anchorRadius" : "4",

"anchorBgColor" : "#F307CB",

"set" : [{

"y" : "434.33",

"x" : "5.2089477"

}

],

"anchorBorderColor" : "#F307CB"

}, {

"seriesName" : "Lake Palace",

"color" : "",

"anchorSides" : "0",

"anchorRadius" : "7",

"anchorBgColor" : "0000FC",

"set" : [{

"y" : "365.0",

"x" : "5.89138"

}

],

"anchorBorderColor" : "none"

}, {

"seriesName" : "CityScape Hotel",

"color" : "",

"anchorSides" : "0",

"anchorRadius" : "4",

"anchorBgColor" : "#9C6433",

"set" : [{

"y" : "409.35",

"x" : "6.5456667"

}

],

"anchorBorderColor" : "#9C6433"

}, {

"seriesName" : "The Towers",

"color" : "",

"anchorSides" : "0",

"anchorRadius" : "4",

"anchorBgColor" : "#FA0200",

"set" : [{

"y" : "388.97",

"x" : "5.369091"

}

],

"anchorBorderColor" : "#FA0200"

}, {

"seriesName" : "Hotel Troubadour",

"color" : "",

"anchorSides" : "0",

"anchorRadius" : "4",

"anchorBgColor" : "#CF66F6",

"set" : [{

"y" : "459.66",

"x" : "4.4317646"

}


 

}

],

"vtrendlines" : {

"line" : [{

"startvalue" : "5.55",

"color" : "009933",

"displayvalue" : "",

"showontop" : null,

"thickness" : "1",

"toolText" : "5.55",

"isTrendZone" : "0"

}

]

},

"trendlines" : {

"line" : [{

"startvalue" : "416.2",

"color" : "009933",

"displayvalue" : " ",

"showontop" : null,

"thickness" : "1",

"toolText" : "412.56",

"isTrendZone" : "0"

}

]

},

"styles":{

    "definition":[{

        "name":"myGlow",

        "type":"glow",

        "color":"FF6D50"

      }

    ],

    "application":[{

        "toobject":"ANCHORS",

        "styles":"myGlow"

      }

    ]

  }

}

Share this post


Link to post
Share on other sites

Hi Swarnam,

 

Thanks for the reply, I have downloaded the version mentioned by you, but  I am not able to see data on graph for the json I mentioned in above post.

 

do I need to change any attributes mentioned in My json.

 

The HTML code which I am using 

 

<html>  
<head>            
<title>FusionCharts XT</title>             
<script type="text/javascript" src="fusioncharts/FusionCharts.js"></script>  
</head>     
<body>         
<div id="chartContainer" style="heigh:500px;">FusionCharts XT will load here!</div>              
<script type="text/javascript">
);      
var myChart = new FusionCharts( "Scatter", "myChartId", "900", "500", "0" );      
myChart.setJSONUrl("sample1.json"); 
myChart.render("chartContainer"); 
</script>        
</body> 
</html>

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now