首页 > 其他分享 >Highcharts- maps 地图点和线的定义

Highcharts- maps 地图点和线的定义

时间:2023-12-27 17:36:13浏览次数:30  
标签:name geometry 点和线 地图 maps type Highcharts 定义

需求

地图点和线通过经度和纬度的点或数组添加到地图中。自 v10 以来的 Highcharts 地图使用 GeoJSON 定义来定义点和线串:geometry

分析与解决

地图点定义:

对于地图点数据点,速记点配置是直接在选项中设置和属性。Lonlat

{
   
type: 'mappoint',
   
data: [{
       
lon: 4.90,
       
lat: 53.38,
       
name: 'Amsterdam'
   
}, {
       
lon: -118.24,
       
lat: 34.05,
       
name: 'LA'
   
}]
}

长配置是添加一个,其中是经纬度的类型。Highcharts 支持这两种形式的原因是该定义允许直接从 GeoJSON 和 TopoJSON 源应用地图。geometrycoordinatesPointgeometry

{
   
type: 'mappoint',
   
data: [{
       
geometry: {
           
type: 'Point',
           
coordinates: [4.90, 53.38]
       
},
       
name: 'Amsterdam'
   
}, {
       
geometry: {
           
type: 'Point',
      
     coordinates: [-118.24, 34.05]
       
},
       
name: 'LA'
   
}]
}

地图线定义:

对于地图线,添加类型。当时,应该是经纬度元组的二维数组,而需要三维数组。geometryLineStringMultiLineStringLineStringcoordinatesMultiLineStringcoordinates

请注意,根据投影的不同,两点之间的地图线可能会呈现为曲线。这是因为 Highcharts 渲染了测地线,即地球表面两点之间的最短路径。

{
   
type: 'mapline',
   
data: [{
       
geometry: {
           
type: 'LineString',
           
coordinates: [
                [4.90, 53.38], // Amsterdam
                [-118.24, 34.05] // Los
Angeles
           
]
       
}
   
}]
}

希望这些信息对大家有所帮助!如果您有任何其他问题,请随时提问。

标签:name,geometry,点和线,地图,maps,type,Highcharts,定义
From: https://blog.51cto.com/u_15674553/9001988

相关文章

  • 简化属性拷贝插件 MapStructs 使用指北
    MapStruct使用指南1、安装与介绍what?mapstruct是一个代码生成器,可以简化实现javabean之间的转换的配置方法生成的代码使用传统的方法实现getset属性,比起反射更快、更简单、更安全,易于理解why?基于多层的应用经常需要映射不同的对象模型如VO->TDO等;属性转换的代码......
  • Roaring bitmaps
    Roaringbitmaps最近看一篇文章,里面涉及到使用roaringbitmaps来推送用户广告并通过计算交集来降低用户广告推送次数。本文给出roaringbitmaps的原理和基本用法,后续给出原文的内容。本文来自:AprimeronRoaringbitmaps:whattheyareandhowtheywork目录Roaringbitmaps......
  • Highcharts-Stock 的技术指标配置​
    需求技术指标是用来更好的查看股票数据及做决策的强大工具,一般是基于现有股票数据按照一定的数学公式进行运算,从而创建股价边界或走势,方便做分析和决策。技术指标相关的功能是以数据列的形式实现的,这也就意味着大部分数据列配置也可以在技术指标中使用,唯一需要注意的是技术指标数......
  • MapStruct+Maven+Lombok问题NoSuchBeanDefinitionException、does not have an access
    概述先直接说我遇到的问题吧,SpringBoot应用启动失败:ERROR|org.springframework.boot.web.embedded.tomcat.TomcatStarter|onStartup|61|-ErrorstartingTomcatcontext.Exception:org.springframework.beans.factory.UnsatisfiedDependencyException.Message:Error......
  • Wpf Bitmap(Image)Base64,Url,文件Path,Stream转BitmapSource(ImageSource),无需外部d
    直接上代码usingSystem;usingSystem.Drawing;usingSystem.IO;usingSystem.Windows.Forms;usingSystem.Windows.Media.Imaging;namespaceCommonUtils{///<summary>///Windows图片处理///</summary>publicstaticclassWindowsImage......
  • HighCharts 基础股票图
    需求:将基本图表转换为股票图表。修改库存的基本元素。注意范围的位置选择器、按钮数量、内容、初始选择和外观。同时定位菜单和标题。自定义底部的导航。分析:基本图表转换股票图表使用Highcharts.stockChart转换,修改库存基本元素stockTools解决定位菜单标题使用相关属性设定具体请......
  • 使用MapStruct进行对象的转换
    在Java系统工程开发过程中,都会有各个层之间的对象转换,比如VO、DTO、PO、VO等,而如果都是手动get、set又太浪费时间,还可能操作错误,选择一个自动化工具会更加方便。目前市面上有大概12种类型转换的操作,如下:MapStruct可以直接在编译期间生成getset方法,非常方便快捷,且不耗费性......
  • mapstruct报错 No property named "XXXX" exists in source parameter(s). Type "XXXX
    1、问题现象java:Nopropertynamed"XXXX"existsinsourceparameter(s).Type"XXXX"hasnoproperties.2、相关环境依赖版本jdk:17maven:3.8.8springboot:3.1.4lombok:1.18.30mapstruct:1.5.53、解决办法在pom.xml中加入如下配置<annotationProcessor......
  • HighCharts 以轴标签为标签+蓝色圆圈跟随鼠标移动
    需求:画一个蓝色圆圈跟随鼠标移动,点击图表并保存这个点,点的右侧有以轴标签为标签的标签分析:调用load事件,使用renderer画个圆圈跟随鼠标,点击图标保存点用click事件,在click事件里使用renderer画一个圆和标签,标签以轴为单位解决:源代码:示例:HighCharts以轴标签为标签及蓝色圆圈跟随鼠......
  • Highcharts 用SVGRenderer方法点击鼠标移动光标​
    需求演示如何使用SVGRenderer方法来实现点击鼠标移动光标,并解释说明属性功能。分析使用SVGRenderer方法来实现点击鼠标移动光标,可以按照以下步骤进行操作:创建SVGRenderer实例:首先,你需要创建一个SVGRenderer实例,用于渲染SVG元素和操作SVG属性。设置SVG元素属性:使用SVGRenderer的方法......