Question

使用Javascript：

void configure_interrupt_pins()
{

  GPIO_InitTypeDef GPIO_InitStruct;
  EXTI_InitTypeDef EXTI_InitStruct;
  NVIC_InitTypeDef NVIC_InitStruct;

  GPIO_InitStruct.GPIO_Mode = GPIO_Mode_IN;
  GPIO_InitStruct.GPIO_OType = GPIO_OType_PP;
  GPIO_InitStruct.GPIO_Pin = GPIO_Pin_1;
  GPIO_InitStruct.GPIO_PuPd = GPIO_PuPd_UP;
  GPIO_InitStruct.GPIO_Speed = GPIO_Speed_50MHz;
  GPIO_Init(GPIOB, &GPIO_InitStruct);

  /*ENABLE CLOCK FOR GPIOX*/
  RCC_APB1PeriphClockCmd(RCC_AHBPeriph_GPIOB, ENABLE);
  // ENABLE CLOCK FOR SYSCFG
  RCC_APB2PeriphClockCmd(RCC_APB2Periph_SYSCFG, ENABLE);
  //SET PIN AS INPUT
  // init_pin(EX_NCVIC_PORT, EX_NCVIC_Pin, GPIO_MODE_INPUT, GPIO_Speed_50MHz, GPIO_OType_PP, GPIO_PuPd_UP);
  //TELL THE SYSTEM THAT YOU WILL USE PXX FOR EXTI_LineX
  SYSCFG_EXTILineConfig(EXTI_PortSourceGPIOx, EXTI_PinSourcex);

  //CONFIGIRATION of exti

  EXTI_InitStruct.EXTI_Line = EXTI_Linex;                     //pxx connect to line x
  EXTI_InitStruct.EXTI_LineCmd = ENABLE;                      //enable interrupt
  EXTI_InitStruct.EXTI_Mode = EXTI_Mode_Interrupt;            //interrupt mode
  EXTI_InitStruct.EXTI_Trigger = EXTI_Trigger_Rising_Falling; //triggers on rising and failing edge
  EXTI_Init(&EXTI_InitStruct);                                //add to exti

  //CONFIGURATION of nvic

  NVIC_InitStruct.NVIC_IRQChannel = EXTI0_IRQn;
  NVIC_InitStruct.NVIC_IRQChannelPreemptionPriority = 0x00;
  NVIC_InitStruct.NVIC_IRQChannelSubPriority = 0x00;
  NVIC_InitStruct.NVIC_IRQChannelCmd = ENABLE;
  NVIC_Init(&NVIC_InitStruct);
}

CSS

  void EXTI0_IRQHandler(void)
{
  if (EXTI_GetITStatus((EXTI_Line0) != RESET))
  {
    res = touch_i2c_read(0x42, 0x00, i2c_buffer, 22);
    printf("deneme");
    if (!res)
    {
      GPIO_SetBits(GPIOE, GPIO_Pin_13);
    }

    else
    {
      GPIO_SetBits(GPIOE, GPIO_Pin_13);
    }
    EXTI_ClearITPendingBit(EXTI_Line0);
  }
}

HTML

<script type="text/javascript">
   var map;
   function initMap() {
     var mapCanvas = document.getElementById('gmap_basic');
     var mapOptions = {
      center: new google.maps.LatLng(44.5403, -78.5463),
      zoom: 8
      }
     map = new google.maps.Map(mapCanvas, mapOptions)
     google.maps.event.addDomListener(window, 'load', initMap);
     }
    $('#myModal').on('shown.bs.modal', function () {
      google.maps.event.trigger(map, "resize");
    });
 </script>

 <script async defer src="https://maps.googleapis.com/maps/api/js?key='YOUR KEY'&callback=initMap"></script>

在控制台和网络中没有运行错误，但只有灰色显示在模态中。双击后，地图显示但只有全屏选项...（缩放选项和卫星选项未显示）。

Answer 1

很可能是因为永远不会触发resize事件，所以尝试将其包装在.ready()函数中以确保在加载DOM时触发shown.bs.modal事件，如下所示：

$(function () {
  $('#myModal').on('shown.bs.modal', function () {
        google.maps.event.trigger(map, "resize");
        console.log('resize');
  });  
});

Google地图的加载方式还有另一个问题。由于地图是通过callback参数初始化的，因此该行：

 google.maps.event.addDomListener(window, 'load', initMap);

这里不需要。

Demo

只需双击显示，Google模式中的地图仅显示灰色

1 个答案: