Offline Custom Marker Symbols

1551
4
04-29-2018 06:48 PM
JoelSmith-Lowe
New Contributor II

Hi All,

Anyone ever had to use Custom Markers from an offline source before ?

Currently going through and trying to find some information but everything I have found uses online URL links instead of accessing image files from offline storage source (e.g Internal/External Storage)

Again, I have found something for offline but it is for 10.2 and not 100

*Rolls Eyes*

Display Device Location—ArcGIS Runtime SDK for Android | ArcGIS for Developers 

0 Kudos
4 Replies
ShellyGill1
Esri Contributor

HI Joel - you might find the info in the following topic useful - shows loading PictureMarkerSymbols from a file path to an image, and from an app resource (as well as the online URL!) - Symbols and renderers—ArcGIS Runtime SDK for Android | ArcGIS for Developers .  The code for using an app resource is taken from this SDK sample - arcgis-runtime-samples-android/MainActivity.java at 7438b7d0642390cf13144ea9d845d4b3713fdb31 · Esri/... .

Hope this helps,

Shelly

JoelSmith-Lowe
New Contributor II

Hi Shelly,

Thank you, I have been able to get it working using drawables that you can insert directly into your app through Android Studio.

After having a more careful look using the link below I was able to identify two offline methods. (Drawables, External File Storage)

Link: Picture Marker Symbols—ArcGIS Runtime SDK for Android | ArcGIS for Developers 

After inserting the symbol in Android Studio and adding the below code to a button under the mapview I have been able to get it working to a predefined location...

public void symbol3(View v) {
    mGraphicsOverlay =
new GraphicsOverlay();
   
mMapView.getGraphicsOverlays().add(mGraphicsOverlay);
   
//[DocRef: Name=Picture Marker Symbol Drawable-android, Category=Fundamentals, Topic=Symbols and Renderers]
    //Create a picture marker symbol from an app resource
   
BitmapDrawable pinStarBlueDrawable = (BitmapDrawable) ContextCompat.getDrawable(this, R.drawable.pin_star_blue);
    final
PictureMarkerSymbol pinStarBlueSymbol = new PictureMarkerSymbol(pinStarBlueDrawable);
   
//Optionally set the size, if not set the image will be auto sized based on its size in pixels,
    //its appearance would then differ across devices with different resolutions.
   
pinStarBlueSymbol.setHeight(40);
   
pinStarBlueSymbol.setWidth(40);
   
//Optionally set the offset, to align the base of the symbol aligns with the point geometry
   
pinStarBlueSymbol.setOffsetY(
           
11); //The image used for the symbol has a transparent buffer around it, so the offset is not simply height/2
   
pinStarBlueSymbol.loadAsync();
   
//[DocRef: END]
   
Point pinStarBluePoint = new Point(000.000000, -00.000000, SpatialReferences.getWgs84());
   
Graphic pinStarBlueGraphic = new Graphic(pinStarBluePoint, pinStarBlueSymbol);
   
mGraphicsOverlay.getGraphics().add(pinStarBlueGraphic);

}

I am now currently working on using this code but adding the ability to do onclick like below....

public void symbol1(View v) {
// Symbol 1 -

       
Point initialPoint = new Point(0,0, SpatialReferences.getWgs84());
       
coordinateLocation = new Graphic(initialPoint,
                new
SimpleMarkerSymbol(SimpleMarkerSymbol.Style.TRIANGLE, Color.YELLOW, 20f));
       
mMapView.getGraphicsOverlays().add(new GraphicsOverlay());
       
mMapView.getGraphicsOverlays().get(0).getGraphics().add(coordinateLocation);
       
toCoordinateNotationFromPoint(initialPoint);
       
mMapView.setOnTouchListener(new Symbol1MapTouchListener(this, mMapView));
       
Toast.makeText(MapsActivity.this,
               
"You Just Pressed Symbol 1!", Toast.LENGTH_LONG).show();
   
}

If you have any suggestions on how to achieve this it would be most appreciated. My latest attempt is below.

public void symbol3(View v) {


    Point initialPoint = new Point(0,0, SpatialReferences.getWgs84());
    BitmapDrawable pinStarBlueDrawable = (BitmapDrawable) ContextCompat.getDrawable(this, R.drawable.pin_star_blue);
    final PictureMarkerSymbol pinStarBlueSymbol = new PictureMarkerSymbol(pinStarBlueDrawable);
    coordinateLocation = new Graphic(initialPoint, new Graphic(pinStarBluePoint, pinStarBlueSymbol));
    mGraphicsOverlay = new GraphicsOverlay();
    //mMapView.getGraphicsOverlays().add(mGraphicsOverlay);
    pinStarBlueSymbol.setHeight(40);
    pinStarBlueSymbol.setWidth(40);
    //Optionally set the offset, to align the base of the symbol aligns with the point geometry
    pinStarBlueSymbol.setOffsetY(
            11); //The image used for the symbol has a transparent buffer around it, so the offset is not simply height/2
    pinStarBlueSymbol.loadAsync();
    mMapView.getGraphicsOverlays().add(new GraphicsOverlay());
    mMapView.getGraphicsOverlays().get(0).getGraphics().add(coordinateLocation);
    toCoordinateNotationFromPoint(initialPoint);
    mMapView.setOnTouchListener(new ShowCoordinatesMapTouchListener(this, mMapView));
    Toast.makeText(MapsActivity.this,
            "You Just Pressed Symbol 3!", Toast.LENGTH_LONG).show();

    //[DocRef: Name=Picture Marker Symbol Drawable-android, Category=Fundamentals, Topic=Symbols and Renderers]
    //Create a picture marker symbol from an app resource
    //Optionally set the size, if not set the image will be auto sized based on its size in pixels,
    //its appearance would then differ across devices with different resolutions.

    //[DocRef: END]
    //Point pinStarBluePoint = new Point(000.000000, -00.000000, SpatialReferences.getWgs84());
   // Graphic pinStarBlueGraphic = new Graphic(pinStarBluePoint, pinStarBlueSymbol);
    //mGraphicsOverlay.getGraphics().add(pinStarBlueGraphic);

}
0 Kudos
JoelSmith-Lowe
New Contributor II

Resolved it with the below code.

public void symbol3(View v) {


    Point initialPoint = new Point(0,0, SpatialReferences.getWgs84());
    BitmapDrawable pinStarBlueDrawable = (BitmapDrawable) ContextCompat.getDrawable(this, R.drawable.pin_star_blue);
    final PictureMarkerSymbol pinStarBlueSymbol = new PictureMarkerSymbol(pinStarBlueDrawable);
    coordinateLocation = new Graphic(initialPoint, pinStarBlueSymbol);
    mGraphicsOverlay = new GraphicsOverlay();
    //mMapView.getGraphicsOverlays().add(mGraphicsOverlay);
    pinStarBlueSymbol.setHeight(40);
    pinStarBlueSymbol.setWidth(40);
    //Optionally set the offset, to align the base of the symbol aligns with the point geometry
    pinStarBlueSymbol.setOffsetY(11); //The image used for the symbol has a transparent buffer around it, so the offset is not simply height/2
    pinStarBlueSymbol.loadAsync();
    mMapView.getGraphicsOverlays().add(new GraphicsOverlay());
    mMapView.getGraphicsOverlays().get(0).getGraphics().add(coordinateLocation);
    toCoordinateNotationFromPoint(initialPoint);
    mMapView.setOnTouchListener(new ShowCoordinatesMapTouchListener(this, mMapView));
    Toast.makeText(MapsActivity.this,
            "You Just Pressed Symbol 3!", Toast.LENGTH_LONG).show();

    //[DocRef: Name=Picture Marker Symbol Drawable-android, Category=Fundamentals, Topic=Symbols and Renderers]
    //Create a picture marker symbol from an app resource
    //Optionally set the size, if not set the image will be auto sized based on its size in pixels,
    //its appearance would then differ across devices with different resolutions.

    //[DocRef: END]
    //Point pinStarBluePoint = new Point(153.057137, -26.785357, SpatialReferences.getWgs84());
   // Graphic pinStarBlueGraphic = new Graphic(pinStarBluePoint, pinStarBlueSymbol);
    //mGraphicsOverlay.getGraphics().add(pinStarBlueGraphic);

}
0 Kudos
ShellyGill1
Esri Contributor

Good to hear you have solved things Joel. I presume you're doing something in your ShowCoordinatesMapTouchListener like converting the touch location received in `onSingleTapConfirmed` from screen coordinates to map coordinates using `MapView.screenToLocation` method, which is correct.

0 Kudos