So, I have been working to style my map. But, stepped on a hitch back, such as to how to remove the neighbouring country name. So, my focus of work is only on INDIA. Also, how to not let map zoom out after INDIA boundaries because it now zooms out all the way.
For refrence see img
home
Google Maps has a styling wizard where it's easy to customize your map, I found the administrative.country property and set visibility off in styler.
https://mapstyle.withgoogle.com/
Above link will help.
Related
I am using microsoft-graph-toolkit react in SPFx 1.15.0 webpart
I have an Ag-Grid rows each with a cell containing a Person
<Person personQuery={params.data.RequestFor.Email} showPresence={true}
view={PersonViewType.oneline}
personCardInteraction={PersonCardInteraction.hover} >
</Person>
when users hover the default PersonCard appears under the other grid rows and doesn't show on top even though I set the z-order to 13000000
Is there another way to make it show on top of everything?
When I add a template with PersonCard, I do not see anything
Thank you
For anyone with same issue, use a FluentUi callout to show the same persons PersonCard (no need for a div around it) it will show at the highest z-order and figure out if to show up or down based on the location in the browser.
I have an Image (map of Africa). I want each countries to be clickable such that a new form is opened on tap. Is this possible with CN1?
I have checked the cn1libs portal and can't find any library that does this.
I thank you
Create two maps. One would look like you want the map to look on the screen. The other would use a different color for every country.
Use a pointer listener or pointerReleased on a focusable component to track user taps on the map so you'd have an X/Y coordinate.
Use getRGB() to get the RGB colors of the pixels in the color map, then get the color at rgb[x + y * imageWidth]
This color represents the country that was picked and you can map to that using a switch statement.
I am using the npm package react-image-mapper to map certain areas on a hotel floor plan image. Now I want to add a permanent red highlight on the rooms that are already booked and highlight other rooms with a different color on hover.
The react-image-mapper has the option to change the fillColor prop of the component. But it changes for all the areas. I want to change it for certain areas only. Is there a way to achieve this in react-image-mapper?
Are you using this library? If yes, then update it and you will have flexibility to change particular areas. If you do not find it then try downloading the library from this link.
I am creating a basic map with ng-Map. I want to hide names of all roads/streets. How can I do it?
you can hide the road/street name by setting your own styles, and then set the styles to google map by map.setOptions({styles: customeStyles});
check this plunker.
We are trying to add a Google map custom control to the 4th tab of a tabbed pane in XPages
When we do we get this:
A map with ONLY the first small 10th of the map draw in the top left corner.
As you can see only the first section of the map will load.
I've googled around and it appears that if the map IS NOT on the first tab it wont work without a 'tab change recall of the map initialise function'
I've tested this and it's true, when the map is the selected tab the map loads fine.
Here is our markup:
<xe:djTabPane id="djTabPaneMap" title="Map">
<xp:panel style="height:290px;width:860px" id="panel6">
<xc:ccGoogleMaps map_height="290" map_width="860"
map_width_measurement="px" map_height_measurement="px"
map_zoom="5" map_type="ROADMAP" map_center_type="Address"
map_center_address="Broadstairs">
</xc:ccGoogleMaps>
</xp:panel>
</xe:djTabPane>
It's really basic stuff I know, but we can't seem to get the initialise map function called from switching the tab.
Any ideas???
I am afraid that despite many attempts to call the build map function on tab change - using either the ID or CSS class name we are unable to draw our map fully.
When the map is outside the tabbed panel there is no issue.
Once I use Firebug to inspect the panel the map renders correctly
Many thanks!
Andrew
AFAIK, a Google map must be in an IFRAME. Or is it ?