• J
    Jonas

    @mattfox Hi!
    We use a json component now and its working. But if you can build a better solution, we would definitely use it.

    For everyone who is looking for a solution:
    Insert this in your page with the AMChart

    <ma-json-store xid="colours" item="myItem"></ma-json-store>
    

    And our json with the xid "colours" is something like:

    {
        "Red": "#FF4040",
        "Orange": "#CD661D",
        "Grey": "#68838B"
    }
    

    And in the AMChart we use

    series-1-color="{{myItem.jsonData.Orange}}" 
    

    posted in Mango Automation general Discussion read more
  • J
    Jonas

    @craigweb There are often two different variants of one color. And predefined colors in the client industry. Room temperature, for example, is green. And outside temperature light green.

    I have a look at your recommended JSON component way now.

    posted in Mango Automation general Discussion read more
  • J
    Jonas

    @mattfox Thanks for your input.
    I use a global css stylesheet via the ui-settings.
    But the css class of an AMChart line is always the same. amcharts-graph-stroke or amcharts-graph-series-1 and we have 50+ charts and series-1 isn't always "blue" for example.

    And if I add series-1-class="colorRed" or series-1-className="colorRed" to the chart settings isn't working. But that's what I basically need. Add my own class to every series because I already defined all my colors in my stylesheet.

    posted in Mango Automation general Discussion read more
  • J
    Jonas

    @craigweb I created a colors-page with this code:

    <div ng-init="colorRed='#F44336'"></div>
    <div ng-init="colorRed2='#E57373'"></div>
    <div ng-init="colorOrange='#EF6C00'"></div>
    <div ng-init="colorOrange2='#FF9800'"></div>
    

    And on the page with the AmCharts I used the ma-ui-page-view with the XID of the colors-page but it doesn't work. It only works if the ng-init definitions are on the same page where the chart is defined.

    But I would like to have one place where I can define 20+ colors to use it on different pages / charts and SVG. I learned that CSS would be the place to do it but I cannot get it to work with amcharts CSS reference.

    posted in Mango Automation general Discussion read more
  • J
    Jonas

    What is the best way to define colors for AMCharts? We have many different charts and I would like to define the colors globally in a CSS file for example.

    <ma-point-values point="EZR_T" values="EZR_T_Values" rendered="true" from="dateBar.from" to="dateBar.to" rollup="AVERAGE" rollup-interval="{{dateBar.rollupIntervals}} {{dateBar.rollupIntervalPeriod}}"></ma-point-values>
    <ma-serial-chart flex style="width: auto; height: 450px;" 
      series-1-point="EZR_T" 
      series-1-values="EZR_T_Values" 
      series-1-color="green" 
      series-1-type="line" 
      series-1-title="Raumtemperatur"
    
    legend="true" balloon="true" default-balloon-text="[[title]]: [[value]]" export="true" stack-type="none" options="{valueAxes:[{title:'°C'}, {title:'kW'}]}">
    </ma-serial-chart>
    

    I would like to have series-1-color="green" be something like series-1-color="{{green}}" or insert a name of a class from a stylesheet.

    Is there a good way? Thanks for your help!

    posted in Mango Automation general Discussion read more
  • J
    Jonas

    @jared-wiltshire This works. Thank you!!

    For everyone who is interested in another solution: We figured out that putting everything in one page (overview and rooms content) and use ng-show does work as well. Its a bit messy with all the code though.

    Thanks again for the fast and great support here!

    posted in Mango Automation general Discussion read more
  • J
    Jonas

    @jared-wiltshire That works if I use and click within the rooms tab-navigation but not if I click from the overview page navigation to a certain room e.g. room 7. It activates room7 but there is always the first tab underlined and it doesn't switch to the room 7 tab.

    And this doesn't work:

    <md-tab label="Room 7" ui-state="'ui.ztEzrOff02'" ui-state-params="{Raumnr:'ZT02O0070_ER002'}" ng-click="selectedTab = 7"></md-tab>
    

    posted in Mango Automation general Discussion read more
  • J
    Jonas

    @CraigWeb Thank you for your quick answer! I can't make it work. Maybe you can apply it directly to my code example? That would help me a lot!

    posted in Mango Automation general Discussion read more
  • J
    Jonas

    I created two pages. An overview page and a room detail page, where the structure is always the same, but the content is dynamic.

    I used a tab navigation on both pages. The code of the navigation integrated on the overview page:

    <md-tabs md-dynamic-height md-border-bottom md-swipe-content>
        <md-tab label="Overview" ui-sref="ui.ztEzrOff02DB"></md-tab>
        <md-tab label="Room 1" ui-state="'ui.ztEzrOff02'" ui-state-params="{Raumnr:'ZT02O0010_ER002'}"></md-tab>
        <md-tab label="Room 2" ui-state="'ui.ztEzrOff02'" ui-state-params="{Raumnr:'ZT02O0020_ER003'}"></md-tab>
        <md-tab label="Room 3" ui-state="'ui.ztEzrOff02'" ui-state-params="{Raumnr:'ZT02O0030_ER003'}"></md-tab>
        <md-tab label="Room 7" ui-state="'ui.ztEzrOff02'" ui-state-params="{Raumnr:'ZT02O0070_ER002'}"></md-tab>
    </md-tabs>
    

    Navigation code on the detail page to retrieve the values of the individual rooms:

    <md-tabs md-dynamic-height md-border-bottom md-swipe-content>
        <md-tab label="Übersicht" ui-sref="ui.ztEzrOff02DB"></md-tab>
        <md-tab label="Room 1" ng-click="designer.parameters = {Raumnr: 'ZT02O0010_ER003'}"></md-tab>
        <md-tab label="Room 2" ng-click="designer.parameters = {Raumnr: 'ZT02O0020_ER003'}"></md-tab>
        <md-tab label="Room 3" ng-click="designer.parameters = {Raumnr: 'ZT02O0030_ER003'}"></md-tab>
        <md-tab label="Room 7" ng-click="designer.parameters = {Raumnr: 'ZT02O0070_ER002'}"></md-tab>
    </md-tabs>
    

    I have used the following guide to navigate directly to individual rooms via the link: https://help.infiniteautomation.com/linking-to-dynamic-pages

    The direct navigation from the overview page to e.g. room 7 works fine, but room 7 on the detail page is then not active (underlined) in the navigation. Is there a solution for that?

    Here is a screenshot of the navigation:
    0_1563441360708_Bildschirmfoto .jpg

    Thanks for your help!

    posted in Mango Automation general Discussion read more