Explore Economies

[]
180) targetPoint = { x: e.rect.center().x, y: e.rect.origin.y-10 }; if(e.text < 10) targetPoint = { x: e.rect.center().x, y: e.rect.origin.y+10 };*/ var circle = new kendo.drawing.Circle(new kendo.geometry.Circle([targetPoint.x, targetPoint.y], 16), { stroke: { color: "grey", width: 1 }, fill: { color: "white" } }); var text = new kendo.drawing.Text(e.text); var bbox = text.bbox(); text.position([targetPoint.x - 20 + (40 - bbox.width()) / 2, targetPoint.y - 20 + (40 - bbox.height()) / 2]); return new kendo.drawing.Group({ zIndex: 108 }).append(circle, text); } } }], categoryAxis: { visible: true, minorGridLines: { visible: false }, majorGridLines: { visible: false }, majorTicks: { visible: false }, labels: { visible: true, position: 'end', margin: 100, visual: function(e) { var seriesData = $.grep(rankAndDTFResp, function(t) { return t.indicatorPublishedName === e.text; }); var rect = new kendo.geometry.Rect(e.rect.origin, [e.rect.size.width, 150]); var layout = new kendo.drawing.Layout(rect, { orientation: "vertical", alignContent: "center", alignItems: "center" }); const imageRect = new kendo.geometry.Rect( new kendo.geometry.Point(5, 5), new kendo.geometry.Size(40, 40) ); layout.append(new kendo.drawing.Text(" ")); layout.append(new kendo.drawing.Image(iconsPath + "/" + seriesData[0].indicatorCode + ".jpg", imageRect)); layout.append(new kendo.drawing.Text(" ")); var words = e.text.split(" "); for (var i = 0; i < words.length; i++) { //if(words[i].length == 1) layout.append(new kendo.drawing.Text( words[i], new kendo.geometry.Point(5, 5), { font: 'bold 12px Arial', fill: { color: seriesData[0].valueColor } } )); } layout.reflow(); return layout; } } }, valueAxis: { min: -10, max:200, majorUnit: 210, axisCrossingValue: -50000, reverse: true, visible: false, line: { visible: false }, minorGridLines: { visible: false }, majorGridLines: { visible: true }, labels:{visible:true} }, tooltip: { visible: false, template: "#= getRankTemplate(category, value) # ", font: "12px sans-serif", background: "white", border: { width: 1, color: "black" } } }); var topicsDataSource = new kendo.data.DataSource({ transport: { //read: topicsApi read: { url: topicsApi, dataType: 'json', headers: { 'Ocp-Apim-Subscription-Key': '7c202aad75524b5a9c9f0a9fa42cbbbc'}, type: "GET" }, } }); topicsDataSource.fetch(function () { var topics = this.view(); console.log(); var overallDataSource = new kendo.data.DataSource({ transport: { //read: overallApi read: { url: overallApi, dataType: 'json', headers: { 'Ocp-Apim-Subscription-Key': '7c202aad75524b5a9c9f0a9fa42cbbbc'}, type: "GET" }, } }); overallDataSource.fetch(function () { var subIndicatorTopicList = this.view(); var topicsSection1 = topics.slice(0, 4); topicsSection1.forEach(function (topic) { var rankAndDTF = $.grep(rankAndDTFResp, function(t) { return t.indicatorCode === topic.topicCode; }); topic['currentRank'] = rankAndDTF[0].currentRank; topic['currentDTF'] = rankAndDTF[0].currentDTF; topic['reformValue'] = rankAndDTF[0].reformValue; var subIndicatorTopics = $.grep(subIndicatorTopicList, function(t) { return t.indicatorCode === topic.topicCode; }); if(topic.topicCode == "DB_sb") { var startingArr = []; var procedures = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_sb_procedures" || s.subIndicatorCode === "DB_sb_Procedures_Women"; }); startingArr.push({ subIndicatorCode : "DB_sb_procedures", subIndicatorPublishedName : "Procedures (number)", economyValue : getAverage(procedures) }); var times = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_sb_time" || s.subIndicatorCode === "DB_sb_TotalTime_Women"; }); startingArr.push({ subIndicatorCode : "DB_sb_time", subIndicatorPublishedName : "Time (days)", economyValue : getAverage(times) }); var costs = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_sb_cost" || s.subIndicatorCode === "DB_sb_TotalCostGNIpc_Women"; }); startingArr.push({ subIndicatorCode : "DB_sb_cost", subIndicatorPublishedName : "Cost (number)", economyValue : getAverage(costs) }); var capital = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_sb_capital"; }); startingArr.push(capital[0]); topic["subIndicatorTopics"] = startingArr; } else { topic["subIndicatorTopics"] = subIndicatorTopics; } }); var topicsSection2 = topics.slice(4, 7); topicsSection2.forEach(function (topic) { var rankAndDTF = $.grep(rankAndDTFResp, function(t) { return t.indicatorCode === topic.topicCode; }); topic['currentRank'] = rankAndDTF[0].currentRank; topic['currentDTF'] = rankAndDTF[0].currentDTF; topic['reformValue'] = rankAndDTF[0].reformValue; var subIndicatorTopics = $.grep(subIndicatorTopicList, function(t) { return t.indicatorCode === topic.topicCode; }); topic["subIndicatorTopics"] = subIndicatorTopics; }); var topicsSection3 = topics.slice(7, 10); topicsSection3.forEach(function (topic) { var rankAndDTF = $.grep(rankAndDTFResp, function(t) { return t.indicatorCode === topic.topicCode; }); topic['currentRank'] = rankAndDTF[0].currentRank; topic['currentDTF'] = rankAndDTF[0].currentDTF; topic['reformValue'] = rankAndDTF[0].reformValue; var subIndicatorTopics = $.grep(subIndicatorTopicList, function(t) { return t.indicatorCode === topic.topicCode; }); if(topic.topicCode == "DB_tab") { var tradingArr = []; tradingArr.push({ subIndicatorCode : "", subIndicatorPublishedName : "Time to export", economyValue : "" }); var exportTimeDocs = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_tab_exportTimeDocs"; }); var exportTimeCompliance = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_tab_exportTimeCompliance"; }); tradingArr.push({ subIndicatorCode : exportTimeDocs[0].subIndicatorCode, subIndicatorPublishedName : exportTimeDocs[0].subIndicatorPublishedName.replace("Time to export:", ""), economyValue : exportTimeDocs[0].economyValue }); tradingArr.push({ subIndicatorCode : exportTimeCompliance[0].subIndicatorCode, subIndicatorPublishedName : exportTimeCompliance[0].subIndicatorPublishedName.replace("Time to export:", ""), economyValue : exportTimeCompliance[0].economyValue }); tradingArr.push({ subIndicatorCode : "", subIndicatorPublishedName : "Cost to export", economyValue : "" }); var exportCostDocs = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_tab_exportCostDocs"; }); var exportCostCompliance = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_tab_exportCostCompliance"; }); tradingArr.push({ subIndicatorCode : exportCostDocs[0].subIndicatorCode, subIndicatorPublishedName : exportCostDocs[0].subIndicatorPublishedName.replace("Cost to export:", ""), economyValue : exportCostDocs[0].economyValue }); tradingArr.push({ subIndicatorCode : exportCostCompliance[0].subIndicatorCode, subIndicatorPublishedName : exportCostCompliance[0].subIndicatorPublishedName.replace("Cost to export:", ""), economyValue : exportCostCompliance[0].economyValue }); tradingArr.push({ subIndicatorCode : "", subIndicatorPublishedName : "Time to export", economyValue : "" }); var importTimeDocs = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_tab_importTimeDocs"; }); var importTimeCompliance = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_tab_importTimeCompliance"; }); tradingArr.push({ subIndicatorCode : importTimeDocs[0].subIndicatorCode, subIndicatorPublishedName : importTimeDocs[0].subIndicatorPublishedName.replace("Time to import:", ""), economyValue : importTimeDocs[0].economyValue }); tradingArr.push({ subIndicatorCode : importTimeCompliance[0].subIndicatorCode, subIndicatorPublishedName : importTimeCompliance[0].subIndicatorPublishedName.replace("Time to import:", ""), economyValue : importTimeCompliance[0].economyValue }); tradingArr.push({ subIndicatorCode : "", subIndicatorPublishedName : "Cost to export", economyValue : "" }); var importCostDocs = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_tab_importCostDocs"; }); var importCostCompliance = $.grep(subIndicatorTopics, function(s) { return s.subIndicatorCode === "DB_tab_importCostCompliance"; }); tradingArr.push({ subIndicatorCode : importCostDocs[0].subIndicatorCode, subIndicatorPublishedName : importCostDocs[0].subIndicatorPublishedName.replace("Cost to import:", ""), economyValue : importCostDocs[0].economyValue }); tradingArr.push({ subIndicatorCode : importCostCompliance[0].subIndicatorCode, subIndicatorPublishedName : importCostCompliance[0].subIndicatorPublishedName.replace("Cost to import:", ""), economyValue : importCostCompliance[0].economyValue }); topic["subIndicatorTopics"] = tradingArr; } else { topic["subIndicatorTopics"] = subIndicatorTopics; } }); //commenting sub indicator table in economy pages as per client request /*var allIndicatorDataSectionTemplate = kendo.template($("#allIndicatorDataSectionTemplate").html()); $("#allIndicatorDataSection").html(allIndicatorDataSectionTemplate([ topicsSection1, topicsSection2, topicsSection3 ]));*/ }); }); }); }); function createDTFChart(value,charttitle,containerId, fullColor, partialColor) { charttitle = "Score "+charttitle; charttitle = charttitle.split(" ").join("n "); var data = []; var segments = 10, segementCount = 0; var center, radius; var fullDark = Math.trunc(value / segments); var partialDark = getDeciamlValue(value % segments); var partialLight = getDeciamlValue(segments - partialDark); var fullLight = segments - (fullDark + 1); for(var i=0; i < fullDark; i++) { segementCount++; data.push({ category: segementCount, value: segments, color: fullColor }); } if(partialDark != 0 && fullDark != 10) { segementCount = segementCount + 1; data.push({ category: segementCount, value: partialDark, color: fullColor, isExploded: true }); } if(fullDark != 10){ segementCount = segementCount + 1; data.push({ category: segementCount, value: partialLight, color: partialColor }); } for(var j=0; j < fullLight; j++) { segementCount++; data.push({ category: segementCount, value: segments, color: partialColor }); } $("#" + containerId).kendoChart({ title: { text: "", font: "bold 12px sans-serif" }, legend: { visible: false }, chartArea: { background: "", margin: 0, width: 87, height: 185 }, seriesDefaults: { labels: { visible: false }, type: "donut", holeSize: 41, overlay: { "gradient": "none" }, startAngle: 90, }, series: [{ data: data, visual: function(e) { // Obtain parameters for the segments // Will run many times, but that's not an issue center = e.center; radius = e.radius; // Create default visual return e.createVisual(); }, border: { width: 1, color: "white" } }], tooltip: { visible: false, template: "#= getDTFTemplate(category, value) # ", font: "12px sans-serif", background: "white", border: { width: 1, color: "black" } }, render: function(e) { var draw = kendo.drawing; var geom = kendo.geometry; var chart = e.sender; // The center and radius are populated by now. // We can ask a circle geometry to calculate the bounding rectangle for us. var circleGeometry = new geom.Circle(center, radius); var bbox = circleGeometry.bbox(); // Render the text var text = new draw.Text(toSingleDecimal(value), [0, 0], { font: "14px Verdana,Arial,sans-serif" }); // Align the text in the bounding box draw.align([text], bbox, "center"); draw.vAlign([text], bbox, "center"); // Draw it on the Chart drawing surface e.sender.surface.draw(text); } }); } function toSingleDecimal(value) { return parseFloat(value).toFixed(1); } function getAverage(value) { var total = 0; for(var i = 0; i < value.length; i++) { total += parseFloat(value[i].economyValue); } return total / value.length; } function numberWithCommas(x) { if(x != null || x != undefined) return x.toString().replace(/B(?=(d{3})+(?!d))/g, ","); else return ""; } function getRankTemplate(category, value) { return 'Series "Graph" Point "' + category + '"
Value: ‘ + (190 – parseInt(value.from)); }

Source