Jump to content
JChartFX Community

tuot

Members
 View Profile  See their activity

  • Posts

    6

  • Joined

  • Last visited

 Content Type 

Everything posted by tuot

  1. tuot
    I have a jquery mobile app with jchartfx. The charts render ok in window phone but other rendition was fragmented and tabular data when swiping up and down lost the table display. I tried a few things but nothing corrects the issue. I decided to remove jchartfx api calls and I did not see the problem again. Do you have any idea I can try?
  2. tuot
    I apoligize. the system.js file was not deployed out to the production directory. i used the chrome debug and found out it was missing. Thank you
  3. tuot
    Hello, i just finished a web app that contains two of jchartfx charts (bar and pie). the charts are rendered fine in visual studio environment. i deployed the project to production IIS and opened it a browser. the app works but the charts are not rendered at all. i check all the jchartfx files and they are in the directory. i did a view source and were able to open up those jchartfx javascripts files. Any ideas?
  4. tuot
    Hello, Can anyone show me how to format default tooltip? For example, for a bar chart, I would like to display the '$' sign for the value ($2500). Also for the pie chart, i like to display the value for the tooltip instead of the default percent. I tried a number of things as suggested in the documentation such as: chart1 = new cfx.Chart(); chart1.setToolTipFormat("This the point %N of series %S"); But it did not work at all. Thank you,
  5. tuot
    please uncomment the following line in the code that i posted so that it would display to charts. //drawChart1();
  6. tuot
    Hello, i am evaluating jchartfx for the first time and ran into tooltip issue. i have two charts (bar and pie in that order). default tooltip does not work for the pie chart. the problem occured only when both charts are together. I was exciting about this chart library. If i don't resolve this issue, I may not be able to use this library. Here is the code: <!DOCTYPE html> <html> <head> <title></title> <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> <link rel="stylesheet" type="text/css" href="Scripts/Charts/style/demoframe.css" /> <link rel="stylesheet" type="text/css" href="Scripts/Charts/style/jchartfx.css" /> <script type="text/javascript" src="Scripts/Charts/js/jchartfx.system.js"></script> <script type="text/javascript" src="Scripts/Charts/js/jchartfx.coreVector.js"></script> <script type="text/javascript" src="Scripts/Charts/js/jchartfx.animation.js"></script> <script type="text/javascript" src="Scripts/Charts/js/jchartfx.advanced.js"></script> <script type="text/javascript"> //var chart1; $(function () { onLoadDoc(); }); function onLoadDoc() { //drawChart1(); drawChart2(); } function drawChart1(){ chart1 = new cfx.Chart(); chart1.getAnimations().getLoad().setEnabled(true); chart1.setGallery(cfx.Gallery.Gantt); // cfx.Gallery.Gantt for horizontal bars // set chart title var title = new cfx.TitleDockable(); title.setText("My chart Title"); chart1.getTitles().add(title); ///////////////////////////// // set axis title chart1.getAxisX().getTitle().setText("X Axis Title"); chart1.getAxisY().getTitle().setText("Y Axis Title"); // set bar width (in percentage; maximum 100%) chart1.getAllSeries().setVolume(60); // set axis min/max (for horizontal bars, X axis is really for Y axis chart1.getAxisY().setMin(0); chart1.getAxisY().setMax(4000); // set x or y axis angle for marker values (remove for default) //chart1.getAxisY().setLabelAngle(45); //chart1.getAxisX().setLabelAngle(45); //////////////////////////////////////////// // legend chart1.getLegendBox().setVisible(false); // true - show, false - do not show var allSeries = chart1.getAllSeries(); allSeries.setBarShape(cfx.BarShape.Cylinder); var pointLabels = allSeries.getPointLabels(); pointLabels.setVisible(true); pointLabels.setFormat("$%v"); var items = [ { "Sales": 2200,"Month":"Jan" }, { "Sales": 1500,"Month":"Feb" }, { "Sales": 2100, "Month": "Mar" }, { "Sales": 2600, "Month": "Apr" }, { "Sales": 3200, "Month": "May" }, { "Sales": 3400, "Month": "Jun" }, ]; chart1.setDataSource(items); chart1.create(document.getElementById('ChartDiv1')); } function drawChart2(){ Chart2 = new cfx.Chart(); Chart2.getAnimations().getLoad().setEnabled(true); Chart2.setGallery(cfx.Gallery.Pie); // set chart title var title = new cfx.TitleDockable(); title.setText("My Pie Chart"); Chart2.getTitles().add(title); ///////////////////////////// // legend Chart2.getLegendBox().setVisible(true); // true - show, false - do not show var allSeries = Chart2.getAllSeries(); var myPie = (Chart2.getGalleryAttributes()); myPie.setExplodingMode(cfx.ExplodingMode.First); myPie.setSliceSeparation(15); var pointLabels = allSeries.getPointLabels(); pointLabels.setVisible(true); pointLabels.setFormat("$%v"); var items = [ { "Sales": 2200,"Month":"Jan" }, { "Sales": 1500,"Month":"Feb" }, { "Sales": 2100, "Month": "Mar" }, { "Sales": 2600, "Month": "Apr" }, ]; Chart2.setDataSource(items); Chart2.create(document.getElementById('ChartDiv2')); } </script> <style type="text/css"> body { background-color:gray } #ChartDiv1 .PointLabel { fill: navy; font-family: Arial; font-size: 8pt; } #ChartDiv1 .jchartfx .Title { font-size:14pt; font-weight: bold; fill:red; } /* X and Y axis title and markers color */ #ChartDiv1 .jchartfx .AxisText { fill: black; font-size:10pt; } /* color series */ #ChartDiv1 .jchartfx .Attribute0{ fill:orange; stroke:#4281A4; stroke-width:1; } #ChartDiv2 .jchartfx .Title { font-size:14pt; font-weight: bold; } #ChartDiv2 .PointLabel { fill: white; font-family: Arial; font-size: 8pt; } </style> </head> <body> <div id="ChartDiv1" style="width: 500px; height: 300px;margin:0 auto"> </div> <div id="ChartDiv2" style="width: 500px; height: 300px;margin:0 auto"> </div> </body> </html> Attachments.zip
×
×
  • Create New...