Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Remote url images in a symbol layer #792

Closed
scottsampson opened this issue Nov 20, 2017 · 4 comments
Closed

Remote url images in a symbol layer #792

scottsampson opened this issue Nov 20, 2017 · 4 comments

Comments

@scottsampson
Copy link

I am having trouble adding a remote absolute url image to symbol layers. I have icons working just fine from a local source but remote sources just aren't working. I was able to get remote urls to work from annotations but I feel this isn't proper and from what I can see I can't add an annotations to a layer to zIndex above/below other layers.

Here are the important parts of my code:

iconImages = {
      pinIcon: pinIcon,
      mallIcon: mallIcon,
      branch_29: "http://www.example.com/img.jpg"
    }

...........

    <MapboxGL.ShapeSource
      id='symbolLocationSource2'
      shape={this.state.featureCollection}
      images={iconImages}
      sourceLayerID="PixxyLayer2"
      >
      <MapboxGL.SymbolLayer id="Pixxy2Layer" style={[pixxyMapStyles.icon]}  />
    </MapboxGL.ShapeSource>
    
............
    
    const pixxyMapStyles = MapboxGL.StyleSheet.create({
      icon: {
        iconImage: '{icon}',
        iconAllowOverlap: true,
        iconSize: MapboxGL.StyleSheet.source({
          'pinIcon': 1,
          'mallIcon': 1.2,
          'branch_29': 1,
        }, 'icon', MapboxGL.InterpolationMode.Categorial),
      }
    });

Is there anything above that needs to be fixed or do you have an example of a remote source image working in a symbol layer?
@nitaliano
Copy link
Owner

@scottsampson is this happening on both iOS and Android?

@scottsampson
Copy link
Author

@nitaliano Just iOS for me. I have not created an Android version of the app yet.

@scottsampson
Copy link
Author

scottsampson commented Nov 27, 2017 •
edited

@nitaliano, figured it out. The iconImages object should have the uri key for any remote url. Here is an example:

iconImages = {
      pinIcon: pinIcon,
      mallIcon: mallIcon,
      branch_29: { uri: "http://www.example.com/img.jpg" }
    }

@nitaliano
Copy link
Owner

Great glad it's working, I'm going to close this out

@atarsha atarsha mentioned this issue Feb 11, 2018
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@scottsampson @nitaliano