Has anyone worked with HighCharts Modules/Add-ons in Info??
Info natively runs charts from HighCharts, so the core HighCharts code is already there. I need to include a HighCharts Module (for Grouped Categories - http://blacklabel.github.io/grouped_categories/) to enhance an existing chart. The sample code for the Module includes hard-coded references to data as follows:
xAxis: {
categories: [{
name: "Fruit",
categories: ["Apple", "Banana", "Orange"]
}, {
name: "Vegetable",
categories: ["Carrot", "Potato", "Tomato"]
}, {
name: "Fish",
categories: ["Cod", "Salmon", "Tuna"]
}]
}I need to figure out how to swap out this hard-coded structure with data from my Info Datalayer:
<rdData>
<SeriesBarData EncounterNbr="180787" Patient_Type="Inpatient" RecordStatus="Not Started" ScheduledStartDT="2021-07-02 17:15" ActualStartDT="2021-07-02 10:27" Diff="-408" DiffDHM="(06:48)" DoS="2021-07-02T00:00:00-04:00" rdTime-DoS="2021-06-27T00:00:00-04:00" EStatus="On-time" BarColor="#09d309" hiddenGroupBy="@Data.Patient_Type~" DatePeriod="2021 Jun 27" Date-GroupBy="2021 Jun 27 Inpatient"/>
<SeriesBarData EncounterNbr="180675" Patient_Type="Outpatient" RecordStatus="Complete" ScheduledStartDT="2021-07-01 16:30" ActualStartDT="2021-07-01 16:24" Diff="-6" DiffDHM="(00:06)" DoS="2021-07-01T00:00:00-04:00" rdTime-DoS="2021-06-27T00:00:00-04:00" EStatus="On-time" BarColor="#09d309" hiddenGroupBy="@Data.Patient_Type~" DatePeriod="2021 Jun 27" Date-GroupBy="2021 Jun 27 Outpatient"/>
<SeriesBarData EncounterNbr="180726" Patient_Type="Outpatient" RecordStatus="Not Started" ScheduledStartDT="2021-07-01 11:00" ActualStartDT="2021-07-01 07:54" Diff="-186" DiffDHM="(03:06)" DoS="2021-07-01T00:00:00-04:00" rdTime-DoS="2021-06-27T00:00:00-04:00" EStatus="On-time" BarColor="#09d309" hiddenGroupBy="@Data.Patient_Type~" DatePeriod="2021 Jun 27" Date-GroupBy="2021 Jun 27 Outpatient"/>
<SeriesBarData EncounterNbr="181565" Patient_Type="Inpatient" RecordStatus="Complete" ScheduledStartDT="2021-07-09 20:15" ActualStartDT="2021-07-09 21:44" Diff="89" DiffDHM="01:29" DoS="2021-07-09T00:00:00-04:00" rdTime-DoS="2021-07-04T00:00:00-04:00" EStatus="Late" BarColor="#c20555" hiddenGroupBy="@Data.Patient_Type~" DatePeriod="2021 Jul 04" Date-GroupBy="2021 Jul 04 Inpatient"/>
<SeriesBarData EncounterNbr="171259" Patient_Type="Outpatient" RecordStatus="Not Started" ScheduledStartDT="2021-07-06 14:45" ActualStartDT="2021-07-06 14:28" Diff="-17" DiffDHM="(00:17)" DoS="2021-07-06T00:00:00-04:00" rdTime-DoS="2021-07-04T00:00:00-04:00" EStatus="On-time" BarColor="#09d309" hiddenGroupBy="@Data.Patient_Type~" DatePeriod="2021 Jul 04" Date-GroupBy="2021 Jul 04 Outpatient"/>
</rdData>
This data in my Info app is Crosstabbed as follows:
<CrosstabFilter CrosstabColumn="EStatus" CrosstabLabelColumn="Date-GroupBy" CrosstabValueColumn="EncounterNbr" CrosstabValueFunction="Count" ID="ctfStatusGroupBy">
<ExtraCrosstabValueColumn CrosstabValueColumn="BarColor" CrosstabValueFunction="Any" ID="BarColor" />
<ExtraCrosstabValueColumn CrosstabValueColumn="Date-GroupBy" CrosstabValueFunction="Any" ID="Date-GroupBy" />
</CrosstabFilter>
Has anyone done this or can anyone point me to documentation/tutorials on how to make this happen in Info?
Thanks in advance,
Johnny
-
I don't think this is exactly what you want, but maybe some guidance on how to push data in...There is a charts API...not as clean as a data layer, but maybe it can spark an idea???
More specifically,
https://devnet.logianalytics.com/hc/en-us/articles/4406817024279-Setting-JSON-Chart-Data#JSON
0 -
Thanks Blake!
I was already aware of the beforeCreateChart event/doc. The new Doc is super frustrating in that I already had the link to https://devnet.logianalytics.com/hc/en-us/articles/4406822110359-Events-beforeCreateChart-and-afterCreateChart#afterCreateChart, but had no idea that there was other information in this page's functional area of "Logi Javascript API...". I miss having the long pages with all of the info for a topic and jump links from the TOC.
More to this topic... the "Seting JSON Chart data" appears to be used for generating or appending JSON data to an existing dataset or chart. I think I'm trying to do the opposite - Call a beforeCreateChart event to re-shape the Info data into the format that the HighCharts module is expecting. I'm hoping there is some simple way of setting up Tokens or something in the JS so that I can create the array like:
xAxis: { categories: [{ name: '@Data.DatePeriod~', categories: [@SingleQuote.Data.GroupBy~] }] }I'm not well versed in Javascript and it is tough to search on this because all of the HighCharts tutorials/info assumes I am working specifically with HighCharts. I'm actually 'hacking' Logi Info's use of HighCharts and just want to add another element/function to the existing output.
0 -
Johnny Stevens I'll see if I can look into this more today.
+10000000000000 on bringing back the long scrolling pages. The documentation seems a bit fragmented at this point and I really struggle to find what I need. Maybe @... can help with this.0 -
If I remember correctly you use MySql. Does MySql have JSON capabilities? In SQL Server I'd write my query to convert to JSON. You could create a new Data definition and then reference that URL or file as input to your JavaScript.
Here is the link to data definitions
https://devnet.logianalytics.com/hc/en-us/articles/4402879547287-Creating-a-JSON-Data-Definition#JSONDef
Hopefully, I can get some time later to mess around with this.0 -
Just to keep everyone updated... we are contracting with VISUI and John Sweazen for this integration work. John was the first to recommend this approach in my original Forum post here.
0
Please sign in to leave a comment.
Comments
5 comments