Jump to content
JChartFX Community
  • 0
Sign in to follow this  
StatementSolutions

jChartFx using JQuery with Visual Studio

Question

I am trying to test jChartFx using an example I found on line.  I get an chart is not a function error  (attached image)  Below is the code I have

Code:

@model ePortfolio.Models.WidgetViewModel

@{    
    Layout = "~/Views/Shared/_WidgetEmptyLayout.cshtml";
}
<script type="text/javascript" src="~/Scripts/jChartFx/jchartfx.system.js"></script>
<script src="~/Scripts/jChartFx/jchartfx.coreVector.js"></script>
<script src="~/Scripts/jChartFx/jchartfx.coreVector3d.js"></script>
<script src="~/Scripts/jChartFx/jchartfx.advanced.js"></script>
<script src="~/Scripts/jquery-2.1.3.js"></script>
<script type="text/javascript" src="http://www.jchartfx.com/libs/jQuery/jquery-ui-1.8.18.custom.min.js"></script>post-47373-0-44177200-1432231199_thumb.jpg

<link href="~/Content/jquery-ui-1.8.16.custom.css" rel="stylesheet" />
<!-- Uncomment this section to add extended User Interaction capabilities, including the End-User Menu.
        The UI features require a jChartFX Plus license for deployment.

   <script type="text/javascript" src="jChartFX/jchartfx.userinterface.js"></script>
   <link rel="stylesheet" type="text/css" href="jchartfx.userinterface.css" />
 -->

<link href="~/stylesheets/jChartFx/Attributes/jchartfx.attributes.css" rel="stylesheet" />
<link href="~/stylesheets/jChartFx/Palettes/jchartfx.palette.css" rel="stylesheet" />
<script language="javascript" type="text/javascript">

    var chart1;
    $(document).ready(function ($) {

        var items = [{
            "Open": 24.2,
            "Date": "2003-03-01T23:45:10.280Z"
        }, {
            "Open": 21.3,
            "Date": "2003-03-02T23:45:10.280Z"
        }, {
            "Open": 22.4,
            "Date": "2003-03-03T23:45:10.280Z"
        }, {
            "Open": 24.3,
            "Date": "2003-03-04T23:45:10.280Z"
        }, {
            "Open": 22.6,
            "Date": "2003-03-05T23:45:10.280Z"
        }];

        $("#ChartDiv1").chart({
            gallery: cfx.Gallery.Bar,
            dataValues: items,
            dataSourceSettings: {
                fields: [{
                    name: "Open",
                    usage: cfx.FieldUsage.Value
                }, {
                    name: "Date",
                    usage: cfx.FieldUsage.XValue
                }]
            },
            titles: [{
                text: "Mapping Fields to chart elements"
            }],
            axisY: {
                min: 0,
                max: 30
            }

        });
    });

</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="ChartDiv1" style="width:600px;height:400px;display:inline-block"></div>

    </div>
</li>

Share this post


Link to post
Share on other sites

0 answers to this question

Recommended Posts

There have been no answers to this question yet

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
Sign in to follow this  

×