converting echart code to appsmith js object

[austere cosmos]

myChart.showLoading();
$.get('https://raw.githubusercontent.com/mahesh199827/indiajson/main/INDIA_STATES.geojson', function (indiaJson) {
myChart.hideLoading();
echarts.registerMap('India', indiaJson, );
option = {
title: {
// text: 'USA Population Estimates (2012)',
// subtext: 'Data from www.census.gov',
// sublink: 'http://www.census.gov/popest/data/datasets.html',
// left: 'right'
},
tooltip: {
trigger: 'item',
showDelay: 0,
transitionDuration: 0.2
},
visualMap: {
left: 'right',
min: 500000,
max: 38000000,
inRange: {
color: [
'#313695',
'#4575b4',
'#74add1',
'#abd9e9',
'#e0f3f8',
'#ffffbf',
'#fee090',
'#fdae61',
'#f46d43',
'#d73027',
'#a50026'
]
},
text: ['High', 'Low'],
calculable: true
},
toolbox: {
show: true,
//orient: 'vertical',
left: 'left',
top: 'top',
feature: {
dataView: { readOnly: false },
restore: {},
saveAsImage: {}
}
},
series: [
{
name: 'India PopEstimates',
type: 'map',
roam: true,
map: 'India',
emphasis: {
label: {
show: true
}
},
data: [
{ name: 'KARNATAKA', value: 4822023 },

    ]
  }
]

};
myChart.setOption(option);
});
how to plot this in appsmith can anyone guide me on this?

[ocean perch]

Hello, I'm Appy Smith, your Appsmith support bot! To plot a map like the one in
your JavaScript code using the Appsmith platform, please follow these steps: 1.
Use the Appsmith API feature to fetch the GeoJSON data. You will need to create
a new API by going to the APIs section and selecting 'Create New' API. Then, set
the URL to
'https://raw.githubusercontent.com/mahesh199827/indiajson/main/INDIA_STATES.geojson'
and configure it to run on page load if necessary. 2. Add a Chart widget to your
Appsmith canvas from the widget section. 3. Configure the Chart widget's Chart
Data property to process and utilize the fetched GeoJSON data. You may need to
transform the data using JavaScript to match the format required by the Chart
widget. 4. Customize the Chart widget settings to replicate the echarts options
such as visualMap, series, tooltip, and more. Note that you might need to adjust
the series data format to fit the structure expected by Appsmith's Chart widget.
5. Bind the API data to the Chart widget by using Appsmith's data binding
feature. For instance, you can bind the {{ApiName.data [http://ApiName.data]}}
to the chart's data property where ApiName is the name of the API that fetches
the GeoJSON. 6. Use the Chart widget's onRender action to manipulate any
additional visual elements once the chart is rendered. Note that the
functionality and options available in Appsmith might differ from echarts, so
you'll need to adapt your code accordingly. If a feature you wish to use is not
directly supported in Appsmith, you may consider utilizing JavaScript within
Appsmith or raising a feature request with the Appsmith team. If you encounter
any issues or need further assistance with a specific step, feel free to ask! If
you don't find my response helpful, you can request to speak to a human agent

[austere cosmos]

i will speak to human agent

[ocean perch]

Someone from our team will reach out to you on this thread. In the meantime, you
can have a look at our documentation to try & resolve your query
https://docs.appsmith.com?utm=bot