I am using visual studio mvc. We are tetsing jChartFx. I cretaed a pie chart using jChartFx and the chart renders in IE and Chrome but the chart crated using jChartFx does not render in firefox. Please advise.
<html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title></title> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <style> * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; /* Border boxing is used, so the padding, margin and borders are within the width and height of de element. */ color: rgb(112, 112, 112); font-family: Arial; font-size: 11px; margin: 0; /* Margin zero is used to prevent unnecessary white space. */ padding: 0; /* Padding zero is used to prevent unnecessary white space. */ } </style>
You can post now and register later.
If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.
Question
StatementSolutions
I am using visual studio mvc. We are tetsing jChartFx. I cretaed a pie chart using jChartFx and the chart renders in IE and Chrome but the chart crated using jChartFx does not render in firefox. Please advise.
Code:
@model ePortfolio.Models.WidgetViewModel
@{
Layout = "~/Views/Shared/_WidgetEmptyLayout.cshtml";
}
<script>
$(document).ready(function () {
loadChart();
});
</script>
<li class="widget">
<div style="overflow:auto;">
<div data-role="navbar" class="widget-head" id="navcontainer">
@Html.DisplayFor(model => model, "WidgetHeader");
</div>
<div id="ChartDiv" style="width: 480px;height:400px"></div>
</div>
</li>
Code 2::
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<style>
* {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box; /* Border boxing is used, so the padding, margin and borders are within the width and height of de element. */
color: rgb(112, 112, 112);
font-family: Arial;
font-size: 11px;
margin: 0; /* Margin zero is used to prevent unnecessary white space. */
padding: 0; /* Padding zero is used to prevent unnecessary white space. */
}
</style>
<script type="text/javascript" src="~/Scripts/jquery.min.js"></script>
<script type="text/javascript" src="~/Scripts/jChart/js/jchartfx.system.js"></script>
<script type="text/javascript" src="~/Scripts/jChart/js/jchartfx.coreVector.js"></script>
<script type="text/javascript" src="~/Scripts/jChart/js/jchartfx.coreBasic.js"></script>
<script type="text/javascript" src="~/Scripts/jChart/js/jchartfx.advanced.js"></script>
@*<script type="text/javascript" src="~/Scripts/jChart/jchartfx.userinterface.js"></script>
<link rel="stylesheet" type="text/css" href="~/Content/jChart/jchartfx.userinterface.css" />*@
<link rel="stylesheet" type="text/css" href="~/Content/jChart/Attributes/jchartfx.attributes.css" />
<link rel="stylesheet" type="text/css" href="~/Content/jChart/Palettes/jchartfx.palette.css" />
<script type="text/javascript" language="javascript">
var chart1;
@using System.Web.Script.Serialization;
function loadChart() {
chart1 = new cfx.Chart();
var str = @Html.Raw(new JavaScriptSerializer().Serialize(ViewData["Asset Allocations Chart"]))
@*$.each(@Html.Raw(Json.Encode(ViewData["Asset Allocations Chart"])), function(i, item){
//alert("Mine is " + i + "|" + item.AssetType + "|" + item.EndMarketValue);
chart1.setDataSource(item);
});*@
chart1.setGallery(cfx.Gallery.Pie);
chart1.getView3D().setEnabled(true);
chart1.getAllSeries().getPointLabels().setVisible(true);
chart1.setDataSource(str);
//var fields = chart1.getDataSourceSettings().getFields();
//var field1 = new cfx.FieldMap();
//field1.setName("AssetType");
//field1.setUsage(cfx.FieldUsage.KeyLabel);
//fields.add(field1);
//var field2 = new cfx.FieldMap();
//field2.setName("EndMarketValue");
//field2.setUsage(cfx.FieldUsage.Value);
//fields.add(field2);
var data = chart1.getData();
data.setSeries(1);
data.setPoints(5);
data.getLabels().setItem(0, "Cash & Cash Equivalents");
data.getLabels().setItem(1, "Equities");
data.getLabels().setItem(2, "Taxable Fixed Income");
data.getLabels().setItem(3, "Non Taxable Fixed Income");
data.getLabels().setItem(4, "Other Securities");
//var titles = chart1.getTitles();
//var title = new cfx.TitleDockable();
//title.setText("Asset Allocation");
//titles.add(title);
//chart1.getAllSeries().getPointLabels().setFormat("%v");
chart1.getAllSeries().getPointLabels().setVisible(true);
chart1.getAllSeries().getPointLabels().setAlignment(cfx.StringAlignment.NEAR);
chart1.getLegendBox().setVisible(true);
chart1.getLegendBox().setDock(cfx.DockArea.Right);
//chart1.getLegendBox().setContentLayout(cfx.ContentLayout.Near);
var divHolder = document.getElementById('ChartDiv');
chart1.create(divHolder);
}
</script>
</head>
<body>
@RenderBody()
</body>
</html>
Link to comment
Share on other sites
1 answer to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.