JuanC

Can you please let us know the version of jchartfx you are using
alert(cfx.Version);
Also can you duplicate this problem with a dummy chart on a test page?
The minimum set of files you would need to create a chart with a specific motif are jchartfx.system.js, jchartfx.coreVector.js and jchartfx.motif.hook.js
Regards,
JuanC

We are researching this issue, in the meantime, if you know your min and max are fixed you can set the major step as follows
scale.getTickmarks().getMajor().setStep(10);
Regards,
JuanC

There are 2 things in play in your code
1) There is a bug that will prevent you from using a field whose first value is null, we have fixed it internally so we expect to have a new build soon
2) Even with that bug fixed, our behavior to automatically use fields as values to be plotted or labels is to check the value for all the fields for the first object in the array, because of this the automatic detection will not work in your scenario. and you will have to explicitly tell us the fields you want to use, e.g. add this code before setDataSource
        var fieldMap;
        var fields = chart1.getDataSourceSettings().getFields();
        fieldMap = new cfx.FieldMap();
        fieldMap.setName("john smith");
        fieldMap.setUsage(cfx.FieldUsage.Value);
        fields.add(fieldMap);
        fieldMap = new cfx.FieldMap();
        fieldMap.setName("jane doe");
        fieldMap.setUsage(cfx.FieldUsage.Value);
        fields.add(fieldMap);
        fieldMap = new cfx.FieldMap();
        fieldMap.setName("paulie walnuts");
        fieldMap.setUsage(cfx.FieldUsage.Value);
        fields.add(fieldMap);
        fieldMap = new cfx.FieldMap();
        fieldMap.setName("Date");
        fieldMap.setUsage(cfx.FieldUsage.XValue);
        fields.add(fieldMap);
 
There is a workaround which should work on your bits which is to replace the value for any null field in the first object in your data array with cfx.Chart.Hidden, e.g. if your data was declared like this, you would get the expected result
    var items = [{
        'john smith' : cfx.Chart.Hidden,
        'jane doe' : 30,
        'paulie walnuts' : 50,
        'Date' : '2018-03-01'
        },
        {
        'john smith' : 50,
        'jane doe' : 20,
        'paulie walnuts' : 10,
        'Date' : '2018-03-02'
        },
        {
        'john smith' : 20,
        'jane doe' : 10,
        'paulie walnuts' : 60,
        'Date' : '2018-03-03'
        }];
 
Regards,
JuanC
 
 
 

You are doing nothing wrong, this is by design, when you use our CSS it means colors (and fonts, and line widths) are controlled through CSS instead of API, you have 3 options
1) Do not include our palette and attributes CSS, this is recommended if you will need to control several colors "dynamically"
2) Make a copy of the used CSS and change it as needed, e.g.
.jchartfx .Attribute0 {
    fill: #D0C5E3;
    stroke: #D0C5E3;
}
Note that sometimes we generate several classes for an object (you can view this using Inspect in your browser), for example, axis sections generate a class such as "AxisSection AxisY_Section AxisY0_Section0" to give you a chance to change all axis sections, all Y axis sections or a particular section by index.
3) Most objects expose a setTag method that allows you to customize the generated class
Regards,
JuanC

You can attach a handler to the gettip event and one of the fields will be the tooltip div, e.g.
function onTipDiv(args)
{
    var style = args.tooltipDiv.getAttribute("style");
    args.tooltipDiv.setAttribute("style", style + ";background:#880015");
}
chart1.on("gettip", onTipDiv);
Hope this helps.
JuanC

The way motifs work, charts/gauges properties are modified when objects are constructed (to allow for your customizations to override motif customizations).
Because of this, if you are going from motif A to motif B it is not trivial to try to "undo" the actions on motif A before trying to apply B. It does not need necessarily a full page reload but recreating the charts is the simple way to achieve this (if the motif change is happening on the client side).
JuanC

We do not support using the "zoom" scrollbar on charts using multiple panes, actually we eve have code that tries to force the simple scrollbars in those situations.
If you are ok with simple scrollbar, you can force them using the following code
chart1.getZoom().setUseSimpleScrollBars(true);
In our current builds (not made public yet) we are exploring an API that allows you to select a single pane or series to show in this "zoom" scrollbar, would this be something that helps you in your scenario? Can you tell us the version of jChartFX you are using and post sample code that duplicates the problem you are experiencing?
Regards,
JuanC

Assuming this data and function to extract week number, note that I have no idea if this function implements the week number that you expect as week numbering seems to be vaguely defined
 
var items = [
{ "Date": "2016-07-06T08:45:10.280Z", "Value": 15}, { "Date": "2016-08-15T12:15:00.000Z", "Value": 12}, { "Date": "2016-08-25T23:45:10.280Z", "Value": 18}, ];   function getWeekOfYear(date)
{     var target = new Date(date.valueOf()), dayNumber = (date.getUTCDay() + 6) % 7, firstThursday;       target.setUTCDate(target.getUTCDate() - dayNumber + 3);     firstThursday = target.valueOf();     target.setUTCMonth(0, 1);       if (target.getUTCDay() !== 4)         target.setUTCMonth(0, 1 + ((4 - target.getUTCDay()) + 7) % 7);       return Math.ceil((firstThursday - target) /  (7 * 24 * 3600 * 1000)) + 1; }   I see 3 choices,
 
1) If you are creating a bar chart or even if using a line/area chart you do not have holes in your data or do not want to plot holes in the data, you could add a field with the week number using the date and then tell jChartFX that you want to use that as the label, e.g.
 
for(var i = 0; i < items.length; i++) {
    var item = items;     item["Week"] = getWeekOfYear(new Date(Date.parse(item["Date"]))); }   var fieldMap; fieldMap = new cfx.FieldMap(); fieldMap.setName("Week"); fieldMap.setUsage(cfx.FieldUsage.Label); chart1.getDataSourceSettings().getFields().add(fieldMap); fieldMap = new cfx.FieldMap(); fieldMap.setName("Value"); fieldMap.setUsage(cfx.FieldUsage.Value); chart1.getDataSourceSettings().getFields().add(fieldMap);   2) If you are creating a line/area chart and want to have holes in the display for missing weeks, just do the same as before but use cfx.FieldMap.XValue for the week field.   3) It is also possible to keep using the date field as the labels or X value and handle an event so that you can return a string used for the X axis labels, this would be a little more involved but I thought I should mention it in case it is useful in other scenarios.   JuanC

I tried this as the only code in a page
 
var chart1 = new cfx.Chart();
chart1.setDataSource([{"myinfomonitor_ts":"2016-07-04T10:55:19.785Z","bundleweight_sum":14350},{"myinfomonitor_ts":"2016-07-04T11:55:19.785Z","bundleweight_sum":24950},{"myinfomonitor_ts":"2016-07-04T12:55:19.785Z","bundleweight_sum":7076},{"myinfomonitor_ts":"2016-07-04T13:55:19.785Z","bundleweight_sum":18148},{"myinfomonitor_ts":"2016-07-04T14:55:19.785Z","bundleweight_sum":21726},{"myinfomonitor_ts":"2016-07-04T15:55:19.785Z","bundleweight_sum":22326},{"myinfomonitor_ts":"2016-07-04T16:55:19.785Z","bundleweight_sum":9356},{"myinfomonitor_ts":"2016-07-04T17:55:19.785Z","bundleweight_sum":23432},{"myinfomonitor_ts":"2016-07-04T18:55:19.785Z","bundleweight_sum":25708},{"myinfomonitor_ts":"2016-07-04T19:55:19.785Z","bundleweight_sum":24546},{"myinfomonitor_ts":"2016-07-04T20:55:19.785Z","bundleweight_sum":24650},{"myinfomonitor_ts":"2016-07-04T21:55:19.785Z","bundleweight_sum":21070},{"myinfomonitor_ts":"2016-07-04T22:55:19.785Z","bundleweight_sum":27072},{"myinfomonitor_ts":"2016-07-04T23:55:19.785Z","bundleweight_sum":42356},{"myinfomonitor_ts":"2016-07-05T00:55:19.785Z","bundleweight_sum":38798},{"myinfomonitor_ts":"2016-07-05T01:55:19.785Z","bundleweight_sum":0},{"myinfomonitor_ts":"2016-07-05T02:55:19.785Z","bundleweight_sum":7146},{"myinfomonitor_ts":"2016-07-05T03:55:19.785Z","bundleweight_sum":13038},{"myinfomonitor_ts":"2016-07-05T04:55:19.785Z","bundleweight_sum":18630},{"myinfomonitor_ts":"2016-07-05T05:55:19.785Z","bundleweight_sum":12464},{"myinfomonitor_ts":"2016-07-05T06:55:19.785Z","bundleweight_sum":3540},{"myinfomonitor_ts":"2016-07-05T07:55:19.785Z","bundleweight_sum":0},{"myinfomonitor_ts":"2016-07-05T08:55:19.785Z","bundleweight_sum":0}]);
chart1.getAxisX().getLabelsFormat().setFormat(cfx.AxisFormat.DateTime); chart1.getAxisX().setLabelAngle(0); chart1.getAxisX().getLabelsFormat().setCustomFormat("HH"); chart1.getAxisX().setStaggered(true);   And the labels are shown correctly, note that I am not setting the step, and jChartFX should calculate an appropriate one, if the format is set to DateTime, we will consider the following steps: 1,2,3,6,12 hours 1,5,10,15,30 minutes or 1,5,10,15,30 seconds.   Is it possible you are changing other property that is causing the labels not to appear? I tried both with 6022 as well as 5900 and in both cases it worked.   About the step, the answer is yes. Setting the step to 2/24 would give you a label every 2 hours. Note that because of floating point limitations some specific combinations might not work properly, we will research if we can provide a way to specify the unit of the step (e.g. day, hour, minute) in future builds.   JuanC

Try setting a width and height to the mychartid div, e.g.
 
<div id="mychartid" style="width:600px;height:400px"></div>
  Regards,   JuanC

We received the credentials, unfortunately although we can see the issue there is no way for us to try to fix our code or provide a workaround as we have no way of modifying the code that is running on your server (or the JS provided by your server).
 
In general, when posting an issue you should try the following
 
1) Start with an empty HTML page that creates a chart
2) If necessary change the div's size and chart attributes to match your chart using hardcoded data
3) Slowly try to match your page scenario (e.g. Div hierarchy, additional scripts such as jQueryUI, bootstrap, etc.)
 
Once you duplicate the problem in a stand-alone fashion, post or send us a zip containing the page and all additional scripts and CSS files.
 
Note that in this particular case, the fact that the tooltip is rendered behind has nothing to do with how your customize the chart (colors, fonts, API) but only with the hierarchy of divs in your page and possibly with interaction with other scripts jQueryUI, bootstrap, etc.
 
JuanC

We have a flag to avoid showing the labels inside but we do not have a flag to force the labels to be inside. If we calculate the size of the label and decide it will be bigger than the slice it will be drawn outside.
 
JuanC

To remove the background you probably will have to remove or change the border, as some of the borders may paint effects after the background is painted.
 
// Remove the border
chart1.setBorder(null);
 
// If you are NOT using CSS, this should remove the background, you can test a simple page with a chart and change the background-color for the body
chart1.setBackColor("#00FFFFFF");   If you are using CSS, you can make the chart's background transparent by modifying the jchartfx palette CSS in use and set the fill-opacity to 0 for the Border attribute, you could also add this inline CSS which should overwrite the one from the palette   <style> .jchartfx .Border {     fill-opacity: 0; } </style>   JuanC

See answer at http://community.jchartfx.com/topic/453-tooltip-for-pie-chart-does-not-work/
 
We need CSS and Scripts files in order to recreate issue so that we can try to fix it or provide a workaround.
 
JuanC

The problem is that the chart does not assume strings can be plotted as numbers, and your posts field is being returned as a string
 
1) Solution 1
 
Change the page/process that generates the JSON so that it looks like this (note that the numbers should have no quotes)
 
[{ "username" : "Jill", "posts" : 106, "friends" : "", "status" : "", "polls" : ""},{ "username" : "Carly", "posts" : 93, "friends" : "", "status" : "", "polls" : ""},{ "username" : "Chris", "posts" : 11, "friends" : "", "status" : "", "polls" : ""}]
 
2) Solution 2
 
Manually tell us which fields should be used as values to be plotted
 
       var fields = chart1.getDataSourceSettings().getFields();
          var field1 = new cfx.FieldMap();         field1.setName("username");         field1.setUsage(cfx.FieldUsage.Label);         fields.add(field1);           var field2 = new cfx.FieldMap();         field2.setName("posts");         field2.setUsage(cfx.FieldUsage.Value);         fields.add(field2);   Regards,   JuanC

You are correct, there is an issue because Funnel charts will sort the values before painting but the data grid is currently not aware of the reordering. We will try to fix this in future builds.
 
I am not entirely sure why you would want to show the point labels, the legend box and the data grid as you are showing the same information in 3 different ways.
 
Regards,
 
JuanC

Changing the data source has the disadvantage that we have to reprocess the data (even though nothing has changed).
 
In the current version of the scripts (and this will not change moving forward) you can invoke doUpdate as follows
 
lineChart.doUpdate(true)
 
In previous builds this function was being "minified".
 
Regards,
 
JuanC

We support incomplete data, if there is a missing property (note that we discover available properties by looking at first object in the array), e.g.
 
    chart1.setDataSource([{"A":10},{"A":12},{"A":14},{},{"A":20},{"A":17},{"A":13},{},{"A":20},{"A":17},{"A":13}]);   We also define a value that we use to break the lines (we do not use NaN or null for this purpose) so you could also pass the following array       chart1.setDataSource([{"A":10},{"A":12},{"A":14},{"A":cfx.Chart.Hidden},{"A":20},{"A":17},{"A":13},{"A":cfx.Chart.Hidden},{"A":20},{"A":17},{"A":13}]);   We have discovered an issue in a recent build of CoreVector where only the last line segment might be displayed and should have a bug fix soon, in the meantime if you experience this problem you can use CoreBasic.   Regards,   JuanC