Положение всплывающей подсказки на графике тепловых диаграмм Apex при наведении мыши - PullRequest
0 голосов
/ 31 октября 2019

Я использую apex heatmap в реагировании. Я сталкиваюсь с проблемой, чтобы управлять положением всплывающей подсказки во время наведения мыши на точку привязки карты данных. Я хочу сделать расстояние слева при наведении указателя мыши

Я использовал пользовательскийфункция всплывающей подсказки на графике апекса

tooltip: {
            custom: function({ seriesIndex, dataPointIndex, w }) {
              const hours = dayTimeStats[seriesIndex].name
                ? dayTimeStats[seriesIndex].name
                : null;

              const dayName = dayTimeStats[seriesIndex].data[dataPointIndex]["x"];

              let dayAndTimeFormat = dayName;

              if (hours) {
                dayAndTimeFormat += `-${hours}`;
              }

              const response = dayTimeStats[seriesIndex].data[dataPointIndex]["y"];

              const totalResponseData = Number(responseCount);
              let calculateResponsePer = 0;

              if (totalResponseData && totalResponseData > 0) {
                calculateResponsePer = Number(
                  ((response * 100) / totalResponseData).toFixed(2)
                );
              }

              return `<div><table class="heat_map_tooltip">
                      <thead>
                      </thead>
                      <tbody>
                      <tr><td><div class="small_tooltip  smal_tol_tip">
                      <div class="onecommon first">
                      <div class="date_top"><span class="first_Date">${
                        datesObject[0]
                      }</span></div><h2>${dayAndTimeFormat}</h2>

                       <div class="res_portn_nps">
                      <div class="res_portn_left">
                        <div class="re_number res_comn_clas green">${calculateResponsePer}%</div>
                        <div class="res_head res_comn_clas"></div>
                      </div>
                      <div class="res_portn_right">
                        <div class="res_num_right">${response}</div>
                        <div class="res_text_right">Responses</div>
                      </div>
                  </div>
                    </div>
                    </div></td></tr>
            </tbody>
            </table></div>`;
            },
            fixed: {
              enabled: true,
              position: "topRight",
              offsetX: 0,
              offsetY: 0
            }`enter code here`
          }
...