如何将带有小部件的交互式Google Map导出为交互式HTML?

时间:2019-07-15 11:37:05

标签: python google-maps jupyter-notebook jupyter

我在Jupyter Notebook上将代码编写为Python 3,即.ipynb扩展名。我不知道是否可以将Jupyter中带有复选框的交互式Google Map导出为HTML。

我仍然想通过Jupyter Notebook外部的方框与我的Google Map进行交互。该地图可以在Jupyter Notebook中正常工作,但不能与HTML上的地图一起使用。我认为我使用了错误的功能将Google Map导出为HTML。

带有代码框的地图将如下所示: https://jupyter-gmaps.readthedocs.io/en/latest/_images/update-symbols-with-checkboxes.png

我想我在这里写错了以下代码:

def html(self):
        embed_minimal_html('YoungFoodiesMap2.html', views=display(self._container))

以下内容将在Jupyter Notebook中正确显示地图

OutletExplorer(df).render()

但是我不知道如何将此地图导出为HTML。以下内容无法正常工作。

OutletExplorer(df).html()

我的整个代码如下,不知道是否有帮助...

df = pd.read_excel('map.xlsx', sheet_name='Sheet4')

lite_df = df[df['Hubspot Community'] == "YF Lite"]
main_df = df[df['Hubspot Community'] == "YF Main"]
alumni_df = df[df['Hubspot Community'] == "Alumni"]
no_community_df = df[df['Hubspot Community'] != ("YF Lite" or "YF Main" or "Alumni")]

lite_coordinates = lite_df[['Latitude (Combine All)', 'Longitude (Combine All)']]
main_coordinates = main_df[['Latitude (Combine All)', 'Longitude (Combine All)']]
alumni_coordinates = alumni_df[['Latitude (Combine All)', 'Longitude (Combine All)']]
no_community_coordinates = no_community_df[['Latitude (Combine All)', 'Longitude (Combine All)']]
class OutletExplorer(object):
    def __init__(self, df):

        self._df = df
        self._marker_layer = None 
        # marker_layer = gmaps.marker_layer(locations=individual_location, info_box_content=company_info) 
        self._lite_marker = self._create_marker_for_community(
          'YF Lite')
        self._main_marker = self._create_marker_for_community(
          'YF Main')
        self._alumni_marker = self._create_marker_for_community(
          'Alumni')
        self._no_community_marker = self._create_marker_for_community(
          '')

        controls = self._render_controls(True, True, True, True)
        map_figure = self._render_map(True, True, True, True)
        self._container = widgets.VBox(
            [controls, map_figure])


    def render(self):
        """ Render the widget """
        display(self._container)


    def html(self):
        embed_minimal_html('YoungFoodiesMap2.html', views=display(self._container))


    def _create_marker_for_community(self, community):
        if (community) != "":
            community_df = self._df[self._df['Hubspot Community'] == community]
        else:
            community_df = self._df[self._df['Hubspot Community'] != ("YF Lite" or "YF Main" or "Alumni")]


        # math.isnan(x) == True


        markers = []

        for i in range( len(community_df.index) ):
            # extra ith row of df information in the data frame
            zipper = community_df.iloc[i]

            latitude = zipper["Latitude (Combine All)"]

            # if no latitude for certain row, escape the current loop and continue to the next one
            if (math.isnan(latitude)) == True:
                continue

            # if latitude is outside of -90 to 90, it won't make sense. Continue to next loop
            if (latitude > 90 or latitude < -90):
                continue

            longitude = zipper["Longitude (Combine All)"]

            # if no latitude for certain row, escape the current loop and continue to the next one
            if (math.isnan(longitude)) == True:
                continue

            brand_name = zipper["Lite Brand Name"]
            if (type(brand_name) == float and math.isnan(brand_name) == True):
                brand_name = ""

            lite_id = zipper["Lite ID"]
            if (type(lite_id) == float and math.isnan(lite_id) == True):
                lite_id = ""

            hubspot_id = zipper["Hubspot Company ID"]
            if (math.isnan(hubspot_id) == True):
                hubspot_id = ""
            else: 
                hubspot_id = int(hubspot_id)


            beauhurst_id = zipper["Beauhurst Company House Number"]
            if (type(beauhurst_id) == float and math.isnan(beauhurst_id) == True):
                beauhurst_id = ""


            postcode = zipper["Postcode"]
            if (type(postcode) == float and math.isnan(postcode) == True):
                postcode = ""

            hubspot_tier = zipper["Hubspot Tier"]
            if (type(hubspot_tier) == float and math.isnan(hubspot_tier) == True):
                hubspot_tier = ""

            hubspot_community = zipper["Hubspot Community"]
            if (type(hubspot_community) == float and math.isnan(hubspot_community) == True):
                hubspot_community = ""

            hubspot_stage = zipper["Hubspot Stage"]
            if (math.isnan(hubspot_stage) == True):
                hubspot_stage = ""
            else:
                hubspot_stage = int(hubspot_stage)


            beauhurst_url = zipper["Beauhust Website"]
            if (type(beauhurst_url) == float and math.isnan(beauhurst_url) == True):
                beauhurst_url = ""

            # The info box template string to update for each loop iteration
            string_template = "\n<dl>\n"     
            string_template += "<dt>Company Name: </dt><dd>" + str(brand_name)  + "</dd>\n"
            string_template += "<dt>Lite ID: </dt><dd>" + str(lite_id) + "</dd>\n"
            string_template += "<dt>Hubspot ID: </dt><dd>" + str(hubspot_id) + "</dd>\n"
            string_template += "<dt>Beauhurst ID: </dt><dd>" + str(beauhurst_id) + "</dd>\n"
            string_template += "<dt>Postcode: </dt><dd>" + str(postcode) + "</dd>\n"
            string_template += "<dt>Hubspot Tier: </dt><dd>" + str(hubspot_tier) + "</dd>\n"
            string_template += "<dt>Hubspot Community: </dt><dd>" + str(hubspot_community) + "</dd>\n"
            string_template += "<dt>Hubspot Stage: </dt><dd>" + str(hubspot_stage) + "</dd>\n"
            string_template += "<dt>Beauhust Website: </dt><dd>" + str(beauhurst_url) + "</dd>\n"
            string_template += "<dt>Hubspot Website: </dt>"
            if (hubspot_id != ""):
                string_template += "<dd>" + "https://app.hubspot.com/contacts/4845138/company/" + (str(hubspot_id)) + "</dd>\n"
            string_template += "\n</dl>\n"

            # create individual marker using gmaps 
            individual_marker =  gmaps.Marker(location=(latitude, longitude), info_box_content = string_template)

            # append all the markers into a list called markers2. Eventually return markers2
            markers.append(individual_marker)

        return markers


    def _generate_markers(self, include_lite, include_main, include_alumni, include_no_community):
        """ Generate the list of symbols to includs """
        symbols = []
        if include_lite:
            symbols.extend(self._lite_marker)
        if include_main:
            symbols.extend(self._main_marker)
        if include_alumni:
            symbols.extend(self._alumni_marker)
        if include_no_community:
            symbols.extend(self._no_community_marker)
        return symbols


    def _render_map(self, initial_include_lite, initial_include_main, initial_include_alumni, initial_no_community):
        """ Render the initial map """
        fig = gmaps.figure(map_type='ROADMAP',center = (51.5, -0.2), zoom_level = 10 )
        marker = self._generate_markers(True, True, True, True)
        self.marker_layer = gmaps.Markers(markers=marker, info_box_content = None) # None
        fig.add_layer(self.marker_layer)
        fig.add_layer(gmaps.traffic_layer())
        fig.add_layer(gmaps.transit_layer())
        return fig

    def _render_controls(
        self,
        initial_include_lite,
        initial_include_main,
        initial_include_alumni,
        initial_include_no_community
    ):
        """ Render the checkboxes """
        self._lite_checkbox = widgets.Checkbox(
            value=initial_include_lite,
            description='Lite'
        )
        self._main_checkbox = widgets.Checkbox(
            value=initial_include_main,
            description='Main'
        )
        self._alumni_checkbox = widgets.Checkbox(
            value=initial_include_alumni,
            description='Alumni'
        )
        self._no_community_checkbox = widgets.Checkbox(
            value=initial_include_no_community,
            description='No Community'
        )

        self._lite_checkbox.observe(
          self._on_controls_change, names='value')
        self._main_checkbox.observe(
          self._on_controls_change, names='value')
        self._alumni_checkbox.observe(
          self._on_controls_change, names='value')
        self._no_community_checkbox.observe(
          self._on_controls_change, names='value')

        controls = widgets.VBox(
          [self._lite_checkbox, self._main_checkbox, self._alumni_checkbox, self._no_community_checkbox])

        return controls

    def _on_controls_change(self, obj):
        """
        Called when the checkboxes change

        This method builds the list of symbols to include on the map,
        based on the current checkbox values. It then updates the
        symbol layer with the new symbol list.
        """

        include_lite = self._lite_checkbox.value
        include_main = self._main_checkbox.value
        include_alumni = self._alumni_checkbox.value
        include_no_community = self._no_community_checkbox.value

        markers = self._generate_markers(
            include_lite, include_main, include_alumni, include_no_community)

        # Update the layer with the new symbols:
        self.marker_layer.markers = markers

OutletExplorer(df).render() # works fine in Jupyter Notebook
OutletExplorer(df).html() # Exported HTML map looks abnormal

0 个答案:

没有答案