SantoshNavle

Members
  • Content count

    3
  • Joined

  • Last visited

About SantoshNavle

  • Rank
    Forum Newbie
  1. Set the chart property of the "linkedchart" dynamically

    @vjj You need to define this on an attribute named linkedChartInvoked, call method within this attribute to set various chart properties.
  2. Set the chart property of the "linkedchart" dynamically

    Thanks Ayan for your feedback ! Well I managed to figure it out. I done this on an event named "linkedChartInvoked" "events": { "linkedChartInvoked": function (evt, data) { var mapname = data.clickedEntity.config.label.toString().toLowerCase(); var chartObj = FusionCharts("map-" + mapname.replace(/ /g, '')); chartObj.setJSONData(getLinkedChartData(mapname); //Populate the data for the linked chart. var chartData = chartObj.getJSONData()['data']; // Just to check if the data is being populated. }, } var getLinkedChartData = function (state) { var chartdata; var districts = []; // got the requird data from the database and //-- // -- $.each(result.detail, function (key, value) { districts.push({ "id": "id of the linked chart", "value": "yourvalue", "color": "yourcolor", "fontColor": "fontcolor", }); chartdata = { "data": districts, "chart": { "caption": "Caption", "subcaption": "Sub caption", "showLabels": "1", "entityFillColor": "#FFFFFF", "theme": "fusion", "showBorder": "1", "bordercolor": "#5c5c5c", "entityborderThickness": "1", "nullEntityColor": "#FFFFFF", "entityFillColor": "#E82727", "entityFillHoverColor": "#FFFFFF", "baseFontSize": "10", "showLegend": "0", "dataLoadStartMessage": "Please wait, chart is loading the data....", "dataLoadStartMessageFontSize": "14", } } Hope this helps someone. Thank you
  3. Hi, I have been able to load a India Map using Fusincharts Map. Also on every click of state I have been able to render the respective state map dynamically using the below code On each EntityClick I have configure the link to drill down the respective state using the below method. "entityClick": function (evt, data) { // Method call configureLink(evt, data); } // Method defined var configureLink = function (evt, data) { switch (data.id) { case "001": evt.sender.configureLink({ "type": "maps/andamanandnicobar" }, 0);break; case "002": evt.sender.configureLink({ "type": "maps/andhrapradesh", }, 0);break; case "003": evt.sender.configureLink({ "type": "maps/arunachalpradesh" }, 0); break; //like wise i have loaded for each state. } } The above method works well and the respective district are loaded on every click of State. What i need is to configure the linkedchart dynamically "linkeddata": [{ "id": "001", "linkedchart": { "chart": { "caption": "State", "subcaption": "State", "entityFillHoverColor": "#E5E5E9", "showLabels": "1", "entityFillColor": "#A8A8A8", "theme": "fusion", "showBorder": "1", "bordercolor": "#FFFFFF", "entityborderThickness": "3" }, "colorrange": { "startlabel": "Low", "endlabel": "High", "code": "#e44a00", "minvalue": "0", "gradient": "1", "color": [{ "maxvalue": "150", "displayvalue": "Average", "code": "#f8bd19" }, { "maxvalue": "600", "code": "#6baa01" }] }, "data": [{ "id": "HI", "value": "99" }, //like wise load every district dynamically..... ], } }], How can i dynamically set all the above attributes for a chart within "linkedchart". ? Which event of a chart can help me to dynamically add the attributes whenever an entity is clicked on parent map (india map). Also every district i need to assign different color like for Maharashtra > Pune district i need an yellow color.. likewise for every district. For the attached image. I have loaded the India Map with custom color for every state. With the above methods i have dynamically configured the link for every click on the state. As you can see i have loaded the respective district also. How can i set the data and color on each data of the a particular district dynamically ? Please help ! Let me know if you need any more information I have been using FusionCharts Suite XT v3.15.1-sr.1