Question

我想在center周围添加一个红色圆圈半径。我正在使用此软件包https://github.com/google-map-react/google-map-react，这是我的代码：

<GoogleMapReact
      bootstrapURLKeys={{key: this.googleAPIKey}}
      defaultCenter={{lat: this.props.latitude, lng: this.props.longitude}}
      defaultZoom={this.props.zoom}
      yesIWantToUseGoogleMapApiInternals={true}
      onGoogleApiLoaded={({map, maps}) =>
        new google.maps.Circle({
          strokeColor: '#FF0000',
          strokeOpacity: 0.8,
          strokeWeight: 2,
          fillColor: '#FF0000',
          fillOpacity: 0.3,
          map,
          center: {lat: this.props.latitude, lng: this.props.longitude},
          radius: 275,
        })}
        >
      <AnyReactComponent
        lat={this.props.latitude}
        lng={this.props.longitude}
      />
    </GoogleMapReact>

但是，出现以下错误：

我按照文档中的说明进行操作，并尝试使用Google搜索来解决此问题。有什么想法吗？

Answer 1

显然，由于无法加载Google Maps API ，或者在调用onGoogleApiLoaded后被加载，因此发生了此错误，这就是为什么发生此错误。目前尚不清楚为什么为什么无法加载Google Maps API，因为问题中没有提供足够的详细信息。

根据google_map.js，应在控制台中显示一些有关错误的其他详细信息，以揭示错误发生的原因：

.catch(function (e) {
    // notify callback of load failure
    _this._onGoogleApiLoaded({ map: null, maps: null });
    console.error(e); // eslint-disable-line no-console
    throw e;
 });

但是该示例看上去正确，并且此demo演示了如何绘制圆。

Answer 2

只需：

public function category_product_pagination(){  

    if(!empty($this->input->post('cat_id')) && !empty($this->input->post('page'))){

        $cat_id_enc     =   $this->input->post('cat_id');
        $cat_id         =   $this->decryptGetId($cat_id_enc);

        $page       =   $this->input->post('page');

        $slug   = $this->ajax_model->dbSingleColQuery('slug', 'product_category', "id = '".$cat_id."'");                

        /////////////// PAGINATION //////////////
        $config = array();
        $config["base_url"] = base_url() . "/category/".$slug;      
        $total_row = $this->ajax_model->dbRowCountQuery('product', "cat_id = '".$cat_id."' AND del_status = 0");
        $config["total_rows"] = $total_row;
        $config["per_page"] = $this->per_page;
        $config['use_page_numbers'] = TRUE;
        $config['num_links'] = 2;
        $config['next_link'] = 'Next';
        $config['prev_link'] = 'Previous';
        $config['uri_segment'] = 3;

        $config['first_tag_open']       = '<li>';
        $config['first_tag_close']      = '</li>';
        $config['last_tag_open']        = '<li>';
        $config['last_tag_close']       = '</li>';
        $config['prev_tag_open']        = '<li>';
        $config['prev_tag_close']       = '</li>';
        $config['next_tag_open']        = '<li>';
        $config['next_tag_close']       = '</li>';
        $config['cur_tag_open']         = '<li><a class="current">';
        $config['cur_tag_close']        = '</a></li>';

        $config['num_tag_open']         = '<li>';
        $config['num_tag_close']        = '</li>'; 

        $this->pagination->initialize($config);

        $limit_row = ($page == 1) ? 0: ($page - 1) * $config["per_page"];
        $product_list   = $this->ajax_model->dbMultiRowQuery('*', 'product', "cat_id = '".$cat_id."' AND del_status = 0", 'id', 'DESC', $limit_row, $config["per_page"]);

        $str_links = $this->pagination->create_links();
        $pagination = explode('&nbsp;',$str_links);

        /////////////// PAGINATION //////////////

        echo '<ul class="tsc_pagination">'; 
        foreach ($pagination as $key => $link) {
            echo $link;
        }
        echo '</ul>';

    }

}// End function

google-map-react：添加圆半径

2 个答案: