number format issue

[zhengniu]

Hi Folks

@ajturner @tomwayson

Can any one help to answer two questions? 1) how to configure the number format for value in tooltip? 2) is there a way to convert value on the fly without change its self in data?

I am using JSON chart in Hub. here is the code I tested using https://esri.github.io/cedar/

the value of outStatisticFieldName "MAX_MAX_De_sum" from the query, I want to make sure 1) its display format to be "#,###.00" in tooltip. 2) do convert and show new calculated value of "MAX_MAX_De_sum/60". I tried the alternative way as suggested by someone here by applying "Cast(MAX_MAX_De as decimal(10,2)) to the "onStatisticField". it works if when using "orderByFields": "FIRST_Str", but always return unknown error when using "orderByFields": "MAX_MAX_De_sum DESC"

really appreciated for your help

{
  "type": "bar-horizontal",
  "numberFormatter":[{
      "numberFormat":{"decimalSeparator":".", "thousandsSeparator":",", "precision":-1}

  }],
  "datasets": [
    {
      "name": "dataset1",
      "query": {
        "where": "FIRST_Stre <>' ' and FIRST_Stre <> 'Hwy 7'",
        "orderByFields": "MAX_MAX_De_sum DESC",
        "groupByFieldsForStatistics": "FIRST_Stre",
        "having": "SUM(MAX_MAX_De)>24",
        "outStatistics": [
          {
            "statisticType": "sum",
            "onStatisticField": "MAX_MAX_De",
            "outStatisticFieldName": "MAX_MAX_De_sum"
          }
        ]
      },
      "url": "https://services.arcgis.com/6iGx1Dq91oKtcE7x/arcgis/rest/services/UUID_Delay_Summary_Hourly_pub_view1/FeatureServer/0"
    }
  ],
  "series": [
    {
      "source": "dataset1",
      "category": {
        "field": "FIRST_Stre",
        "label": "Highway"
      },
      "value": {
        "field": "cast(MAX_MAX_De_sum as decimal(10,2))",
        "label": "Delay (in sec)"
      }
    }
  ],
  "style": {
    "colors": [
      "#026873"
    ]
  },
  "overrides": {
  "graphs": [{
    "valueField"  : "MAX_MAX_De_sum",
    "balloonText": "[[MAX_MAX_De_sum]]",
    "numberFormatter":{"decimalSeparator":".", "thousandsSeparator":",", "precision":2,"numberFormat": "#,###.00"}

  }],
  "valueAxes": [{
    "title": "Elevation (feets)",
    "numberFormatter": {
    "numberFormat": "#,###.00"
  }
  }],
  "xAxes":[{
        "numberFormatter": {
    "numberFormat": "#,###.00"
  }  
  }]
}
}

[zhengniu]

anyone from ESRI team can help please?

[tomwayson]

You might try balloonFunction in your overrides instead of balloonText.

Alternatively, instead of calling chart.show() w/ overrides you can call chart.query(), chart.updateData(), and chart.render() like:

chart.query().then(response => {
  // query returns an object with dataset names as keys and the corresponding query responses as values
  // in your case, there's only one dataset, `dataset1`
  const datasetData = response['dataset1'];
  // pass the data to a function that performs any calculations and/or formatting
  const transformedData = myFunctionToTransformData(datasetData);
  // update the chart instance data and render the chart
  return chart.updateData({ dataset1: transformedData }).render();
});

[zhengniu]

You might try balloonFunction in your overrides instead of balloonText.

Alternatively, instead of calling chart.show() w/ overrides you can call chart.query(), chart.updateData(), and chart.render() like:

chart.query().then(response => {
  // query returns an object with dataset names as keys and the corresponding query responses as values
  // in your case, there's only one dataset, `dataset1`
  const datasetData = response['dataset1'];
  // pass the data to a function that performs any calculations and/or formatting
  const transformedData = myFunctionToTransformData(datasetData);
  // update the chart instance data and render the chart
  return chart.updateData({ dataset1: transformedData }).render();
});

Hi Tom, @tomwayson

because I am trying to apply above JSON Chart Definition to the Chart Card in ArcGIS Hub.

so I try below in overrides

"balloonFunction": "function(graphDataItem){
   return {graphDataItem.values.value}.numberFormat( "#,###.00")   

}"

it returns error VM241:47 Uncaught SyntaxError: Unexpected token in JSON at position 1209

[tomwayson]

I'm sorry, I missed that you are in Hub. You are correct, the balloonFunction would not be allowed in that context.

You've already tried many of the same things I would have (numberFormatter), as well as some things that I would not have thought of (cast() - good idea!) and you got very close. I was able to expand on your idea of using cast() to make it work:

What I did was include a non-cast stat column for sorting purposes and then I was able to remove many of the overrides:

{
  "type": "bar-horizontal",
  "datasets": [
    {
      "name": "dataset1",
      "query": {
        "where": "FIRST_Stre <>' ' and FIRST_Stre <> 'Hwy 7'",
        "orderByFields": "MAX_MAX_De_sum DESC",
        "groupByFieldsForStatistics": "FIRST_Stre",
        "having": "SUM(MAX_MAX_De)>24",
        "outStatistics": [
          {
            "statisticType": "sum",
            "onStatisticField": "Cast(MAX_MAX_De as decimal(10,2))",
            "outStatisticFieldName": "MAX_MAX_De_sum_formatted"
          },
          {
            "statisticType": "sum",
            "onStatisticField": "MAX_MAX_De",
            "outStatisticFieldName": "MAX_MAX_De_sum"
          }
        ]
      },
      "url": "https://services.arcgis.com/6iGx1Dq91oKtcE7x/arcgis/rest/services/UUID_Delay_Summary_Hourly_pub_view1/FeatureServer/0"
    }
  ],
  "series": [
    {
      "source": "dataset1",
      "category": {
        "field": "FIRST_Stre",
        "label": "Highway"
      },
      "value": {
        "field": "MAX_MAX_De_sum_formatted",
        "label": "Delay (in sec)"
      }
    }
  ],
  "style": {
    "colors": [
      "#026873"
    ]
  },
  "overrides": {
  "valueAxes": [{
    "title": "Elevation (feets)"
  }]
}
}

[zhengniu]

Thanks alot for pointing out the tricky part - using different field names in outStatisticFieldName and orderByFields I kept trying to use "cast" for onStatisticField but using the same field names for those two fields. It always gives me error like "MAX_MAX_De_sum is not valid parameter".

really appreciated for your help!!