In my android app I am adding a picture marker symbol on ESRI map using PictureMarkerSymbol class(using Kotlin) like:
val markerSymbol = PictureMarkerSymbol.createAsync(ContextCompat.getDrawable(context!!, icon) as BitmapDrawable?).get()
Here am adding multiple markers on map by setting default opacity of symbol and adding it to overlay like:
markerSymbol.opacity = 0.3f
//add a new graphic as marker point
val markerGraphicPoint = Point(activeCall.lang, activeCall.lat, spatialReference)
val graphic = Graphic(markerGraphicPoint, markerSymbol)
graphicsOverlay.graphics.add(graphic)
Now I want to set the opacity to a selected graphic(Anyway I am getting the selected graphic symbol from an array). I can get the symbol from selected graphic like:
selectedGraphic?.symbol
I want to set opacity to selected symbol something like:
selectedGraphic?.symbol = 1.0f // Need this one
But how to set the opacity to it, there is no setOpacity in this symbol class
OR how to get the PictureMarkerSymbol from the selected Graphic.?
I tried by cast it to PictureMarkerSymbol this way:
selectedMarker?.symbol as PictureMarkerSymbol
but here I am getting class cast exception
Also tried:
val markerGraphicsOverlay = selectedMarker?.graphicsOverlay
markerGraphicsOverlay?.opacity = 0.1f
but same result.
Cast Symbol to PictureMarkerSymbol
if (selectedGraphic!= null && selectedGraphic?.symbol != null) {
val pictureMarkerSymbol = selectedGraphic?.symbol as PictureMarkerSymbol
}
Related
I have been using java 17 and I'm unable to add icons into the map as a layer. please help me.
void drawTarget(double x, double y) {
SimpleFeatureTypeBuilder builder = new SimpleFeatureTypeBuilder();
builder.setName("MyFeatureType");
builder.setCRS( DefaultGeographicCRS.WGS84 ); // set crs
builder.add("location", LineString.class); // add geometry
// build the type
SimpleFeatureType TYPE = builder.buildFeatureType();
// create features using the type defined
SimpleFeatureBuilder featureBuilder = new SimpleFeatureBuilder(TYPE);
// GeometryFactory geometryFactory = JTSFactoryFinder.getGeometryFactory();
// Coordinate[] coords =
// new Coordinate[] {new Coordinate(79,25.00), new Coordinate(x, y)};
// line = geometryFactory.createLineString(coords);
// ln = new javafx.scene.shape.Line();
FontAwesomeIcon faico = new FontAwesomeIcon();
faico.setIconName("FIGHTER_JET");
faico.setX(76);
faico.setY(25);
faico.setVisible(true);
// TranslateTransition trans = new TranslateTransition();
// trans.setNode(faico);
featureBuilder.add(faico);
SimpleFeature feature = featureBuilder.buildFeature("FeaturePoint");
DefaultFeatureCollection featureCollection = new DefaultFeatureCollection("external", TYPE);
featureCollection.add(feature); // Add feature 1, 2, 3, etc
Style style5 = SLD.createLineStyle(Color.YELLOW, 2f);
Layer layer5 = new FeatureLayer(featureCollection, style5);
map.addLayer(layer5);
// mapFrame.getMapPane().repaint();
}
I want to add a font-awesome icon to the map
Currently, your code is attempting to use an Icon as a Geometry in your feature. I'm guessing that's what isn't working since you don't say.
If you want to use an Icon to display the location of a Feature then you will need two things.
A valid geometry in your feature, probably a point (since an Icon is normally a point)
A valid Style to be used by the Renderer to draw your feature(s) on the map. Currently, you are asking for the line in your feature to be drawn using a yellow line (style5 = SLD.createLineStyle(Color.YELLOW, 2f);)
I can't really help with step 1, since I don't know where your fighter jet currently is.
For step 2 I suggest you look at the SLD resources to give you some clues of how the styling system works before going on the manual to see how GeoTools implements that.
Since you are trying to add an Icon I suggest you'd need something like:
List<GraphicalSymbol> symbols = new ArrayList<>();
symbols.add(sf.externalGraphic(svg, "svg", null)); // svg preferred
symbols.add(sf.externalGraphic(png, "png", null)); // png preferred
symbols.add(sf.mark(ff.literal("circle"), fill, stroke)); // simple circle backup plan
Expression opacity = null; // use default
Expression size = ff.literal(10);
Expression rotation = null; // use default
AnchorPoint anchor = null; // use default
Displacement displacement = null; // use default
// define a point symbolizer of a small circle
Graphic city = sf.graphic(symbols, opacity, size, rotation, anchor, displacement);
PointSymbolizer pointSymbolizer =
sf.pointSymbolizer("point", ff.property("the_geom"), null, null, city);
rule1.symbolizers().add(pointSymbolizer);
featureTypeStyle.rules().add(rule1);
But that assumes that you can convert your FontAwesomeIcon into a static representation that the renderer can draw (png, svg). If it doesn't work like that (I don't use JavaFX) then you may need to add a new MarkFactory to handle them.
I have profile photo of users stored in Firebase and I want to know how I can create a marker with the user's profile photo with an orange border.
I tried some code from the internet and it works but the measurements seem to be wrong and I don't know what I'm doing wrong.
The code I used:
fun setMarkerPhoto(user:User, location: Location){
var bitmapFinal : Bitmap?
if(hasProfilePhoto){
/*val options = RequestOptions()
options.centerCrop()*/
Glide.with(this)
.asBitmap()
/*.apply(options)*/
.centerCrop()
.load(user.image)
.into(object : CustomTarget<Bitmap>(){
override fun onResourceReady(resource: Bitmap, transition: com.bumptech.glide.request.transition.Transition<in Bitmap>?) {
bitmapFinal = createUserBitmapFinal(resource)
markerOptions
.position(LatLng(location!!.latitude, location!!.longitude))
.title("Current Location")
.snippet(address)
.icon(BitmapDescriptorFactory.fromBitmap(bitmapFinal))
mCurrentMarker = googleMap.addMarker(markerOptions)
}
override fun onLoadCleared(placeholder: Drawable?) {
TODO("Not yet implemented")
}
})
}else{
markerOptions
.position(LatLng(mLastLocation!!.latitude, mLastLocation!!.longitude))
.title("Current Location")
.snippet(address)
.icon(BitmapDescriptorFactory.fromBitmap(smallMarker))
mCurrentMarker = googleMap.addMarker(markerOptions)
}
}
private fun createUserBitmapFinal(bitmapInicial: Bitmap?): Bitmap? {
var result: Bitmap? = null
try {
result = Bitmap.createBitmap(150,150, Bitmap.Config.ARGB_8888) //change the size of the placeholder
result.eraseColor(Color.TRANSPARENT)
val canvas = Canvas(result)
val drawable: Drawable = resources.getDrawable(R.drawable.ic_pickup)
drawable.setBounds(0, 0, 150,150) //change the size of the placeholder, but you need to maintain the same proportion of the first line
drawable.draw(canvas)
val roundPaint = Paint(Paint.ANTI_ALIAS_FLAG)
val bitmapRect = RectF()
canvas.save()
if (bitmapInicial != null) {
val shader =
BitmapShader(bitmapInicial, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP)
val matrix = Matrix()
val scale: Float = 200 / bitmapInicial.width.toFloat() //reduce or augment here change the size of the original bitmap inside the placehoder.
// But you need to adjust the line bitmapRect with the same proportion
matrix.postTranslate(5f, 5f)
matrix.postScale(scale, scale)
roundPaint.shader = shader
shader.setLocalMatrix(matrix)
bitmapRect[10f, 10f, 104f+10f]=104f+10f //change here too to change the size
canvas.drawRoundRect(bitmapRect, 56f, 56f, roundPaint)
}
I didn't really understand how to perfectly fit the bitmap image inside the placeholder. My marker looked like this:
also the image wasn't being center cropped even though I mentioned that it should be in the code, where it says Glide.centerCrop()
Also, I'm using GeoFire to display markers of users in a specified radius of the user and for now I can display a simple marker but I want the marker to have that user's profile photo too! How can I do it?
GeoFire Code:
val geoQuery: GeoQuery = geoFire.queryAtLocation(GeoLocation(location.latitude, location.longitude), 0.5)
geoQuery.addGeoQueryEventListener(object : GeoQueryEventListener {
override fun onKeyEntered(key: String, location: GeoLocation) {
println(String.format("Key %s entered the search area at [%f,%f]", key, location.latitude, location.longitude))
Log.i("key entered","User found around you")
val aroundYou = LatLng(location.latitude, location.longitude)
if (markerList != null) {
for (marker in markerList) {
marker.remove()
}
}
otherMarkerOptions
.position(aroundYou)
.title("Current Location")
//.snippet(address)
.icon(BitmapDescriptorFactory.fromBitmap(smallMarker)) //This is a simple marker but i want it to have the user's profile photo
markerList.add(googleMap.addMarker(otherMarkerOptions))
//}
}
Thank you in advance
Edit:
In the line: val drawable: Drawable = resources.getDrawable(R.drawable.ic_pickup)
It's this png:
I want to insert the profile photo of the user on that drawable file and if the user doesn't have a profile photo then only the drawable photo will be visible.
You get the code to transform the bitmap from my code in another question in StrackOverflow. As I mentioned there, I can´t teste the code because i´m only working with flutter right now.
But looking ate your code I might try this:
Add this function:
fun dp(value: Float): Int {
return if (value == 0f) {
0
} else Math.ceil(resources.displayMetrics.density * value.toDouble()).toInt()
}
in your lines:
result = Bitmap.createBitmap(150,150, Bitmap.Config.ARGB_8888);
drawable.setBounds(0, 0, 150,150);
change to:
result = Bitmap.createBitmap(dp(62f), dp(76f), Bitmap.Config.ARGB_8888);
drawable.setBounds(0, 0, dp(150f), dp(150f)) ;
let me know the results.
This is likely embarrassingly easy but I'm new and I've been beating my head against the wall on this for a while now. What I am attempting to do is basically a modified version of the "Hello App Maker!" If else test.
The necessary info I have the following widgets attached to the appropriate data sources:
Dropdown widget called source_name (string - list)
Label widget I've called name (string)
Text Box widget called qty_duration (number)
Label widget I've called hours (number)
I have a dropdown widget called source_name with 5 options. On selection I have the value appear in a label widget I've called name. If the option selected from the drop down widget is ever LABOUR I am trying to then have the value of a Text Box widget called qty_duration appear in a label widget I've called hours
On the source_name dropdown event - onValueChange I have the following code:
// Define variables for the input and output widgets
var nameWidget = app.pages.Apex_job_details.descendants.name;
var outputWidget = app.pages.Apex_job_details.descendants.hours;
var techhours = app.pages.Apex_job_details.descendants.qty_duration;
var nothing = 0;
// If a name is LABOUR, add the qty to the output widget Else output 0.
if (nameWidget == 'LABOUR') {
outputWidget.text = techhours;
} else {
outputWidget = nothing;
}
It's not giving me any errors, but it's also not outputting to the hours label. If I edit the code as follows just to muck with it:
// Define variables for the input and output widgets
var nameWidget = app.pages.Apex_job_details.descendants.name;
var outputWidget = app.pages.Apex_job_details.descendants.hours;
var techhours = app.pages.Apex_job_details.descendants.qty_duration;
var nothing = 0;
// If a name is LABOUR, add the qty to the output widget Else output 0.
if (nameWidget == 'LABOUR') {
outputWidget.text = techhours;
} else {
outputWidget.text = nothing;
}
I'm not sure what I'm doing wrong.
Assuming all labels and input widgets are inside a table row you will want to adjust your code as follows:
var tablerow = widget.parent;
var nameWidget = tablerow.descendants.name.text;
var outputWidget = tablerow.descendants.hours;
var techhours = tablerow.descendants.qty_duration.value;
if(nameWidget === 'LABOUR') {
outputWidget.text = techhours;
} else {
outputWidget.text = null;
}
By using widget.parent in the onValueChange event of the dropdown you will automatically reference the table row and then by using descendants you are referencing only the descendants of that table row. This will bridge the error by using an absolute reference when using table rows. If it still doesn't work let me know.
I am working with System.Web.UI.DataVisualization.Charting to create some line charts. I want to show tooltips(x and y value of the datapoint) when mouse over on a data point of a series.
As shown in the chart image, i want a tooltip when mouse is hovered on the red circle.
chart image
I added series.ToolTip method but , its not working.
here is my createSeries meothod
private System.Web.UI.DataVisualization.Charting.Series CreateSeries(List<X> xAxisData, List<Y> yAxisdata)
{
// Chart Series
System.Web.UI.DataVisualization.Charting.Series _series =
new System.Web.UI.DataVisualization.Charting.Series(this.SeriesNameList[this.seriesCount]);
_series.ChartType = this.ChartType;
// Bind the data
_series.Points.DataBindXY(xAxisData, yAxisdata);
// Set Default Properties
_series.Font = this.GetFontForSeries();
_series.LabelForeColor = this.GetLabelColor();
// Add Transparent Marker to increase mouse area for ToolTip
_series.MarkerStyle = System.Web.UI.DataVisualization.Charting.MarkerStyle.Circle;
_series.MarkerSize = 7;
_series.ToolTip = "hello";
//// Smart Labels
_series.SmartLabelStyle.Enabled = true;
_series.SmartLabelStyle.MinMovingDistance = 5;
_series.SmartLabelStyle.MaxMovingDistance = 50;
_series.SmartLabelStyle.MovingDirection =
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Top |
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.TopLeft |
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.TopRight |
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Bottom |
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.BottomLeft |
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.BottomRight |
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Left |
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Right |
System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Center;
_series.SmartLabelStyle.IsOverlappedHidden = true;
_series.SmartLabelStyle.AllowOutsidePlotArea = System.Web.UI.DataVisualization.Charting.LabelOutsidePlotAreaStyle.Yes;
this.seriesCount++;
return _series;
}
private void InitializeChart()
{
this.Chart.IsMapEnabled = false;
this.Chart.RenderType = System.Web.UI.DataVisualization.Charting.RenderType.ImageTag;
this.Chart.ImageType = System.Web.UI.DataVisualization.Charting.ChartImageType.Png;
this.Chart.AntiAliasing = System.Web.UI.DataVisualization.Charting.AntiAliasingStyles.Graphics;
this.Chart.TextAntiAliasingQuality = System.Web.UI.DataVisualization.Charting.TextAntiAliasingQuality.High;
this.CreateTitle();
this.CreateLegends();
}
Can someone help me ?
I searched through some of the questios but couldn't find a solution.
You need to add the tooltip to the points.
Points.DataBindXY does not have a way of binding extended chart properties like tooltips. (Points.DataBind appears to, btw)
Source: http://blogs.msdn.com/b/alexgor/archive/2009/02/21/data-binding-ms-chart-control.aspx
So a workaround is to loop through your series points and add the tooltip manually to the points. You can do so using / modifying the code below. (#VALX and #VAL is one way of adding the XY coordinate without directly reading the value, another way would be to read the XY values directly)
// Bind the data
_series.Points.DataBindXY(xAxisData, yAxisdata);
// Set Tooltips
foreach(var point in _series.Points)
{
point.ToolTip = "(#VALX, #VAL)";
}
// Set Default Properties
_series.Font = this.GetFontForSeries();
_series.LabelForeColor = this.GetLabelColor();
Alternate way not using keywords:
// Bind the data
_series.Points.DataBindXY(xAxisData, yAxisdata);
// Set Tooltips
foreach(var point in _series.Points)
{
point.ToolTip = "(" + point.X + ", " + point.YValues[0] + ")";
}
// Set Default Properties
_series.Font = this.GetFontForSeries();
_series.LabelForeColor = this.GetLabelColor();
I am quite new to OpenLayers. Right now, I have a polygon vector with some styling applied and a label.
var style = $.extend(true, {}, OpenLayers.Feature.Vector.style['default']);
style.pointRadius = 15;
style.label = "My Polygon";
style.fillColor = #f00;
style.strokeColor = #000;
var styleMap = new OpenLayers.StyleMap({"default" : style});
var polygonLayer = new OpenLayers.Layer.Vector("Polygon Layer", {styleMap: styleMap});
At some point after doing some processing, I want to display the result as a label. How can I update the label? I figure it would be something like this, but this wasn't the way.
polygonLayer.options.styleMap.styles.label = "Updated label";
Thanks in advance.
You are on the right way. You can set new label for all features in a layer like that:
polygonLayer.styleMap.styles.default.defaultStyle.label = "new label";
polygonLayer.redraw();
As you see it's important to call redraw() method after you set new value.
That's how you change label for all features in a layer. Quite often though you'll need to set new labels per feature. To achieve that you should do following when you create pollygonLayer:
var style = $.extend(true, {}, OpenLayers.Feature.Vector.style['default']);
style.label = "${feature_name}";
Each feature has a collection of attributes. In this case value of attribute feature_name will be displayed as a label. To change label value per feature you simply change value of the attribute on that feature and then of course call redraw() on layer.