2 Replies Latest reply on Aug 30, 2018 6:39 AM by Ryan Kitlinski

    Highlighting Marks using the JavaScript API - Is it possible?

    Ryan Kitlinski

      Hi All,

       

      Hoping that you can help provide some clarification around this...

       

      I have a scenario where I need to apply marks on a dashboard with multiple worksheets embedded. I want to click on this column, like so, and have the two other worksheets (containing the totals) highlight the appropriate fields.

       

      SelectedMark.PNG

      I have the following function to replicate this scenario, where I use the following function on each worksheet in the dashboard to apply the pairs. In this case,

       

      markarray[0] is the fieldName

      markarray[1] is the value

      vizConfig.config.marks[l].markUpdateType is tableau.SelectionUpdateType.ADD

       

                          function applyMarks(worksheet) {
                              worksheet.clearSelectedMarksAsync().then(function () {
                                  for (l = 0; l < vizConfig.config.marks.length; l++) {
                                      var markarray = JSON.parse(vizConfig.config.marks[l].markValues);
                                          worksheet.selectMarksAsync(markarray[0], markarray[1], vizConfig.config.marks[l].markUpdateType);
                                  }
                              });
                          }
      

       

      To complicate matters, there are Dashboard filter actions on the highlighted areas when clicked. So as I am selecting the marks using the API, I'm effectively jumping to another dashboard in the workbook because there is this filter action that's activating (not ideal). When I go back to the proper dashboard, what I end up with is this:

       

      SelectedMark2.PNG

      So it's close, but not identical to what I want, which is the first screenshot above. Clearly what is happening here is that the highlighted areas are getting "clicked" through selectedMarksAsync() instead of highlighted.

       

      I see that there is a function prototype in the JS API called highlightMarksAsync(), but it's not working for me, as I get a 500 server error back from Tableau Server when I run it?

       

      Can anyone please advise if this is doable via the JS API? I don't see anything in the documentation yet regarding highlighting.

       

      Also, please see these posts, as it sounds similar to what I'm trying to do:

       

      Re: JS API - MARKS_HIGHLIGHTED When does this event get raised

       

      Javascript: getMarksAsync() of MarksEvent returns nothing if select on header

       

      Thanks,

       

      -Ryan